Sessions 3-4 deliverables. Establishes the Asterion content pipeline :
EN pages generated programmatically from content-source/*-data.php, FR
translations rebuilt natively by Bricks's WPML integration from EN structure
+ WPML strings (no direct FR _bricks_page_content_2 writes).
## tools/_av-bricks-shared.php (the library)
Shared helpers + element atoms (eyebrow/heading/text/button/text-link) +
section builders (hero/prose/list/cards/cta/upsell/closer) + page write
pipeline that handles : write EN content via $wpdb (bypass Bricks's filter),
force Bricks::Elements::load_elements() so controls are populated, fire
wpml_page_builder_register_strings, push dict FR into icl_string_translations
(skip user CTE edits, auto-prefix /fr on internal URLs), trigger Bricks
native FR rebuild via wpml_page_builder_string_translated, and ensure a CTE
job exists (icl_translate_job.editor='wpml' + revision=NULL + populate
icl_translate rows with base64+gzip-encoded EN/FR strings).
## tools/av-generate-{industries,solutions}.php
Thin wrappers : URL trigger (template_redirect, not init — Bricks elements
load on 'wp' hook), add_filter('av_fr_translation_dict', ...) to register
FR strings, content-type-specific hub builder. ~150 FR strings per type.
## tools/av-translate-{industries,solutions}-fr.php
One-shot seeds for the initial FR linked posts via WPML trid mapping.
## tools/av-wpml-* operational mu-plugins
- set-cte : switch doc_translation_method to ICL_TM_TMETHOD_EDITOR (=1)
- create-jobs : reset CTE jobs (status=10 + needs_update=1 + editor=wpml +
revision=NULL). Integrated into pipeline via av_ensure_wpml_cte_job().
- fix-status / repair : align FR posts to correct trid + cleanup orphans.
- push-translations : push dict into icl_string_translations.
- plugins-check / debug / dump-strings / icl-dump / rescan : diagnostics.
## tools/av-fix-link-types.php
One-shot DB migration : convert legacy link.type='internal'+url to 'external'
across all _bricks_page_*_2 meta values (JSON and PHP-serialized). Bricks's
set_link_attributes() only renders href= for type='external' — older session-3
templates lost their href silently.
## Other tools/ mu-plugins
- av-bricks-rest-bridge : pivot — exposes Bricks CPTs over REST, dual-format
read filter (JSON for MCP / array for renderer), auto-mirror content→header/
footer for templates.
- av-apply-bricks-styles, av-cleanup-orphans, av-create-wp-menu, av-debug-meta,
av-dump-bricks, av-fix-template-meta : misc operational scripts.
## Bricks Config/
JSON snapshots of bricks_theme_styles, bricks_color_palette,
bricks_global_settings for diffable inspection.
## .gitignore
Add .mcp.json — holds per-developer WP App Password for the Bricks MCP server.
## wp-content/themes/asterion-bricks/assets/css/utilities.css
Note that all responsive overrides are now emitted natively by the page
generator via Bricks per-breakpoint settings, no custom CSS needed.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
71 lines
2.1 KiB
CSS
71 lines
2.1 KiB
CSS
/**
|
|
* Asterion Bricks — Utilities (minimalist)
|
|
*
|
|
* Loaded after tokens.css. Holds the small set of helper classes Bricks
|
|
* Builder cannot easily provide on its own (skip link, screen-reader-only
|
|
* text, focus ring). Everything else — section padding, container widths,
|
|
* button design, card styles — is set inside Bricks via tokens.
|
|
*/
|
|
|
|
/* === A11y skip link — first focusable element on every page === */
|
|
.av-skip-link {
|
|
position: absolute;
|
|
top: -40px;
|
|
left: 0;
|
|
padding: var(--space-3) var(--space-4);
|
|
background: var(--color-brand-navy);
|
|
color: var(--color-text-on-dark);
|
|
font-size: var(--text-body-sm);
|
|
font-weight: var(--font-weight-semibold);
|
|
text-decoration: none;
|
|
z-index: var(--z-toast);
|
|
border-bottom-right-radius: var(--radius-md);
|
|
}
|
|
.av-skip-link:focus,
|
|
.av-skip-link:focus-visible {
|
|
top: 0;
|
|
}
|
|
|
|
/* === Visually hidden — readable by screen readers, hidden visually === */
|
|
.av-sr-only {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
padding: 0;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
clip: rect(0 0 0 0);
|
|
white-space: nowrap;
|
|
border: 0;
|
|
}
|
|
|
|
/* === Focus visible — keyboard accessibility on every focusable element === */
|
|
:focus { outline: none; }
|
|
:focus-visible {
|
|
outline: var(--focus-ring-width, 2px) solid var(--focus-ring-color, var(--color-info));
|
|
outline-offset: var(--focus-ring-offset, 2px);
|
|
}
|
|
|
|
/* === Touch target minimum (WCAG AA / Apple HIG) === */
|
|
.av-tap-target {
|
|
min-width: var(--tap-target-min, 44px);
|
|
min-height: var(--tap-target-min, 44px);
|
|
}
|
|
|
|
/* === Reduced motion — respect user preference === */
|
|
@media (prefers-reduced-motion: reduce) {
|
|
*, *::before, *::after {
|
|
animation-duration: 0.01ms !important;
|
|
animation-iteration-count: 1 !important;
|
|
transition-duration: 0.01ms !important;
|
|
scroll-behavior: auto !important;
|
|
}
|
|
}
|
|
|
|
/*
|
|
* Section padding & flex-basis responsive overrides are now handled natively
|
|
* by Bricks via per-breakpoint settings on each element (suffix `:tablet_portrait`,
|
|
* `:mobile_landscape`, `:mobile_portrait` on the setting key). The page generator
|
|
* emits those automatically — no custom CSS needed here.
|
|
*/
|