Small sidebar visual tweaks
What does this MR do and why?
Tweak active nav item with avatar styling
This shifts the active indicator of sidebar nav items left by 1 pixel when the item has an avatar.
This shift is done using px
rather than rem
units so that it doesn't
scale with root font size. Using rem
units would make the shift
smaller/bigger than it needed to be, if the root font size were
reduced/increased.
Part of #415812 (closed).
Changelog: changed
Use theme colour in sidebar context header
Part of #415812 (closed)
Changelog: changed
Screenshots or screen recordings
Active indicator
Before | After |
---|---|
Context header
Before | After |
---|---|
How to set up and validate locally
Active indicator
- Go to a project or user profile page
- Observe the active indicator for the "overview" nav item (the one with the avatar) is 1px offset from the avatar.
- Use your browser settings to change the default root font size to something other than 16px
- Possibly refresh the page to get the new font size
- Repeat 1. and 2., and observe that the indicator isn't shifted too little/much.
Context header colour
- Go to user preferences
- Change the colour theme
- Observe the context header colour matches the theme
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Related to #415812 (closed)
Edited by Mark Florian