Skip to content

[SR] Side-by-side: authorable body text color - #6656

Open
rgclayton wants to merge 2 commits into
site-redesign-foundationfrom
sr-sidebyside-body-color-update
Open

[SR] Side-by-side: authorable body text color#6656
rgclayton wants to merge 2 commits into
site-redesign-foundationfrom
sr-sidebyside-body-color-update

Conversation

@rgclayton

@rgclayton rgclayton commented Sep 4, 2026

Copy link
Copy Markdown
Contributor

Summary

Adds an authorable body text color control to the side-by-side (ace1209) block. By default, body copy inherits its color from the surrounding context; authors can opt into the subtle content token block-wide, and fine-tune per card using the per-card customization mechanism from #6628.

Changes

  • Default behavior unchanged in appearance, but simplified: body text ([class^='body-']) now defaults to color: inherit instead of being hardcoded to the subtle token only inside .card-stacked. Previously .card-overlay and .card-stacked handled this inconsistently.
  • New block-level variant body-color-subtle: applies the subtle content color token (--s2a-color-content-subtle) to body text on both cards.
  • New per-card overrides, body-subtle / body-solid: authored as first-card-body-subtle, second-card-body-solid, etc., using the generic first-card-<token>/second-card-<token> pass-through mechanism added in MWPW-205892: Side-by-side per-card theming & customization #6628. Lets an author set the block-wide default and then dial an individual card back the other way.

Authoring examples

Authored block name First card Second card
Side by Side solid (default, inherit) solid (default)
Side by Side (body-color-subtle) subtle subtle
Side by Side (first-card-body-subtle) subtle solid (default)
Side by Side (body-color-subtle, first-card-body-solid) solid (overridden) subtle

Coordination with #6628

This update adds on to what @zagi25 worked on in #6628. All of those features/updates should work as expected.

Testing

  • All 12 existing side-by-side unit tests pass.
  • Stylelint clean (no new issues introduced; 3 pre-existing baseline warnings unrelated to this change remain).
  • Manually verified all authoring combinations above in a local disposable branch merging this work with MWPW-205892: Side-by-side per-card theming & customization #6628.

🤖 Generated with Claude Code

@aem-code-sync

aem-code-sync Bot commented Sep 4, 2026

Copy link
Copy Markdown
Contributor

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch.
In case there are problems, just click the checkbox below to rerun the respective action.

  • Re-sync branch
Commits

@rgclayton rgclayton changed the title Side-by-side: authorable body text color (subtle/solid), aligned with #6628 per-card customization [SR] Side-by-side: authorable body text color Sep 4, 2026
@NadiiaSokolova NadiiaSokolova self-assigned this Sep 7, 2026
@zagi25
zagi25 requested a review from a team September 7, 2026 08:17

@zagi25 zagi25 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Thank you!

Comment on lines +70 to +76
&.body-color-subtle {
.card {
.foreground [class^='body-'] {
color: var(--s2a-color-content-subtle);
}
}
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Super nit: I guess we don't need to nest here

Suggested change
&.body-color-subtle {
.card {
.foreground [class^='body-'] {
color: var(--s2a-color-content-subtle);
}
}
}
&.body-color-subtle .card .foreground [class^='body-'] {
color: var(--s2a-color-content-subtle);
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants