Fix homepage P3 findings from #898 (#898 P3) - #902
Merged
Conversation
… dead centring CSS, hover-glow selector leak, code-sample colors, small consistency items Picks up the remaining P3 items after #899/#900/#901: findings 23, 25, 26, 27, 28, 29. - Finding 23: AudienceSection had no section-level heading at all (the real outlier among four alignment treatments). Gave it an eyebrow + <h2> + id matching its sibling sections, demoted lane titles from <h2> to <h3> so the heading outline is no longer promoted to section level. Kept the existing centered/left-aligned split for the other sections as-is to keep the diff reviewable, matching PR #901's own precedent. - Finding 25: merged 6 selectors (.pathCard small, .loopStep small, .footerBadges strong, .finalKicker, .proofGrid, .proofCard) that were each split across two distant blocks of the same file, preserving declaration order so no computed style changes. - Finding 26: removed the dead ::after optical-centring spacer and the inert text-align: center on hero/final CTA buttons (they render left-aligned icon+label; neither declaration did anything). - Finding 27: scoped every `[data-hover-glow]` CSS selector under a `.hoverGlow` module class so the styling cannot leak globally out of this page's CSS module onto any future `data-hover-glow` element elsewhere on the site. - Finding 28: gave `.codeAnnotation`/`.codeKeyword` their own color-mix values (65%/50% primary-into-on-dark, same technique as the existing `.codeString`) instead of sharing muted with `.codeCall`, so the Java sample's 5 token classes render 5 distinct colors instead of 3. Both percentages hand-verified against the WCAG relative-luminance formula (>=4.5:1 in both themes) before use. - Finding 29 (six small items): external links now consistently open in a new tab with a visible arrow-icon affordance; the self-referential "SHAFT" wordmark link (/ to /) is now a non-interactive span; heroMeta no longer restates Java 25/MIT/Allure native already in footerBadges; .allureGrid .sectionHeading no longer sits above vertical center; .heroGrid (display: block) renamed to .heroLayout; the dense 32-word hero sub-copy sentence naming four products is tightened. TDD: added ~25 new assertions to tests/homepage-performance.test.js, each watched RED against the pre-fix source, then GREEN after the corresponding fix. Updated composited-contrast.spec.js where my changes directly affect existing assertions (.audienceLane h2->h3, heroBrand no longer an <a>, comment accuracy). Test plan: - node tests/homepage-performance.test.js -- pass - npx tsc --noEmit -p tsconfig.json -- clean - npm run build -- clean production build - npx playwright test tests/e2e/homepage.spec.js tests/e2e/composited-contrast.spec.js tests/e2e/hash-scroll-sync.spec.js -- 20/20 pass - npm run test:docs (docs-loader, docs-quality, design-contrast 9/9 WCAG pairs, duplicate-check) -- pass - npm run test:release-template, npm run test:history -- pass - Recaptured test-screenshots/01-homepage-before-chat.png against the live built site, per this repo's convention - Full-page and close-up screenshots (audience section, hero trust links, code proof, footer, allure grid) visually confirmed Ref #898 Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_019wEoJduy4Q4jfHWejcizCe
MohabMohie
enabled auto-merge (squash)
July 27, 2026 12:49
Deploying with
|
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs |
shaft-engine | 5d35ba5 | Commit Preview URL Branch Preview URL |
Jul 27 2026, 12:56 PM |
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
…link check CodeQL flagged two href string literals (central.sonatype.com, opensource.googleblog.com) as "Incomplete regular expression for hostnames" because they get interpolated into new RegExp() -- even though the existing .replace() escape already neutralizes all regex metachars. Rather than fight CodeQL's sanitizer recognition, drop the regex construction entirely: locate the anchor tag via plain indexOf/lastIndexOf substring search and check target/rel on the extracted tag slice. Verified equivalent pass/fail behavior on the positive case, missing-target/rel case, and missing-href case.
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
2 participants
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
Picks up the remaining P3 findings from #898 after #899 (P1), #900 (P2), and #901 (P2 remainder): findings 23, 25, 26, 27, 28, 29. Branched from
claude/issue-898-p2-remainder, rebased ontomasterafter #901 merged.Findings addressed
AudienceSectionhad no section-level heading at allAudienceSectionan eyebrow +<h2>+id="audience-section"matching its siblings, demoted lane titles from<h2>to<h3>so the heading outline isn't promoted to section level. Kept the other sections' existing centered/left-aligned split as-is to keep the diff reviewable (see Scope note below)..pathCard small,.loopStep small,.footerBadges strong,.finalKicker,.proofGrid,.proofCardinto single blocks, preserving declaration order so no computed style changed.text-align: centerand a::afterspacer on hero/final CTA buttons did nothing[data-hover-glow]is a global CSS-Modules-escaping attribute selector.hoverGlow[data-hover-glow]and added the.hoverGlowclass alongside the attribute at all 9 JSX call sites, so the styling can no longer leak onto an unrelated futuredata-hover-glowelement elsewhere on the site..codeAnnotation/.codeKeywordtheir owncolor-mixvalues (65%/50% primary-into-on-dark, same technique as the existing.codeString) instead of sharing muted with.codeCall. Both percentages hand-verified against the same WCAG relative-luminance formulacomposited-contrast.spec.jsuses: light theme 5.35:1 / 6.95:1, dark theme 11.87:1 / 13.13:1 — both well above the 4.5:1 floor.homepage.spec.js'suniqueTokenColors >= 3floor now has real headroom (5 unique colors).target="_blank" rel="noreferrer"with a visiblefaArrowUpRightFromSquareaffordance icon. The self-referentialSHAFTwordmark link (/to/) is now a non-interactive<span>.heroMetano longer restates Java 25/MIT/Allure native already infooterBadges..allureGrid .sectionHeadingno longer sits above vertical center..heroGrid(which isdisplay: block, not a grid) renamed to.heroLayout. The dense 32-word hero sub-copy sentence naming four products is tightened to ~13 words.Scope note (judgment call)
Finding 23's proposed fix suggested a page-wide alignment rule ("centred for full-bleed dark bands, left-aligned for content sections"), which would also mean flipping
GuidePathSectionfrom centered to left-aligned. I did not make that additional change —GuidePathSection's centering is a pre-existing, intentional choice from earlier work, not the actual defect the finding named (the defect wasAudienceSectionhaving no heading treatment at all, which is now fixed). Keeping the diff narrow here matches #901's own stated precedent of keeping P3 passes reviewable.Out of scope
Test plan
node tests/homepage-performance.test.js— ~25 new assertions, each watched RED against the pre-fix source, then GREEN after the corresponding fixnpx tsc --noEmit -p tsconfig.json— cleannpm run build— clean production buildnpx playwright test tests/e2e/homepage.spec.js tests/e2e/composited-contrast.spec.js tests/e2e/hash-scroll-sync.spec.js— 20/20 pass, headless, againstdocusaurus serveon the fresh buildnpm run test:docs(docs-loader, docs-quality, design-contrast 9/9 WCAG pairs, duplicate-check) — pass, no regressionsnpm run test:release-template,npm run test:history— passtest-screenshots/01-homepage-before-chat.pngagainst the live built site (reduced-motion emulated), per this repo's conventionRef #898
🤖 Generated with Claude Code
https://claude.ai/code/session_019wEoJduy4Q4jfHWejcizCe