Skip to content

v0.5.95

Choose a tag to compare

@jaspertey jaspertey released this 30 Oct 05:02
9d7540a

Upgrading

  • Run kit:update plan|apply for core (re-pinned sha256:abe29379…903c → sha256:1cffa6e7…88fa) and notes (sha256:d373d438…f1b2 → sha256:1a0455e7…551b): css/kit.css adds the --success-text, --warning-text and --info-text tokens, Kit/Form/FormActions.vue shows "Saved" in text-success-text, Kit/Feedback/alertVariants.ts gives a pale Alert the theme's foreground for its text and a *-text token for its icon, and the Notes page's colours.ts gives a coloured note the theme's foreground. No kit stub colours text with a raw palette colour any more.
  • A host with its own theme (not importing kit.css) must define --success-text, --warning-text and --info-text for light and dark; the kit's AA values are a starting point: hsl(142 76% 26%), hsl(26 90% 33%) and hsl(201 90% 32%) light, hsl(142 69% 58%), hsl(43 96% 56%) and hsl(199 89% 64%) dark. Until it does, the kit's theme host step reads unmet. A host theme's value wins over the kit's, as for the other tokens.

Fixed

  • FormActions' "Saved" meets WCAG AA. It was text-green-600, about 3.3:1 on a white card (AA is 4.5:1), so axe's color-contrast failed on every FormCard just after a save. The new --success-text token, with --warning-text and --info-text beside it, is status text on a surface, as --destructive-text is: hsl(142 76% 26%) light (5.80:1 on background, card and popover, 5.32:1 on accent and muted) and hsl(142 69% 58%) dark (11.36:1, 8.68:1 on accent, 8.35:1 on muted); warning is 6.04:1 and 11.70:1, info 6.06:1 and 9.71:1, and at least 5.32:1 light and 7.13:1 dark on accent and muted. A pale Alert's icon takes these tokens (and --destructive-text for danger) instead of raw palette colours, and its text, like a coloured note's, takes the theme's foreground. tests/js/semantic-text.test.mjs computes the ratios from kit.css and refuses a raw palette text colour (text-green-600, dark:text-sky-300) in any kit resource, and the browser job's ?form-saved page runs axe's color-contrast over a saved FormCard and the pale Alerts, light and dark.

What's Changed

  • Semantic status text tokens: FormActions' Saved meets AA (0.5.x) by @jaspertey in #442

Full Changelog: v0.5.94...v0.5.95