Skip to content

Commit 1d9eeff

Browse files
feat: add active section highlight to settings nav for dark themes (#29)
Add explicit CSS rules for the active settings navigation button in Metro Teal and Neon Love themes. The active state background and text colors now match each theme's color palette (teal for Metro Teal, cyan for Neon Love), making the currently selected section visually distinct in the settings navigation.
1 parent b4ed57b commit 1d9eeff

1 file changed

Lines changed: 10 additions & 0 deletions

File tree

app/frontend/styles.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -334,6 +334,11 @@ aside button:hover svg {
334334
border-color: rgba(0, 183, 195, 0.4) !important;
335335
}
336336

337+
[data-theme-preset='metro-teal'] [data-testid='settings-view'] nav button.bg-primary\/15 {
338+
background-color: rgba(0, 183, 195, 0.15) !important;
339+
color: #00C4CC !important;
340+
}
341+
337342
/* Metro-teal scrobbling toggle needs explicit colors (Tailwind bg-primary/bg-muted resolve transparent) */
338343
[data-theme-preset='metro-teal'] [data-testid='lastfm-toggle'].bg-muted {
339344
background-color: hsl(0 0% 25%) !important;
@@ -487,6 +492,11 @@ aside button:hover svg {
487492
border-color: rgba(65, 200, 229, 0.4) !important;
488493
}
489494

495+
[data-theme-preset='neon-love'] [data-testid='settings-view'] nav button.bg-primary\/15 {
496+
background-color: rgba(65, 200, 229, 0.15) !important;
497+
color: #41C8E5 !important;
498+
}
499+
490500
[data-theme-preset='neon-love'] [data-testid='lastfm-toggle'].bg-muted {
491501
background-color: hsl(268 30% 25%) !important;
492502
}

0 commit comments

Comments
 (0)