fix(ui): readable light mode over the board backdrop
build-and-deploy / build (push) Failing after 13m46s
build-and-deploy / build (push) Failing after 13m46s
Body text washed out in light mode — the secondary/tertiary text tokens were too light against the bright sandstone board image. Darken light --text-dim and --text-faint, and heavily strengthen the light-theme scrim so the board drops to a faint texture behind content. Dark mode unchanged.
This commit is contained in:
@@ -409,18 +409,21 @@ 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). */
|
||||
background:
|
||||
linear-gradient(
|
||||
90deg,
|
||||
rgba(246, 248, 251, 0.86) 0%,
|
||||
rgba(246, 248, 251, 0.56) 44%,
|
||||
rgba(246, 248, 251, 0.4) 100%
|
||||
rgba(246, 248, 251, 0.96) 0%,
|
||||
rgba(246, 248, 251, 0.9) 50%,
|
||||
rgba(246, 248, 251, 0.86) 100%
|
||||
),
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(246, 248, 251, 0.22) 0%,
|
||||
rgba(246, 248, 251, 0.54) 58%,
|
||||
rgba(246, 248, 251, 0.82) 100%
|
||||
rgba(246, 248, 251, 0.5) 0%,
|
||||
rgba(246, 248, 251, 0.66) 55%,
|
||||
rgba(246, 248, 251, 0.9) 100%
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -78,8 +78,10 @@
|
||||
--border-strong: rgba(2, 6, 23, 0.18);
|
||||
|
||||
--text: #0e1726;
|
||||
--text-dim: #475467;
|
||||
--text-faint: #6b7689;
|
||||
/* Darker secondary/tertiary text — the body sits over the (light) board image,
|
||||
so these need more contrast than on a flat page to stay readable. */
|
||||
--text-dim: #2c3a4d;
|
||||
--text-faint: #46546a;
|
||||
|
||||
/* Accent — same electric cyan→magenta as dark, dropped in value for contrast
|
||||
on the light sandstone board. */
|
||||
|
||||
Reference in New Issue
Block a user