fix: correct icon block, pullquote block styles, and post title width ahead of WP 7.0

[laurelfulford]

All Submissions:

• Have you followed the Newspack Contributing guideline?
• Does your code follow the WordPress' coding standards and VIP Go coding standards?
• Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

This PR fixes a couple display issues in WordPress 7.0:

• When floated left or right, the icon block can display too wide if it's set to a large size
• The pullquotes are too large in the editor
• It makes sure the post titles are the correct width in the editor

In fixing the pullquotes I also noticed a couple minor issues in Newspack Katharine and Nelson that are fixed in this PR - these happen in WP 6.9, too.

Closes NEWS-1690 and NEWS-1687

How to test the changes in this Pull Request:

1. On a test site running the latest WordPress 7.0 RC, add the following blocks to the editor:
   • Add two icon blocks and make them large (500px); align one of them left or right
   • Add three pullquote blocks; align one of them left and one of them right
2. Publish the post and compare; note that the pullquote font size is too big in editor, and the floated icon block is wider than its 'container':

3. Apply this PR and run npm run build; confirm the above issues are fixed (that icons don't exceed their containers, and that the pullquote font size is a closer match when comparing the editor to the front-end).
4. Switch to Newspack Katharine; confirm that the non-aligned Pullquote block has the text aligned centre in the editor.
5. Confirm that the aligned pullquote blocks just have one little top line (not a full corner).

6. Switch to Newspack Nelson; confirm that the non-aligned Pullquote block has the text aligned centre in the editor.
7. Confirm that the block has a top and bottom border on the front-end:

8. Lastly, on a post, add both a subtitle and post title and ensure they're the same width in the editor preview (prior to this change, the post title is too narrow, it should be ~1200px wide).

Other information:

• Have you added an explanation of what your changes do and why you'd like us to include them?
• Have you written new tests for your changes, as applicable?
• Have you successfully ran tests with your changes locally?

[Copilot]

Pull request overview

This PR updates Newspack theme/editor SCSS to address WordPress 7.0 visual regressions: oversized floated Icon blocks and mismatched/oversized Pullquote styling in the editor, plus a couple related Nelson/Katharine pullquote styling fixes.

Changes:

• Constrain aligned Icon block SVG sizing (editor + front-end) to prevent overflow when large.
• Adjust editor Pullquote font sizing/behavior in the base editor styles to better match front-end rendering.
• Fix Nelson/Katharine editor pullquote alignment and border/corner presentation (and Nelson front-end pullquote borders).

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
newspack-theme/sass/style-editor-base.scss	Adds editor constraints for aligned Icon blocks; adjusts Pullquote font-size handling in the editor.
newspack-theme/sass/blocks/_blocks.scss	Ensures aligned Icon block SVGs don’t overflow on the front-end.
newspack-nelson/sass/style.scss	Ensures pullquote borders render (adds missing border-style).
newspack-nelson/sass/style-editor.scss	Centers non-aligned pullquotes in editor; left-aligns aligned pullquotes.
newspack-katharine/sass/style-editor.scss	Centers non-aligned pullquotes in editor; refines aligned pullquote border/corner behavior.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.