peter/siftlode
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore(glass): scrub dev-process/hostname refs from tracked comments

Browse source 
Code review (public-repo rule): the GlassTuner + index.css/App.tsx comments named
the prod hostname and dev-process jargon (UAT/HMR/dev ports/epic), which ship in
the public bundle. Genericised the comments — no behaviour change.
This commit is contained in:
npeter83 2026-07-12 23:30:50 +02:00
parent f0330fa57f
commit 9f664a7ca6
3 changed files with 9 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

3
frontend/src/App.tsx
View file

@ -912,8 +912,7 @@ export default function App() {
<ErrorDialog /> <ErrorDialog />
{/* Re-binds to the active page's scroll container on navigation (page or channel change). */} {/* Re-binds to the active page's scroll container on navigation (page or channel change). */}
<BackToTop dep={channelView ? `chan:${channelView.id}` : page} /> <BackToTop dep={channelView ? `chan:${channelView.id}` : page} />
{/* DEV-ONLY live appearance tuner (localhost-gated; self-returns null on prod). Delete when {/* Local-only live appearance tuner (renders only on localhost; null everywhere else). */}
the glass-consistency epic bakes the final values into index.css. */}
<GlassTuner /> <GlassTuner />
</div> </div>
); );

11
frontend/src/components/GlassTuner.tsx
View file

@ -1,13 +1,12 @@
import { useEffect, useMemo, useState } from "react"; import { useEffect, useMemo, useState } from "react";
/** /**
* DEV-ONLY live appearance tuner. Mounted at the App root so it stays reachable on every page. * Local-only live appearance tuner. Mounted at the app root so it's reachable on every page; it
* It writes the glass CSS custom properties (index.css `:root`) inline on <html> for instant, * writes the glass CSS custom properties (index.css `:root`) inline on the document element for
* build-free feedback, and persists to localStorage so tweaks survive an F5 during UAT. * instant, build-free feedback, and persists to localStorage.
* *
* Gated to localhost/127.0.0.1 so it renders on the :8080 UAT build and :5173 HMR but NEVER on * Only active on localhost, so it never appears in a hosted build. A scratch tool for dialling in
* prod (siftlode.b1fr0st.eu). It is a scaffold for the glass-consistency epic: dial in values * the surface values — "Copy CSS" exports them to paste into index.css.
* here, hit "Copy CSS", hand them over to bake into index.css — then this component is deleted.
*/ */
const DEV_TUNER = const DEV_TUNER =
typeof window !== "undefined" && /^(localhost|127\.0\.0\.1)$/.test(window.location.hostname); typeof window !== "undefined" && /^(localhost|127\.0\.0\.1)$/.test(window.location.hostname);

6
frontend/src/index.css
View file

@ -6,10 +6,10 @@
--font-scale: 1.06; --font-scale: 1.06;
/* ===== Glass tunables — every value that materially drives the look lives here so it can be /* ===== Glass tunables — every value that materially drives the look lives here so it can be
tuned in ONE place (and live-driven by the dev GlassTuner during UAT). ===== */ tuned in ONE place. ===== */
/* GLOBAL baseline = "Adaptive": solid-enough dark glass that reads well on content-less chrome /* GLOBAL baseline = "Adaptive": solid-enough dark glass that reads well on content-less chrome
(nav/header/dialogs/filters/settings — where there's nothing behind the glass to refract). (nav/header/dialogs/filters/settings — where there's nothing behind the glass to refract).
Baked from UAT 2026-07-12. Rich-backdrop surfaces override these via `.glass-media` below. */ Rich-backdrop surfaces override these via `.glass-media` below. */
--glass-blur: 20px; /* backdrop blur radius */ --glass-blur: 20px; /* backdrop blur radius */
--glass-saturate: 1.8; /* backdrop saturation */ --glass-saturate: 1.8; /* backdrop saturation */
--glass-dark-bright: 1.25; /* extra brightness lift applied to .glass/.glass-menu in dark mode only */ --glass-dark-bright: 1.25; /* extra brightness lift applied to .glass/.glass-menu in dark mode only */
@ -27,7 +27,7 @@
--bg-fade: 60%; --bg-fade: 60%;
} }
/* ===== "Glass over image" — the translucent tier (UAT-tuned 2026-07-12). Applies whenever a /* ===== "Glass over image" — the translucent tier. Applies whenever a
real image sits behind the surfaces: app-wide when the per-scheme background image is on real image sits behind the surfaces: app-wide when the per-scheme background image is on
(`html[data-backdrop="on"]`), and on the Plex art-backed detail views (`.glass-media`, which (`html[data-backdrop="on"]`), and on the Plex art-backed detail views (`.glass-media`, which
have their own art backdrop even when the global image is off). When there's nothing behind the have their own art backdrop even when the global image is off). When there's nothing behind the