brad/brand-guidelines
brad/brand-guidelines
1
0
Fork 2
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: add styles section for named visual patterns #13

Merged
brad merged 2 commits from feat/styles-section into main 2026-02-27 15:35:50 -08:00
Conversation 0 Commits 2 Files changed 10 +253 -17
brad commented 2026-02-27 15:32:04 -08:00
Owner
Copy link

Summary

  • Add new top-level styles: section for recurring CSS patterns beyond typography (dividers, cards, links, accent rules)
  • Each named style produces custom properties (--style-*), utility classes (.style-*), SCSS maps, docs table, and showcase specimens
  • color/text_color/background keys resolve brand color references; all other keys use snake_case → kebab-case CSS mapping
  • Improve showcase: swatch labels align in grid columns under palette PNGs, font subsection headings get accent-bar treatment

Files changed

File Change
schema/brand.schema.json Add styles property definition
scripts/brand/stage_json.py Resolve color references in styles
scripts/brand/stage_css.py Generate custom properties + utility classes
scripts/brand/stage_docs.py Generate styles table in BRAND.md
scripts/brand/exports/scss.py Generate SCSS maps
scripts/brand/exports/showcase.py Render style specimens + layout fixes
example.brand.yml Add commented-out styles example

Test plan

  • uv run scripts/build.py passes with and without styles: section
  • uv run scripts/validate.py passes
  • brand.json has resolved hex values in styles
  • brand.css has --style-* custom properties and .style-* utility classes
  • BRAND.md has Styles table
  • SCSS has $style-* maps
  • Showcase shows style specimens

🤖 Generated with Claude Code

## Summary - Add new top-level `styles:` section for recurring CSS patterns beyond typography (dividers, cards, links, accent rules) - Each named style produces custom properties (`--style-*`), utility classes (`.style-*`), SCSS maps, docs table, and showcase specimens - `color`/`text_color`/`background` keys resolve brand color references; all other keys use snake_case → kebab-case CSS mapping - Improve showcase: swatch labels align in grid columns under palette PNGs, font subsection headings get accent-bar treatment ## Files changed | File | Change | |------|--------| | `schema/brand.schema.json` | Add `styles` property definition | | `scripts/brand/stage_json.py` | Resolve color references in styles | | `scripts/brand/stage_css.py` | Generate custom properties + utility classes | | `scripts/brand/stage_docs.py` | Generate styles table in BRAND.md | | `scripts/brand/exports/scss.py` | Generate SCSS maps | | `scripts/brand/exports/showcase.py` | Render style specimens + layout fixes | | `example.brand.yml` | Add commented-out styles example | ## Test plan - [ ] `uv run scripts/build.py` passes with and without `styles:` section - [ ] `uv run scripts/validate.py` passes - [ ] brand.json has resolved hex values in styles - [ ] brand.css has `--style-*` custom properties and `.style-*` utility classes - [ ] BRAND.md has Styles table - [ ] SCSS has `$style-*` maps - [ ] Showcase shows style specimens 🤖 Generated with [Claude Code](https://claude.com/claude-code)
New top-level `styles:` section in brand.yml for recurring CSS patterns
beyond typography (dividers, cards, links, accent rules). Each named
style produces custom properties, utility classes, SCSS maps, docs
table, and showcase specimens.

Features:
- color/text_color/background keys resolve brand color references
- Arbitrary CSS properties via snake_case → kebab-case mapping
- Property mapping table (color→border-color, shadow→box-shadow, etc.)

Also improves showcase:
- Swatch labels align in grid columns under palette PNGs
- Font subsection headings get accent-bar treatment

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
chore: regenerate brand outputs from brand.yml
All checks were successful
Validate brand.yml / validate (pull_request) Successful in 29s
Details
42340a6aff 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
brad merged commit cb4556ce46 into main 2026-02-27 15:35:50 -08:00
brad deleted branch feat/styles-section 2026-02-27 15:35:51 -08:00
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
brad/brand-guidelines!13
No description provided.