admin/felhom.eu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

website: the comparison column and the hero caption meet WCAG AA
gates / gates (push) Failing after 11m58s
Details

Browse Source 
Measured on the live preview, not assumed. --text-3 gave 3.14:1 (comparison
header), 3.57:1 (comparison rows) and 3.88:1 (hero caption) against their own
backgrounds, all under the 4.5:1 floor for body text. The audit's own rule was
that the existing 7.56:1 body contrast is an accessibility win to protect, so
dimming a column below AA to make it read as 'the quieter half' is a regression,
not a style. All three move to --text-2; the two halves of the comparison are
still told apart by the accent colour and the bold lead on the right.
This commit is contained in:
authentik Default Admin
2026-10-10 22:08:47 +02:00
parent a818b9c576
commit 6f58c00fe7
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/assets/site.css
+9 -3
View File
@@ -2239,7 +2239,9 @@ footer a:hover, footer a:focus-visible { text-decoration: underline; }
width: 100%; height: auto; display: block;
border: 1px solid var(--line); border-radius: var(--radius);
}
.page-index .lede-shot figcaption { margin-top: 10px; font-size: 0.85rem; color: var(--text-3); }
/* --text-3 measured 3.88:1 here, under WCAG AA. Captions carry real information,
so they take --text-2. */
.page-index .lede-shot figcaption { margin-top: 10px; font-size: 0.85rem; color: var(--text-2); }
/* --- capabilities, grouped into three clusters instead of ten equal cards --- */
.page-index .caps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 36px; }
@@ -2282,11 +2284,15 @@ footer a:hover, footer a:focus-visible { text-decoration: underline; }
.page-index .vs-head > div {
padding: 16px 24px; font-size: 0.92rem; font-weight: 700; background: var(--bg-2);
}
.page-index .vs-head > div:first-child { color: var(--text-3); }
/* The cloud column is the quieter half, but --text-3 measured 3.14:1 (head) and
3.57:1 (rows) against these backgrounds - under WCAG AA. The two sides are told
apart by the accent and the bold lead on the right, not by dimming one side
below the readability floor. */
.page-index .vs-head > div:first-child { color: var(--text-2); }
.page-index .vs-head > div:last-child { color: var(--blue-bright); }
.page-index .vs-row { border-top: 1px solid var(--line-soft); }
.page-index .vs-row > div { padding: 20px 24px; font-size: 0.97rem; line-height: 1.6; }
.page-index .vs-row > div:first-child { color: var(--text-3); }
.page-index .vs-row > div:first-child { color: var(--text-2); }
.page-index .vs-row > div:last-child { color: var(--text-2); border-left: 1px solid var(--line-soft); }
.page-index .vs-row strong { color: var(--text-1); font-weight: 600; }