Migrate blog, card, and misc content patterns to the Core Icon block (LS-3229) - #48
Open
brandonmarshal wants to merge 4 commits into
Open
Conversation
…(LS-3229)
Icon block conversion
- Replace outermost/icon-block with core/icon across 11 files
- Reference lightspeed/{name} icons instead of inline SVG
- Cover 22 of 31 instances (9 skipped, see below)
Icons used
- blog-hero, blog-single-hero, eyebrow-badge, template-single,
blog-engagement: dot
- footer: dot (x6), linkedin, facebook, instagram
- 404-best-next-routes: dot, house, tag, archive, help, envelope
- section-card-feature, section-card-solutions: blank placeholder
icon blocks converted to blank wp:icon (no icon selected either way)
Known gaps
- footer.php: GitHub social icon left as outermost/icon-block
(no lightspeed collection match)
- section-card-services.php: iconName "rocket-launch" left untouched
(plugin-native named icon, no embedded SVG to verify against)
- thank-you-consultation.php: 7 instances left untouched (iconName-only
references: check x3, users, lightbulb, buildings — no embedded SVG
to verify against)
- All tracked in LS-3229's "Missing icons" list for a later bulk pass
Verification
- Zero unintended remaining outermost/icon-block references
(9 expected exceptions, all logged)
- PHP block-rendering test confirms correct SVG output, no errors
brandonmarshal
added
area:theme
There was a problem hiding this comment.
🟡 Changes recommended
The new core/icon placeholders in the card icon shells won’t receive the existing shell styling without adding the legacy compatibility classes.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Pull request overview
This PR continues the LS-3229 migration away from the third‑party outermost/icon-block to WordPress’s native core/icon block across blog, card, footer, and misc content patterns, using the lightspeed/* icon collection.
Changes:
- Replaces multiple embedded-SVG
outermost/icon-blockinstances withcore/iconreferences (notably the repeated “dot” markers and several 404 route icons). - Updates the footer pattern’s social icon row to use
core/iconwhere thelightspeedequivalents exist, while intentionally leaving specific plugin-native icons untouched. - Converts blank icon placeholders in card patterns to
core/iconplaceholders.
File summaries
| File | Description |
|---|---|
| patterns/hero/blog-hero.php | Migrates the hero “dot” marker to core/icon. |
| patterns/hero/blog-single-hero.php | Migrates the hero “dot” marker to core/icon. |
| patterns/cards/section-card-feature.php | Converts the icon placeholder to core/icon (needs class compatibility with existing shell CSS). |
| patterns/cards/section-card-services.php | Leaves the plugin-native rocket-launch icon instance intentionally untouched. |
| patterns/cards/section-card-solutions.php | Converts the icon placeholder to core/icon (needs class compatibility with existing frame CSS). |
| patterns/content/eyebrow-badge.php | Migrates the “dot” marker to core/icon. |
| patterns/footer.php | Migrates multiple footer dots and several social icons to core/icon, leaving one plugin-native icon instance intentionally untouched. |
| patterns/template-single.php | Migrates the “dot” marker used in “Related reading” to core/icon. |
| patterns/thank-you-consultation.php | Keeps several plugin-native named-icon instances intentionally untouched (per “missing icons” tracking). |
| patterns/sections/404-best-next-routes.php | Migrates “dot” marker and multiple route icons (house/tag/archive/help/envelope) to core/icon. |
| patterns/sections/blog-engagement.php | Migrates the “dot” marker to core/icon. |
Review details
- Files reviewed: 9/9 changed files
- Comments generated: 2
- Review effort level: Lite
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Bug fix - Add .wp-block-icon rule to .ls-card__icon-shell and .ls-icon-frame-glow - core/icon renders one wrapper div, not the two nested divs (.wp-block-outermost-icon-block > .icon-container) the old outermost/icon-block plugin used, so neither shell's color/fill styling was reaching a newly-selected icon - Rebuild assets/css/card-shells.css from the updated source Context - Flagged by GitHub Copilot's review on PR #48 - Confirmed as part of a wider pattern; two more instances (menu hover color, card-link-row hover color) left untouched and tracked in LS-3719 for a dedicated follow-up audit/fix
5 tasks
brandonmarshal
added a commit
that referenced
this pull request
Sep 9, 2026
…ration (LS-3720) (#49) * Fix legacy outermost/icon-block CSS selectors broken by Core Icon migration (LS-3720) Bug fix - Add .wp-block-icon alongside .wp-block-outermost-icon-block in _menu-motion.scss (mega-menu chevron hover/focus color + reduced-motion) - Add .wp-block-icon alongside .wp-block-outermost-icon-block .icon-container in work-archive-sections.scss (card-link-row hover/focus icon color) - Both fixes are additive: any not-yet-converted outermost/icon-block instance keeps working, core/icon instances now get the same treatment Cleanup - Remove dead .site-footer .icon-container svg{fill:currentColor} rule from _footer-motion.scss — redundant now that every lightspeed/* icon bakes fill="currentColor" into its own path, and WP core's default stylesheet already forces .wp-block-icon svg{fill:currentColor} - Delete assets/css/animations.min.css — stale, unenqueued build artifact with no reference anywhere in the codebase Context - Found via audit LS-3719, filed as bug LS-3720 - Not stacked on the LS-3229 batch PR chain (#44/#45/#47/#48) since none of these files overlap with those diffs; branched off develop Verification - npm run build:css run in full; only animations.css and work-archive-sections.css changed - Compiled CSS selector counts verified (4+4 and 2+2 respectively) - Confirmed zero remaining references to animations.min.css before deleting * Move mega-menu icon hover colour out of the motion partial (LS-3720) Bug fix - Relocate `.is-style-mega-menu-item-default` icon hover/focus `color` rule from `src/scss/animations/_menu-motion.scss` to `src/scss/structural/_mega-menu.scss` - Animations partial now only holds the `transition` property and its reduced-motion override, per AGENTS.md's motion-only rule for `src/scss/animations/**` Context - Addresses Copilot review feedback on PR #49: the colour swap is a non-motion property and belongs in the structural partial alongside the existing `.is-style-mega-menu-item-default` rules - Rebuilt `assets/css/animations.css` to reflect the change * Updating CHANGELOG.md
…con-block-content-misc
Fix - section-card-services.php: rocket-launch icon converted to core/icon - footer.php: GitHub social icon converted to core/icon - thank-you-consultation.php: 4x check, 1x users, 1x lightbulb, 1x buildings all converted to core/icon - Mapped to lightspeed/rocket-launch, lightspeed/github, lightspeed/check, lightspeed/users, lightspeed/lightbulb, lightspeed/buildings, now available after ls-plugin#24 Verification - php -l passes on all 3 touched files - Re-scanned all 11 Batch 4 files: 0 remaining outermost/icon-block instances Context - Closes out Batch 4's entry in LS-3229's "Missing icons" tracking list - Completes the full icon-block migration across all 5 batches (204/204 instances)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Replaces
outermost/icon-block(third-party "Icon Block" plugin) instances in the blog, card, and misc content patterns with WordPress 7.1's native Core Icon block (core/icon), referencing icons from thelightspeedcollection registered inls-plugin. Fourth of 5 stacked batches migrating all 38outermost/icon-blockusages across the theme (see LS-3229). Stacked onfeature/ls-3229-icon-block-work(#47).Files changed (11 files, 31 icon instances — 22 converted, 9 intentionally skipped)
patterns/hero/blog-hero.php—dotpatterns/hero/blog-single-hero.php—dotpatterns/cards/section-card-feature.php— blank placeholder converted to blankwp:icon(no icon selected, no behavior change)patterns/cards/section-card-services.php— 1 instance left untouched (see below)patterns/cards/section-card-solutions.php— blank placeholder converted to blankwp:iconpatterns/content/eyebrow-badge.php—dotpatterns/footer.php—dot×6,linkedin,facebook,instagram; 1 instance left untouched (see below)patterns/template-single.php—dotpatterns/thank-you-consultation.php— 7 instances left untouched (see below)patterns/sections/404-best-next-routes.php—dot,house,tag,archive,help,envelopepatterns/sections/blog-engagement.php—dotNew wrinkle this batch: plugin-native named icons with no embedded SVG
Several skipped instances in this batch aren't cases of a missing
lightspeedicon — they use theoutermost/icon-blockplugin's own bundled icon library viaiconName(e.g."check","rocket-launch","buildings") with no embedded<svg>at all, so there's no shape to verify against the collection. Per Brandon's direction (don't guess-replace with a possibly-wrong existing icon), these are left untouched and logged:patterns/cards/section-card-services.php—iconName:"rocket-launch"(34px). Phosphor's "rocket-launch" is visually distinct from the existinglightspeed/rocket(adds a flame/motion trail) — needs sourcing as its own icon.patterns/footer.php— a GitHub logo mark in the social icon row (18px), not present in thelightspeedcollection at all.patterns/thank-you-consultation.php— 7 instances:iconName:"check"×3 (16px, varying colours),"users","lightbulb","buildings"(18px each).lightspeed/checkandlightspeed/lightbulbalready exist and are very likely correct 1:1 substitutes, but flagged rather than assumed;users/buildingsneed more care (singular/plural ambiguity in the collection).All 9 logged in LS-3229's "Missing icons — cross-batch tracking list" for a single bulk-sourcing pass once all 5 batches are complete.
Markup change
Same pattern as prior batches —
core/iconis dynamic (server-rendered), so every instance collapses to a single self-closing comment, e.g.:Test plan
outermost/icon-blockcount matches expected exceptions exactly (9 remaining across 3 files, all intentional and logged)wp:iconinstance count matches the verified 22-instance mapping table exactly, per filewp:iconJSON attribute payload parses as valid JSON (scripted check across all 11 files)parse_blocks+render_blockviawp eval-file) on all 11 files — zero errors, correct<svg>/.wp-block-iconcount per file, including nested-pattern inflation (template-single.phppulling in still-unconvertedblog-post-card/blog-writing-cta, correctly left alone as out of scope) confirmed as expected rather than a bugPart of LS-3229 (Batch 4 of 5). Next: Batch 5 (Services), a separate stack rooted at
feature/ls-1598-build-services-page.