randogoth/sites
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: declare color-scheme, so navigation stops flashing white

Browse source 
The mark is fill="currentColor" inside an anchor, so an unstyled paint renders
it in the UA link blue. That is what the flash is: the document painted before
the stylesheet applies, not a theme switch.

Without a color-scheme declaration the browser treats the document as light, so
the canvas it paints between documents, and the scrollbar, are white. Gecko
paints a pending stylesheet's document far more readily than Blink does, which
is why it shows there and not in Chromium.

Dark on flux and bbs, which are dark only; all three branches on raayoni.

The other half of this is a Caddy change in bucur: every response currently
carries no Cache-Control, no ETag and no Last-Modified, so the stylesheet is
refetched on every navigation and the window keeps reopening.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
randogoth 2026-10-05 22:01:37 +03:00
parent 8505b7e9e0
commit c97fcb249b
3 changed files with 14 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

6
flux.vision/flux/static/css/style.css
View file

@ -29,7 +29,11 @@
*,*::before,*::after { box-sizing: border-box; } *,*::before,*::after { box-sizing: border-box; }
html { overflow-y: scroll; overflow-x: clip; } html { overflow-y: scroll; overflow-x: clip; }
:root { --panel-w: 148px; --panel-h: 196px; :root {
/* Dark-only site. Without this the browser canvas between documents, and
the scrollbar, are light, which shows as a white frame on navigation. */
color-scheme: dark;
--panel-w: 148px; --panel-h: 196px;
/* One gutter for everything. Never narrower than the floating panel's lane, /* One gutter for everything. Never narrower than the floating panel's lane,
so content can never slide under it; wider than that it tracks the so content can never slide under it; wider than that it tracks the
original's 960px centred column. */ original's 960px centred column. */

3
randogoth.com/bbs/static/bbs.css
View file

@ -17,6 +17,9 @@
/* the IBM EGA/VGA text palette, unaltered */ /* the IBM EGA/VGA text palette, unaltered */
:root { :root {
/* A board is black by definition; tell the browser so the canvas between
documents and the scrollbar match instead of flashing light. */
color-scheme: dark;
--black: #000000; --blue: #0000aa; --green: #00aa00; --cyan: #00aaaa; --black: #000000; --blue: #0000aa; --green: #00aa00; --cyan: #00aaaa;
--red: #aa0000; --magenta: #aa00aa; --brown: #aa5500; --grey: #aaaaaa; --red: #aa0000; --magenta: #aa00aa; --brown: #aa5500; --grey: #aaaaaa;
--dgrey: #555555; --lblue: #5555ff; --lgreen: #55ff55; --lcyan: #55ffff; --dgrey: #555555; --lblue: #5555ff; --lgreen: #55ff55; --lcyan: #55ffff;

6
tobias.raayoni-last.com/raayoni/static/css/style.css
View file

@ -59,6 +59,10 @@
} }
:root, [data-theme="dark"] { :root, [data-theme="dark"] {
/* Not decoration: without color-scheme the browser treats the document as
light, so the canvas it paints between documents, and the scrollbar, are
white. On Gecko that is the white frame you see on every navigation. */
color-scheme: dark;
--ground: #111; --ground: #111;
--ground-alt: #191919; --ground-alt: #191919;
--title: #aaa; --title: #aaa;
@ -72,6 +76,7 @@
} }
[data-theme="light"] { [data-theme="light"] {
color-scheme: light;
--ground: #f7f6f4; --ground: #f7f6f4;
--ground-alt: #efeeea; --ground-alt: #efeeea;
--title: #2b2b2b; --title: #2b2b2b;
@ -88,6 +93,7 @@
@media (prefers-color-scheme: light) { @media (prefers-color-scheme: light) {
:root:not([data-theme]) { :root:not([data-theme]) {
color-scheme: light;
--ground: #f7f6f4; --ground-alt: #efeeea; --title: #2b2b2b; --body: #343434; --ground: #f7f6f4; --ground-alt: #efeeea; --title: #2b2b2b; --body: #343434;
--sub: #6a6a6a; --meta: #5f5f5f; --rule: #dcdad4; --tile: #eceae5; --sub: #6a6a6a; --meta: #5f5f5f; --rule: #dcdad4; --tile: #eceae5;
--panel-lift: rgba(0,0,0,.22); --panel-lift: rgba(0,0,0,.22);