🍕 Sync 2026-09-14 23:30:37

luci-theme-footstrap/Makefile

@@ -17,7 +17,7 @@ LUCI_NAME:=luci-theme-footstrap
 FOOTSTRAP_VERSION?=
 ifneq ($(FOOTSTRAP_VERSION),)
 PKG_VERSION:=$(FOOTSTRAP_VERSION)
-PKG_RELEASE:=72
+PKG_RELEASE:=73
 endif
 
 LUCI_TITLE:=Footstrap Theme

luci-theme-footstrap/htdocs/luci-static/resources/fs-router.js

@@ -646,11 +646,10 @@ function seed() {
 	/* the served page's entry needs an id too, or the first Back TO it has nothing to look up */
 	adoptEntry();
 
-	/* Page-scoped CSS keys off `#view[data-page]` and `.fs-content[data-page]`, not `body`
-	 * (commitStage) — but the server stamps only `body`, so a document that never took a client
-	 * navigation would otherwise have neither. Copied, not recomputed: the server's value is
-	 * already the resolved dispatch path (header.ut, `ctx.path`), and re-deriving it here from the
-	 * tree could disagree with what the served markup actually carries. */
+	/* Page-scoped CSS keys off `#view[data-page]` and `.fs-content[data-page]` (commitStage). The
+	 * server stamps `body` and `.fs-content` (header.ut); `#view` is luci-base's markup, so it gets
+	 * the same value here. Copied from `body`, not recomputed: the served value is the resolved
+	 * dispatch path, and a re-derivation could disagree with it. */
 	const curPage = document.body ? (document.body.getAttribute('data-page') || '') : '';
 	const contentHost = document.querySelector('.fs-content');
 	if (contentHost) contentHost.setAttribute('data-page', curPage);

luci-theme-footstrap/styles/theme/60-inputs.css

@@ -796,8 +796,17 @@
 	 * attribute selector counts as a class, so `input[type="submit"]` at (0,1,1) beats a bare
 	 * `.hidden` at (0,1,0) and a stray "Save" button floats above the page title (issue #12).
 	 * Doubling the class states the invariant once at (0,2,0) instead of chasing elements. An
-	 * `!important` would do it too, and would invert the layer order for every future override. */
-	.hidden.hidden { display: none; }
+	 * `!important` would do it too, and would invert the layer order for every future override.
+	 * `fs-sheets.js` (rehostIntoThemeLayer) re-hosts a foreign app's own sheet into `@layer theme`,
+	 * where it now competes on specificity instead of losing to an unlayered rule by layer order
+	 * alone: measured on owrt2512 with luci-app-splify2 26.9, `<aside class="hidden lg:flex …">`
+	 * (Rail.tsx) stayed `display: none` at 1440/1920px because `.hidden.hidden` at (0,3,0) — see
+	 * below — outranked `.lg\:flex` at (0,1,0). `:not([class*=":"])` excludes any class list that
+	 * carries a Tailwind/UnoCSS responsive variant (the colon in `lg:flex`, `md:block`, `sm:inline`)
+	 * from the invariant above; LuCI itself never emits a class containing `:`, so nothing stock
+	 * is affected. Specificity moves to (0,3,0) — `:not()` counts its argument's attribute
+	 * selector, (0,1,0) — still clear of `input[type="submit"]` at (0,1,1) (issue #12, unchanged). */
+	.hidden.hidden:not([class*=":"]) { display: none; }
 	/* RangeSlider (UIRangeSlider) — the one LuCI widget base leaves to native browser rendering.
 	 * Token-driven track/thumb.
 	 * The INPUT box is the WCAG 2.2 SC 2.5.8 target (24px min): it used to be the 6px track

luci-theme-footstrap/ucode/template/themes/footstrap/header.ut

@@ -88,11 +88,15 @@
 
 	{#
 		data-page carries the DISPATCH path (ctx.path), not request_path: on a firstchild route
-		/admin/status renders the overview while request_path is only ['admin','status'], so every
-		`body[data-page='admin-status-overview']` rule would silently not apply. The SPA router
-		stamps the resolved leaf path, so both ways of arriving agree.
+		/admin/status renders the overview while request_path is only ['admin','status'], so a
+		`[data-page='admin-status-overview']` rule would silently not apply. The SPA router stamps the
+		resolved leaf path, so both ways of arriving agree. Stamped on <body> for the JS modules that
+		read the route there, and again on .fs-content below for the page-scoped CSS that keys off it
+		(styles/pages/): fs-router's seed() copies it there too, but only once the modules have loaded,
+		and the Overview's stray <h2 name="content"> was painted for 65-138 ms before that.
 	#}
-	<body class="lang_{{ dispatcher.lang }}" data-page="{{ entityencode(join('-', length(ctx.path) ? ctx.path : ctx.request_path), true) }}">
+	{% const fs_page = entityencode(join('-', length(ctx.path) ? ctx.path : ctx.request_path), true) %}
+	<body class="lang_{{ dispatcher.lang }}" data-page="{{ fs_page }}">
 		{#
 			The wallpaper pattern's paint surface: 15-wallpaper.css masks this element so an
 			uploaded SVG takes the theme's ink. A mask applies to an element's whole rendering,
@@ -175,6 +179,6 @@
 				   full load, which announces itself. #}
 				<div id="fs-nav-status" class="fs-sr" data-fs-chrome role="status" aria-live="polite"></div>
 
-				<div class="fs-content">
+				<div class="fs-content" data-page="{{ fs_page }}">
 					{% include('themes/footstrap/partials/notices', { boardinfo, empty_password }) %}
 		{% endif %}