Skip to content

refactor: Fix header styling issues #1292

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
rschristian merged 7 commits into from
Jun 11, 2025
Merged

refactor: Fix header styling issues #1292

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
309aea6
refactor: Simplify i18n color change on drop down
rschristian Jun 10, 2025
16a9377
refactor: Sidebar toggle should be below expanded header
rschristian Jun 10, 2025
6ae52ba
fix: Stop nav links in header from wrapping
rschristian Jun 10, 2025
5fd605e
fix: Ensure header dropdown arrow is vertically centered
rschristian Jun 10, 2025
f797bf3
fix: Social items in header
rschristian Jun 10, 2025
410c2eb
fix: Specificity
rschristian Jun 11, 2025
297aaf0
fix: Dropdown arrow alignment in expanded header
rschristian Jun 11, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/assets/icons.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 0 additions & 6 deletions src/components/header/style.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,12 +255,6 @@
& > button {
background: #fff;
color: #555;
z-index: 101;

svg {
filter: invert(40%) sepia(0%) saturate(3773%) hue-rotate(315deg)
brightness(73%) contrast(81%);
}
Comment on lines -258 to -263

@rschristian rschristian Jun 10, 2025

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The z-index is entirely unused, goes back to the repo creation. This style would only apply to the 'About' or i18n dropdown buttons which wouldn't need a z-index as they're kept inline, exactly where they were.

The SVG filter is a far more complex method of updating the icon color; way easier to just switch the icon to use currentColor and piggyback off the color setting just a few lines up (color: #555).

}

nav {
Expand Down