Phone Trio

Block class name .phone-trio Edit in wp-admin

Example markup

<section class="phone-trio">
  <a class="phone-trio__phone phone-trio__phone--center" href="{phone2_href}">
    <div class="phone-trio__phone-frame phone-trio__phone-frame--link">
      <video class="phone-trio__phone-media" autoplay muted loop playsinline>
        <source src="{phone2_media_url}" type="video/mp4">
      </video>
    </div>
  </a>
  <div class="phone-trio__phone">
    <div class="phone-trio__phone-frame">
      <img class="phone-trio__phone-media" src="{phone1_media_url}" alt="{phone1_alt}">
    </div>
  </div>
  <div class="phone-trio__phone">
    <div class="phone-trio__phone-frame">
      <img class="phone-trio__phone-media" src="{phone3_media_url}" alt="{phone3_alt}">
    </div>
  </div>
</section>

Class-name normaliser

Plan #322 substrate. class_root + class_aliases feed the S2 audit CLI + S3 normaliser. Kind drives downstream branching.

Class root Kind Composition role

✓ Pick both kind + composition role to validate alignment.

BEM elements (canonical)

Operator-locked. S3 normaliser rewrites drift like __heading → __title.

BEM modifiers (canonical)

Operator-locked.

Class aliases (drift catcher) Edit in wp-admin

Past-drift class roots this entry absorbs. S2 audit populates automatically; use wp-admin to review provenance + tune manually. The wp-admin metabox exposes the full mockup relationship UI + date picker + occurrence count.

No aliases recorded yet.

Prompt

Operator-authored guidance for the camcom-design skill — when to use this block, composition rules, brand-variation notes. Saves on blur.

Legacy fields (tier, composition role, layout pattern, repeaters)

Pre-MC-plan-#64 schema. Data preserved here for reference. Collapsed into example markup + prompt opportunistically as we walk sections.

Composition role Layout pattern

Purpose Composes with

Elements observed

Modifiers observed

States

Non-canonical elements

Notes

Class-name normaliser

Prompt

AI-Assist