fix(themes): keep sidebar toggle inline in Alternative-Dark and Flat (#8736)

In Alternative-Dark and Flat (and Dark-pink via its `../Alternative-Dark/adark.css` import), the sidebar toggle button (`#nav_menu_toggle_aside`) overlaps the next button.

Base-theme positions the toggle absolutely (`position: absolute; left: 0.5rem`) and reserves space for it via `.nav_menu { padding-left: 3rem }`. Each affected theme overrides `.nav_menu` with `padding: 5px 0`, explicitly setting no horizontal padding. With no reserved space and the toggle still absolute, the toggle floats over the start of `#nav_menu_actions`.

The fix sets `#nav_menu_toggle_aside { position: static }` per theme, so the toggle flows inline at the start of `.nav_menu` alongside the action buttons. This respects each theme's stated layout choice (no horizontal padding) rather than overriding it to restore base's reservation. The same `position: static` approach was previously approved for Nord in #8711.

Themes that explicitly reserve horizontal space (Ansum, Mapco, Pafat) or preserve base's reservation (Dark, Origine, Origine-compact) are unaffected. Dark-pink needs no changes of its own; it inherits the fix via Alt-Dark.

### Screenshot

#### Bug, wide width: toggle overlapping next button
<img width="62" height="47" alt="alt-dark overlap before fix" src="https://github.com/user-attachments/assets/ae33a9c1-5abb-40d4-b17d-9288c355a86c" />


### Notes

- `.rtl.css` regenerated via `make rtl`.
- `npm run stylelint` passes.
- Verified on Alternative-Dark, Dark-pink, Flat.

Co-authored-by: Bjørn A. Andersen <polybjorn@users.noreply.github.com>
This commit is contained in:
polybjorn
2026-04-30 06:14:02 +00:00
committed by GitHub
parent e416117591
commit 8b66f0f6cd
4 changed files with 16 additions and 0 deletions

View File

@@ -744,6 +744,10 @@ kbd {
text-align: center;
}
.nav_menu #nav_menu_toggle_aside {
position: static;
}
/*=== Feed articles */
.flux {
background: var(--background-color-dark);

View File

@@ -744,6 +744,10 @@ kbd {
text-align: center;
}
.nav_menu #nav_menu_toggle_aside {
position: static;
}
/*=== Feed articles */
.flux {
background: var(--background-color-dark);

View File

@@ -678,6 +678,10 @@ th {
padding: 5px 0;
}
.nav_menu #nav_menu_toggle_aside {
position: static;
}
.dropdown-menu .dropdown-header .icon {
filter: invert(0.6);
}

View File

@@ -678,6 +678,10 @@ th {
padding: 5px 0;
}
.nav_menu #nav_menu_toggle_aside {
position: static;
}
.dropdown-menu .dropdown-header .icon {
filter: invert(0.6);
}