style(lists): replace '— ' dash prefix with vertical gold bar accent
The em-dash prefix on list items felt typographic but unbranded. Now each
list item gets a 3px-wide gold vertical bar on the left, evoking a tactical
breadcrumb. Implementation :
- Builders (av_build_list_section in _av-bricks-shared.php +
av_build_form_two_col promise list in av-generate-forms.php) emit clean
text without the '— ' prefix, and set _cssClasses = 'av-list-item'
- New mu-plugin av-list-bullet-style.php injects CSS via wp_head() :
.av-list-item { position: relative; padding-left: 0.9rem; }
.av-list-item::before { gold bar, 3px × 1.1em, aligned to first line }
Regen all sections (industries, solutions, technology, editorial, forms,
home) to switch existing pages to the new style.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -418,7 +418,8 @@ function av_build_list_section($slug, $i, $section, $bg = 'var(--color-bg-defaul
|
||||
$els[] = [
|
||||
'id' => "i{$slug}l{$i}x{$j}", 'name' => 'text-basic', 'parent' => $list, 'children' => [],
|
||||
'settings' => [
|
||||
'text' => '— ' . $item,
|
||||
'text' => $item, // no "— " prefix anymore
|
||||
'_cssClasses' => 'av-list-item', // gold-bar accent via wp_head CSS
|
||||
'_typography' => [
|
||||
'color' => av_color('var(--color-text-secondary)'),
|
||||
'font-size' => '1rem',
|
||||
|
||||
@@ -362,7 +362,8 @@ function av_build_form_two_col($slug, $d) {
|
||||
$els[] = [
|
||||
'id' => "fp{$slug}i{$j}", 'name' => 'text-basic', 'parent' => $plst, 'children' => [],
|
||||
'settings' => [
|
||||
'text' => "\u{2014} " . $item,
|
||||
'text' => $item,
|
||||
'_cssClasses' => 'av-list-item',
|
||||
'_typography' => [
|
||||
'color' => av_color('var(--color-text-secondary)'),
|
||||
'font-size' => '0.9375rem',
|
||||
|
||||
34
tools/av-list-bullet-style.php
Normal file
34
tools/av-list-bullet-style.php
Normal file
@@ -0,0 +1,34 @@
|
||||
<?php
|
||||
/**
|
||||
* Plugin Name: Asterion — Vertical gold bullet for list items
|
||||
* Description: Replaces the "— " dash prefix with a strong vertical gold bar
|
||||
* accent (3px wide) on the left of each item. Pure CSS via wp_head().
|
||||
* Items must have the class `av-list-item` (set by av_build_list_section
|
||||
* in _av-bricks-shared.php).
|
||||
*/
|
||||
defined('ABSPATH') || exit;
|
||||
|
||||
add_action('wp_head', function () {
|
||||
?>
|
||||
<style id="av-list-bullet">
|
||||
/* Each list item gets a vertical gold bar on the left, like a tactical
|
||||
breadcrumb on a UI. Pure CSS, no extra DOM. */
|
||||
/* class order in rendered HTML is "brxe-text-basic av-list-item" — selector
|
||||
works either way (CSS class ordering doesn't matter), kept simple. */
|
||||
.av-list-item {
|
||||
position: relative;
|
||||
padding-left: 0.9rem;
|
||||
}
|
||||
.av-list-item::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0.35em; /* aligns with first line baseline */
|
||||
width: 3px;
|
||||
height: 1.1em;
|
||||
background: var(--color-brand-gold, #C9A45A);
|
||||
border-radius: 1.5px;
|
||||
}
|
||||
</style>
|
||||
<?php
|
||||
}, 999);
|
||||
Reference in New Issue
Block a user