فهرست منبع

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>
polybjorn 2 هفته پیش
والد
کامیت
8b66f0f6cd
4فایلهای تغییر یافته به همراه16 افزوده شده و 0 حذف شده
  1. 4 0
      p/themes/Alternative-Dark/adark.css
  2. 4 0
      p/themes/Alternative-Dark/adark.rtl.css
  3. 4 0
      p/themes/Flat/flat.css
  4. 4 0
      p/themes/Flat/flat.rtl.css

+ 4 - 0
p/themes/Alternative-Dark/adark.css

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

+ 4 - 0
p/themes/Alternative-Dark/adark.rtl.css

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

+ 4 - 0
p/themes/Flat/flat.css

@@ -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);
 }

+ 4 - 0
p/themes/Flat/flat.rtl.css

@@ -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);
 }