feat: active nav tab uses module accent colour
This commit is contained in:
@@ -321,6 +321,11 @@ function updateNav(path) {
|
|||||||
|
|
||||||
// Bottom-Nav zur aktiven Seite scrollen
|
// Bottom-Nav zur aktiven Seite scrollen
|
||||||
scrollNavToActive();
|
scrollNavToActive();
|
||||||
|
|
||||||
|
// Modul-Akzentfarbe auf :root setzen — wird von Nav-CSS gelesen
|
||||||
|
const route = ROUTES.find(r => r.path === path);
|
||||||
|
const accent = route?.module ? getCSSToken(`--module-${route.module}`) : '';
|
||||||
|
document.documentElement.style.setProperty('--active-module-accent', accent || '');
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderError(container, err) {
|
function renderError(container, err) {
|
||||||
|
|||||||
@@ -192,7 +192,7 @@
|
|||||||
|
|
||||||
/* ── Nav-Item: Aktiv ── */
|
/* ── Nav-Item: Aktiv ── */
|
||||||
.nav-item[aria-current="page"] {
|
.nav-item[aria-current="page"] {
|
||||||
color: var(--color-accent);
|
color: var(--active-module-accent, var(--color-accent));
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-item__icon {
|
.nav-item__icon {
|
||||||
@@ -384,9 +384,9 @@
|
|||||||
|
|
||||||
/* ── Aktiv: Hintergrund-Highlight + Akzent-Indikator ── */
|
/* ── Aktiv: Hintergrund-Highlight + Akzent-Indikator ── */
|
||||||
.nav-sidebar .nav-item[aria-current="page"] {
|
.nav-sidebar .nav-item[aria-current="page"] {
|
||||||
color: var(--color-accent);
|
color: var(--active-module-accent, var(--color-accent));
|
||||||
font-weight: var(--font-weight-semibold);
|
font-weight: var(--font-weight-semibold);
|
||||||
background-color: var(--color-accent-light);
|
background-color: color-mix(in srgb, var(--active-module-accent, var(--color-accent)) 12%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Akzentstreifen links */
|
/* Akzentstreifen links */
|
||||||
@@ -398,7 +398,7 @@
|
|||||||
bottom: 6px;
|
bottom: 6px;
|
||||||
width: 3px;
|
width: 3px;
|
||||||
border-radius: 0 var(--radius-full) var(--radius-full) 0;
|
border-radius: 0 var(--radius-full) var(--radius-full) 0;
|
||||||
background: var(--color-accent);
|
background: var(--active-module-accent, var(--color-accent));
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Active-Press auf Desktop */
|
/* Active-Press auf Desktop */
|
||||||
|
|||||||
Reference in New Issue
Block a user