fix: allow wide/full alignment inside content wrappers like .everlit-audio#2710
Conversation
|
🎉 This PR is included in version 2.21.2-hotfix-wide-width-everlit-wrapper.1 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
…audio The single-feature template gates the negative-margin escape for .alignwide and .alignfull behind a direct-child selector (`.entry-content > *`). When a plugin wraps the_content at render time (e.g. Everlit injects a `<span class="everlit-audio">` around the body for its text-to-speech controls), that wrapper interposes itself between .entry-content and the aligned block, the rule no longer matches, and wide-width images stay at column width on the front end – even though they render correctly in the editor, which doesn't run the filter. Allow one level of wrapping for the known .everlit-audio case, matching the existing pattern that already handles .newspack-content-gate__inline-gate and #pico. Reproduced locally on hotfix/wide-width-everlit-wrapper with a single-feature + featured-image-beside post: with the span wrapper, figure width 780px (= entry-content). With the patch, figure width 1090px and margin -155px on each side, no horizontal-scrollbar regression from PR #2667 (.site-content overflow:clip still applies). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
4340ee5 to
d8515e2
Compare
## [2.21.3-hotfix-wide-width-everlit-wrapper.1](v2.21.2...v2.21.3-hotfix-wide-width-everlit-wrapper.1) (2026-05-14) ### Bug Fixes * allow wide/full alignment inside content wrappers like .everlit-audio ([d8515e2](d8515e2)), closes [#2667](#2667)
|
🎉 This PR is included in version 2.21.3-hotfix-wide-width-everlit-wrapper.1 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
jason10lee
left a comment
There was a problem hiding this comment.
Approved! Tests as advertised, and new rules look appropriately scoped. No blockers from human or agentic review.
Only nit is that the branch looks like it's moved on a bit since this PR was opened. Conflict resolution will happen as a matter of course, so not a blocker.
## [2.22.3-hotfix-wide-width-everlit-wrapper.1](v2.22.2...v2.22.3-hotfix-wide-width-everlit-wrapper.1) (2026-06-10) ### Bug Fixes * allow wide/full alignment inside content wrappers like .everlit-audio ([d8515e2](d8515e2)), closes [#2667](#2667)
|
🎉 This PR is included in version 2.22.3-hotfix-wide-width-everlit-wrapper.1 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 2.22.3 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
All Submissions:
Changes proposed in this Pull Request:
Hotfix for an interaction between the
single-featuretemplate's wide/full-alignment rules and plugins that wrapthe_contentat render time (Everlit's text-to-speech being the case we hit in the wild on inewsource.org).The single-feature alignment rules in
sass/blocks/_blocks.scssgate the negative-margin "escape" for.alignwide/.alignfullbehind a direct-child selector:When Everlit is active, it injects a
<span class="everlit-audio">around the body of every post on the front end, so the alignwide<figure>is no longer a direct child of.entry-contentand the rule no longer matches. The result is that wide-width images stay clamped to the column width on the front end – even though they render correctly in the editor, which doesn't run the filter.This PR adds one selector to the existing allow-list:
.entry .entry-content > .everlit-audio > *. It permits one level of wrapping for the known case without broadening to a generic descendant selector (which would incorrectly escape from nested blocks like columns / groups).How to test the changes in this Pull Request:
the_contentin a<span class="everlit-audio">). Locally I simulated it by adding awp:htmlblock opening<span class="everlit-audio everlit-no-audio">at the top of a post and a closing</span>at the bottom.single-feature.phpandnewspack_featured_image_position=above,behind, orbeside(any single-featured-image position;besidematches the original report).Before: the figure width equals
.entry-contentwidth (~780px on a 1400px viewport, no negative-margin escape).After: the figure width is ~1090px with
margin: 0 -155px(escape via the existing alignwide rule). No horizontal scrollbar – theoverflow: clipfrom #2667 still applies.Tested locally with newspack-theme HEAD (v2.21.1 + this patch) using a
single-feature+featured-image-besidepost both with and without the span wrapper:.everlit-audio0 → 0 -155px32px -155px(unchanged)Other information:
Filed as a hotfix off
releasesince publishers on Atomic are already affected. Forward-port totrunkto follow once this lands.🤖 Generated with Claude Code