ifmeorg / ifme

Free, open source mental health communication web app to share experiences with loved ones
http://www.if-me.org/
GNU Affero General Public License v3.0
1.46k stars 734 forks source link

Issue#2155 ux #2171

Closed saminarp closed 1 year ago

saminarp commented 1 year ago

Description

With the following changes in client/app/components/Header/Header.scss, the navbar will be sticky.

More Details

The fixed navbar is not supported in mobile view. I intentionally left it out because the background is transparent in the navbar (i.e, background: transparent;) Giving the navbar a subtle color would prevent any clashes from occurring as a result of scrolling.

Corresponding Issue

This enhancement addresses the issue https://github.com/ifmeorg/ifme/issues/2155.

Screenshots

Current behavior: navbar is in fixed position even with the scoll.

CleanShot 2022-10-13 at 05 05 29@2x

The screenshot below is the background color I would propose using but haven't implemented yet.

This would prevent the clashes with logo and content on the scroll

CleanShot 2022-10-13 at 05 02 41@2x

Reviewing this pull request? Check out our Code Review Practices guide if you haven't already!

welcome[bot] commented 1 year ago

Thank you for opening this pull request with us! Be sure to follow our Pull Request Practices. Let us know if you have any questions on Slack.

saminarp commented 1 year ago

Hello, I made a mistake force pushing the changes, please do not merge it. I will be creating a separate branch and push the updated PR

saminarp commented 1 year ago

Please refer to this PR and ignore the previous