j.foucher/AsterionWP2026

Files

j.foucher 6f62082dc4 feat(child-theme): scaffold asterion-bricks v0.1.0

Initial child theme structure inheriting from Bricks parent. Token-driven,
RGPD-native, mobile-first foundation ready for component and template work.

What's in this commit
- style.css: WP theme metadata (Template: bricks, v0.1.0)
- functions.php: enqueue cascade tokens -> utilities -> components,
  defer-loaded main.js, font preload, theme support, image sizes
  (av-hero 2400x1350, av-card 800x600, av-thumb 400x300), Gutenberg
  default styles dequeued
- theme.json: Gutenberg color/typo palette mirroring tokens
- assets/css/tokens.css: full design system per Design Handoff section 2
  (brand colors, neutrals, semantics, type scale + line-heights, 8pt
  spacing, radii, shadows, z-index, motion, prefers-reduced-motion)
- assets/css/utilities.css: modern reset + .av-container, .av-skip-link,
  .av-sr-only, .av-stack, .av-section helpers, opinionated heading scale
- assets/css/components.css: index of planned components + buttons
  (5 variants x 4 sizes per Design Handoff section 3.1) and links
- assets/js/main.js: vanilla skeleton with header scroll, IntersectionObserver
  reveal, count-up, mobile drawer; respects prefers-reduced-motion
- inc/cpt.php: register_post_type case_study (slug /customers/) + scenario
  (slug /scenarios/) + shared 'industry' taxonomy
- inc/seo.php: Organization JSON-LD on home; placeholders for Product,
  Article, FAQPage, BreadcrumbList
- assets/fonts/: Inter Variable + Italic WOFF2 self-hosted (RGPD; no
  Google Fonts CDN). Inter Display @font-face commented — Inter 4+ uses
  opsz axis from the same file.

Out of scope (intentionally deferred)
- Component fills: cards, forms, navigation, alerts, modals, tabs (placeholders)
- Page templates: home and beyond
- Bricks JSON template exports
- Schema.org Product / Article / FAQPage / BreadcrumbList implementations

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

2026-05-09 11:49:10 +02:00

2.4 KiB

Raw Blame History

Asterion Bricks — Child theme

Custom WordPress child theme for asterionvr.com, built on top of Bricks Builder. Tactical-cinematic design system for the PROSERVE XR training platform.

Structure

asterion-bricks/
├── style.css            # WP theme metadata only (CSS lives in assets/css/)
├── functions.php        # enqueues, theme support, includes
├── theme.json           # Gutenberg color/typo palette
├── assets/
│   ├── css/
│   │   ├── tokens.css       # design tokens — source of truth
│   │   ├── utilities.css    # CSS reset + utility classes (.av-container, etc.)
│   │   └── components.css   # component styles (buttons, cards, header, footer…)
│   ├── js/
│   │   └── main.js          # vanilla JS, defer-loaded
│   ├── fonts/               # self-hosted Inter (RGPD)
│   └── img/                 # static visuals
├── templates/               # Bricks template JSON exports (versioned)
└── inc/
    ├── cpt.php              # custom post types: case_study, scenario
    └── seo.php              # Schema.org JSON-LD overrides

Conventions

CSS prefix : av- (asterion-vr) on every custom selector to avoid collision with Bricks classes.
BEM-light naming : .av-card, .av-card--feature, .av-card__icon, .av-card.is-loading.
Zero hardcoded values — every color, spacing, radius and duration goes through tokens.css.
JS : vanilla, defer-loaded, prefer IntersectionObserver over scroll listeners.
A11y : keyboard reachable, :focus-visible outline, ARIA where needed, contrast ≥ 4.5:1, prefers-reduced-motion respected.

Activation

Ensure Bricks parent is installed at wp-content/themes/bricks/.
WP Admin → Appearance → Themes → activate Asterion Bricks.

Performance budget (per BRIEF section 9)

Asset	Budget
HTML initial	< 100 KB gzipped
CSS total	< 50 KB gzipped
JS initial	< 200 KB gzipped
Hero video	< 2 MB
Hero poster	< 150 KB
LCP / CLS / TBT	< 2.5s / < 0.1 / < 200ms

License

GPL v2 or later. Same as WordPress core.

2.4 KiB Raw Blame History