kbenestad/mdcms
1
0
Fork 0
mirror of https://github.com/kbenestad/mdcms.git synced 2026-06-18 15:24:32 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix category picker and hamburger using page colours instead of nav colours

Browse source 
Both elements render against --bg-nav but were using --font-colour (the page
text colour). Switch to --nav-link-colour / --nav-section-heading-colour /
--nav-link-active-colour so they remain legible when nav-background is set to
a colour that contrasts with the page text colour (e.g. dark blue nav with
white nav-link text).

https://claude.ai/code/session_01MA8V1FvCmxjkCYyTxseaxB
This commit is contained in:
Claude 2026-05-19 06:24:16 +00:00
parent cef2318210
commit c47c0b81ac
No known key found for this signature in database
1 changed files with 4 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
app/index.html
View file

@ -448,7 +448,7 @@ body {
border: none; border: none;
cursor: pointer; cursor: pointer;
padding: 0.4rem; padding: 0.4rem;
color: var(--font-colour); color: var(--nav-link-colour, var(--font-colour));
z-index: 150; z-index: 150;
} }
.hamburger svg { width: 22px; height: 22px; } .hamburger svg { width: 22px; height: 22px; }
@ -627,17 +627,17 @@ body {
padding: 0.55rem 0.85rem; padding: 0.55rem 0.85rem;
cursor: pointer; cursor: pointer;
font-size: 0.88rem; font-size: 0.88rem;
color: var(--font-colour); color: var(--nav-link-colour, var(--font-colour));
border-bottom: 1px solid var(--divider); border-bottom: 1px solid var(--divider);
transition: background 0.1s; transition: background 0.1s;
} }
.category-option:last-child { border-bottom: none; } .category-option:last-child { border-bottom: none; }
.category-option:hover { background: var(--nav-hover-bg); } .category-option:hover { background: var(--nav-hover-bg); }
.category-option.active { background: var(--nav-active-bg); color: var(--accent); font-weight: 600; } .category-option.active { background: var(--nav-active-bg); color: var(--nav-link-active-colour, var(--accent)); font-weight: 600; }
.category-option .secondary { .category-option .secondary {
display: block; display: block;
font-size: 0.75rem; font-size: 0.75rem;
color: var(--font-colour-muted); color: var(--nav-section-heading-colour, var(--font-colour-muted));
margin-top: 0.15rem; margin-top: 0.15rem;
} }