mirror of
https://github.com/mattermost/mattermost.git
synced 2026-09-19 10:12:47 +08:00
* Fix readability & accessibility issues from Docs Revamp feedback Addresses the readability/accessibility batch collected 2026-07-22/23 in the "Docs Revamp - Feedback" channel and Eric Sethna's first-pass review doc: - Dark-mode "note" callout text vs. background contrast (Michael Roberson; Eric Sethna's doc item 8) — pin explicit brand colors for dark-mode admonitions instead of Infima's generic secondary-alert pairing. - Link color/body-text visual distinction, both themes (Vishal Choudhary, Marco Kundt; Eric Sethna's doc item 5) — new link colors that stay far apart in luminance from surrounding body text (not just from the page background), plus default (not hover-only) underlines. - Body text should read darker, like the old docs site (Vishal Choudhary) — wire --ifm-font-color-base to --mm-text-primary instead of Infima's unbranded default. - Main content panel doesn't visually "pop" against the side nav/TOC (Vishal Choudhary) — tint the sidebar/TOC panels with --mm-bg-subtle and leave the reading column on the page background. - Dark-mode inline code contrast (Marco Kundt) — explicit text color via --mm-text-primary. - Bold/color combo hard to read (Ben Cooke) — subtle letter-spacing on bold runs in prose. - Heading/TOC category font not readable, vs. the readable "IME" example (Eric Sethna's doc item 1) — swap the 900-weight display face out of small multi-word TOC category labels for the base sans face at bold weight, matching the same fix already applied to navbar links. - Inline code spans taking up excess vertical space (Eric Sethna's doc item 9) — pin line-height on inline `code` so it stops inheriting the 1.65 paragraph line-height; multi-line fences are unaffected. - Prose max-width too wide on large screens (Rohith Chandran) — cap top-level article prose at ~760px via a `.markdown > `-scoped rule that leaves the OpenAPI 2-column layout (nested deeper) untouched. Full WCAG contrast math for every changed pair is in the PR description. Note: this touches docs/site/src/css/custom.css and tokens.css, which a parallel "remove yellow left border" workstream also touches (callout/ card border styles) — left border/accent-bar colors are deliberately untouched here to minimize overlap, but a merge conflict is still likely. Co-authored-by: Cursor <cursoragent@cursor.com> * Address review feedback on readability/a11y PR - Extend dark-mode admonition background fix from "note" to all five alert types (info/success/warning/danger) — the "hard on the eyes" complaint (item 13) wasn't note-specific. Also pin the alert heading label and icon color explicitly, since Infima's inheritance made the "NOTE"-style label the most visibly low-contrast part of the callout. - Drop the default underline on prose links; use medium weight (600) as the non-color WCAG 1.4.1 cue instead, keeping underline for hover/focus only. - Stop forcing code blocks to our --mm-denim-800 background in dark mode. Docusaurus's dark Prism theme (dracula) has its own background/token contrast pairing; overriding just the background broke that pairing. Letting the theme's own background show through (already applied to the block's container via --prism-background-color) fixes contrast. - Apply the same small/multi-word-heading fix already used for TOC category labels to table column headers, which have the identical problem (multi-word labels in the 900-weight display face). Left footer titles on the heading face since those are short single words, the case that face handles fine — documented why. Co-authored-by: Cursor <cursoragent@cursor.com> * Fix dark-mode contrast for code blocks, inline code, and note callouts Code block, callout, and inline-code backgrounds/borders all sat within ~1:1 contrast of the dark-mode page background (same navy hue family), so they had no visible edge or fill distinct from the page. The unscoped dark-mode `code` background rule also leaked into code blocks' own `<code>` element (beating Infima's `pre code: transparent` on specificity), masking most of the code block fill behind a near-black overlay regardless of the fill color chosen. Co-authored-by: Cursor <cursoragent@cursor.com> * Fix dark-mode contrast for blockquotes, inline code, and table stripes Same root cause as the earlier code-block/callout fixes: --mm-denim-800 and --mm-denim-700 sit within ~1:1 contrast of the dark-mode page background, so blockquotes, inline code chips, and even-row table striping all had no visible fill against the page. Switched them to --mm-bg-surface (+ denim-400 borders where a border exists) to match the surface treatment already used elsewhere. Co-authored-by: Cursor <cursoragent@cursor.com> * Tone down h1 title weight; revert prose max-width cap - h1 page titles were still on the 900-weight Archivo Black poster face after h2-h4 got moved to a normal-weight sans face for the same "too heavy/shouty" reason. Bring h1 in line with the rest so every page title uses one consistent weight. - Revert the 760px max-width cap on top-level markdown prose blocks (added for Rohith Chandran's wide-line-length feedback) — it also squeezed non-article layouts like the homepage's persona cards. Needs more thought before reapplying narrower/more targeted. Co-authored-by: Cursor <cursoragent@cursor.com> * Trim verbose CSS comments introduced in this branch Cut reviewer-name/item-number attributions and repeated exploratory narrative down to the "why" a future reader actually needs, and fixed a couple of comments left stale by later commits (e.g. h1 no longer using the Archivo Black display face). Also dropped a redundant background declaration in the dark-mode .callout override that just re-set the same value the base rule's --mm-bg-surface already resolves to per theme. Co-authored-by: Cursor <cursoragent@cursor.com> --------- Co-authored-by: Cursor <cursoragent@cursor.com>