16989d834c
Lint / lint (push) Has been cancelled
Initial repository scaffold: - design.md (google-labs-code/design.md format) as canonical token + guidelines source - brand assets, foundations, tokens (W3C-style JSON) - 12 component primitives, each with labeled anatomy.svg and spec README - light / dark / high-contrast themes, web/mobile/email/print/presentation templates - docs (getting started, principles, a11y, voice & tone, contributing) - runnable web example, token build script stub, CI placeholder Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
26 lines
598 B
Markdown
26 lines
598 B
Markdown
# Modals
|
|
|
|
Specification for the **modals** primitive.
|
|
|
|
## Anatomy
|
|
TODO — drop `anatomy.svg` next to this file.
|
|
|
|
## Variants
|
|
- default
|
|
- (list per-component variants)
|
|
|
|
## States
|
|
default · hover · focus-visible · active/pressed · disabled · loading
|
|
|
|
## Tokens used
|
|
See `design.md` → `components.modals.*`.
|
|
|
|
## Accessibility
|
|
- All interactive instances are keyboard-reachable.
|
|
- Focus state has ≥ 3:1 contrast against its background.
|
|
- Pair color with an icon or text to convey meaning.
|
|
|
|
## Do / Don't
|
|
- ✅ Use the canonical token references.
|
|
- ❌ Don't hardcode colors, sizes, or radii.
|