feature/34b-enhance-user-profile-page

[mqnguyen5]

Related issue

Fixes #152

Type of Change

• Feat: Change which adds functionality/new feature
• Fix: Change which fixes an issue
• Refactor: Change which improves the structure of the code
• Docs: Change which improves documentation

Description

In response to @minhhang107 request on the PR for issue #34, I have made some small changes which should make the current UI looks a bit better, specifically:

• Changed grid layout from 3 to 4 elements per row
• Added extra padding to the bottom of page
• Removed download option when viewing images from the gallery

As for figuring out how to reduce the image size when zoomed in, I have tried some options in lightGallery.js, but couldn't able to find any solutions.

Screenshot

Please add a screenshot of the changes made by this PR (if applicable)

Testing

Has this pull request been tested?

• Yes

Please describe shortly how you tested it:

• Chrome/Firefox Dev Tools

Note

The title of your PR should follow this format: [Type](area): Title

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/tuanthanh2067/seeksi/GNLsg4UyNCEbpvBGGteNihfgYruB
✅ Preview: https://seeksi-git-feature-34b-enhance-user-profile-page-tuanthanh2067.vercel.app

[minhhang107]

About the zoom feature of lightGallery, no worries we can skip it.
Can you refer to #152 and include other enhancements in this PR as well? Thanks~

[mqnguyen5]

Here are some images of the profile page after the changes:

However, I realized that the colour we used for the navbar was a bit transparent, which make the navbar look like this when on top of other elements:

@minhhang107 and @hlavu you guys have any suggestions on which colour should we use as an alternative?

[minhhang107]

I think we can do gradient from pink to white instead of to transparent

[minhhang107]

Hey I had a quick meeting with BE team earlier and they prefer grid of 3 so can you change it back to 3? You can refer to Edit page to make the 2 pages consistent. I'm sorry for this inconvenience 😞

[mqnguyen5]

No worries! Thanks for letting me know. I'll make the changes as soon as possible. I'm sorry for the late reply

[minhhang107]

Great work! Please pull the latest code then feel free to merge