Account Button replaced with User's GitHub Profile Picture

[anirudhp26]

Fixes Issue

fixes #9691

Changes proposed

Check List (Check all the applicable boxes)

• My code follows the code style of this project.
• My change requires changes to the documentation.
• I have updated the documentation accordingly.
• All new and existing tests passed.
• This PR does not contain plagiarized content.
• The title of my pull request is a short description of the requested changes.

Screenshots

Before

Before: Mobile Version

After

After: Mobile Version

Note to reviewers

[sital002]

Tested on:
Environment: Local Development
OS: Ubuntu
Browser: Firefox
works well but the image is too big and while hovering the borders are making it weird as well.
After changes:

[anirudhp26]

Tested on: Environment: Local Development OS: Ubuntu Browser: Firefox works well but the image is too big and while hovering the borders are making it weird as well. After changes:

Then we can remove the borders or we can make them rounded, circle around the image.

I'll try different designs and let you know 👍

[anirudhp26]

Check this out, changed the size to 40, border is now rounded, and also the alt text is more relatable

[Abhishek-90]

Check this out, changed the size to 40, border is now rounded, and also the alt text is more relatable

This does look better than the previous hover effect.

[eddiejaoude]

Please update the PR description with the latest screenshots

[anirudhp26]

Done

[eddiejaoude]

Thank you 👍 please include the mobile responsive before/after also

[badrivlog]

I'm not sure why the manage profile navigation link size is bigger than other links?

It's my suggestion, I think for consistent design we should use same size for all navigation links, ensuring they look visually related and don't create confusion for users.

[anirudhp26]

Thank you 👍 please include the mobile responsive before/after also

Surely, I'll include that

[anirudhp26]

I'm not sure why the manage profile navigation link size is bigger than other links?

It's my suggestion, I think for consistent design we should use same size for all navigation links, ensuring they look visually related and don't create confusion for users.

but shrinking user's photo to that size won't look good according to me

[eddiejaoude]

Thank you, looks good 👍

On mobile navbar does not close after clicking on profile picture like other nav links do.

Please also see inline comment.

[anirudhp26]

Working on the navbar closing issue

[eddiejaoude]

Looks good, thank you 👍