ui: keep the board visible in light mode + bust diagram cache
build-and-deploy / build (push) Failing after 14m43s
build-and-deploy / build (push) Failing after 14m43s
Light mode: revert the heavy white-out scrim back to a moderate wash so the board stays visible, and earn legibility with a soft light text-halo behind running text instead (invisible on the solid cards, only works over the image). Pairs with the darker light-mode text tokens. Also append ?v=2 to every /diagrams/*.svg reference so the recoloured diagrams bypass Cloudflare's 4h edge cache and show immediately (the SVG URLs aren't content-hashed like the CSS bundle).
This commit is contained in:
@@ -22,7 +22,7 @@ const cap = caption ?? captions[name];
|
||||
<figure class="diagram" data-reveal>
|
||||
<img
|
||||
class="diagram__svg"
|
||||
src={`/diagrams/${name}.svg`}
|
||||
src={`/diagrams/${name}.svg?v=2`}
|
||||
alt={cap ?? `${name} architecture diagram`}
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
|
||||
@@ -13,7 +13,7 @@ and you've hardened the whole estate at once. Get it wrong and you've built a si
|
||||
|
||||
Here's how I think about it after wiring an OIDC provider in front of a self-hosted fleet.
|
||||
|
||||

|
||||

|
||||
|
||||
## Enforce the second factor at the flow, not per app
|
||||
|
||||
|
||||
@@ -12,7 +12,7 @@ that's online whether or not anyone's knocking.
|
||||
|
||||
There's a better shape: don't open anything. Let the origin dial *out*.
|
||||
|
||||

|
||||

|
||||
|
||||
## The tunnel dials out
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@ a DNS sinkhole, a search proxy — the answer is no. Never. Not once.
|
||||
So every one of those pods is holding a key to a door it never opens. That's not least privilege. That's a
|
||||
standing credential waiting to be stolen.
|
||||
|
||||

|
||||

|
||||
|
||||
## Identity first, RBAC second
|
||||
|
||||
|
||||
+19
-9
@@ -409,23 +409,33 @@ svg {
|
||||
);
|
||||
}
|
||||
[data-theme="light"] .site-bg__scrim {
|
||||
/* Light mode needs a much heavier wash than dark — the sandstone board has
|
||||
bright AND mid-tone areas that wreck text contrast. Keep it a faint ghost
|
||||
behind content (dark mode stays the showcase). */
|
||||
/* Moderate wash — the board stays clearly visible; text legibility comes from
|
||||
a light halo behind the type (see below), not from hiding the backdrop. */
|
||||
background:
|
||||
linear-gradient(
|
||||
90deg,
|
||||
rgba(246, 248, 251, 0.96) 0%,
|
||||
rgba(246, 248, 251, 0.9) 50%,
|
||||
rgba(246, 248, 251, 0.86) 100%
|
||||
rgba(246, 248, 251, 0.8) 0%,
|
||||
rgba(246, 248, 251, 0.54) 48%,
|
||||
rgba(246, 248, 251, 0.44) 100%
|
||||
),
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(246, 248, 251, 0.5) 0%,
|
||||
rgba(246, 248, 251, 0.66) 55%,
|
||||
rgba(246, 248, 251, 0.9) 100%
|
||||
rgba(246, 248, 251, 0.28) 0%,
|
||||
rgba(246, 248, 251, 0.48) 55%,
|
||||
rgba(246, 248, 251, 0.78) 100%
|
||||
);
|
||||
}
|
||||
/* Light-mode legibility: a soft light halo behind running text lifts it off the
|
||||
busy board WITHOUT washing the board out. Subtle enough to be invisible on the
|
||||
solid card surfaces; only earns its keep over the image. Dark mode needs none
|
||||
(light text on a dark board already has the contrast). */
|
||||
[data-theme="light"]
|
||||
main
|
||||
:where(h1, h2, h3, h4, p, li, dt, dd, figcaption, .eyebrow) {
|
||||
text-shadow:
|
||||
0 0 4px rgba(246, 248, 251, 0.92),
|
||||
0 1px 2px rgba(246, 248, 251, 0.75);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.scroll-progress {
|
||||
|
||||
Reference in New Issue
Block a user