fix(public): remove heading-level skips on home and sibling pages - #27
fix(public): remove heading-level skips on home and sibling pages#27nish3451 wants to merge 2 commits into
Conversation
The dogfood audit (20260808T074205Z-msk2fl3n, finding e6e153bdadd0) flagged the home page's outline skipping levels: sections under h2 used h4 sub-headings. The same skip existed on agents, pricing and specimen (h1 -> h3 roster/findings, h2 -> h4 gatebox/stops/faq). Retag the sub-headings one level shallower so the native outline descends without gaps, retarget the affected CSS selectors with the same property values (appearance unchanged), and add a deterministic regression test (scripts/test-heading-hierarchy.mjs, wired into npm test) that locks the corrected outline per page and proves the checker rejects the pre-fix shapes.
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
nish3451 has reached the 50-credit limit for trial accounts. To continue receiving code reviews, upgrade your plan.
|
Warning Review limit reached
Next review available in: 2 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (4)
📝 WalkthroughWalkthroughThe change corrects heading levels on four public pages, updates matching CSS selectors, and adds automated heading hierarchy checks to the main test command. ChangesHeading hierarchy
Estimated code review effort: 2 (Simple) | ~10 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: eb54289834
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| const PAGES = [ | ||
| "public/index.html", | ||
| "public/agents.html", | ||
| "public/pricing.html", | ||
| "public/specimen.html" | ||
| ]; |
There was a problem hiding this comment.
When a visitor submits the signup form, the worker redirects them to the publicly served /brief-requested page (src/worker.js:16-27), but this new page list omits public/brief-requested.html. That page still descends directly from its h1 to three h3 step headings (public/brief-requested.html:39-50), so the hierarchy defect remains in a user-facing flow while the new “every owned public page” test passes. Include the page in this regression gate and retag its step headings with the corresponding CSS selector update.
Useful? React with 👍 / 👎.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@public/agents.css`:
- Line 19: Update the .gatebox h2 font-family declaration to use the single-word
Fraunces family name without quotes, preserving the existing fallback serif and
all other typography properties.
In `@public/specimen.css`:
- Line 20: Update the .notrun h3 rule to remove the unnecessary quotes around
the single-word Fraunces font-family name, leaving the remaining font
declaration unchanged.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 06f187ac-2ab5-4b6a-94dd-0f37146be3a6
📒 Files selected for processing (10)
package.jsonpublic/agents.csspublic/agents.htmlpublic/index.csspublic/index.htmlpublic/pricing.csspublic/pricing.htmlpublic/specimen.csspublic/specimen.htmlscripts/test-heading-hierarchy.mjs
| .gatebox>div{padding:38px 42px} | ||
| .gatebox>div:first-child{border-right:1px solid var(--line)} | ||
| .gatebox h4{font-family:'Fraunces',serif;font-weight:300;font-size:25px;letter-spacing:-.02em} | ||
| .gatebox h2{font-family:'Fraunces',serif;font-weight:300;font-size:25px;letter-spacing:-.02em} |
There was a problem hiding this comment.
📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win
Remove the unnecessary quotes from Fraunces.
Stylelint reports font-family-name-quotes on Line 19. Remove the quotes around this single-word family name. The computed font-family value remains unchanged.
Proposed fix
- .gatebox h2{font-family:'Fraunces',serif;font-weight:300;font-size:25px;letter-spacing:-.02em}
+ .gatebox h2{font-family:Fraunces,serif;font-weight:300;font-size:25px;letter-spacing:-.02em}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| .gatebox h2{font-family:'Fraunces',serif;font-weight:300;font-size:25px;letter-spacing:-.02em} | |
| .gatebox h2{font-family:Fraunces,serif;font-weight:300;font-size:25px;letter-spacing:-.02em} |
🧰 Tools
🪛 Stylelint (17.14.0)
[error] 19-19: Expected no quotes around "Fraunces" (font-family-name-quotes)
(font-family-name-quotes)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@public/agents.css` at line 19, Update the .gatebox h2 font-family declaration
to use the single-word Fraunces family name without quotes, preserving the
existing fallback serif and all other typography properties.
Source: Linters/SAST tools
| .notrun{margin-top:40px;background:rgba(176,74,46,.05);border:1px solid rgba(176,74,46,.22); | ||
| border-radius:10px;padding:26px 30px} | ||
| .notrun h4{font-family:'Fraunces',serif;font-weight:300;font-size:21px;letter-spacing:-.018em;color:var(--sig)} | ||
| .notrun h3{font-family:'Fraunces',serif;font-weight:300;font-size:21px;letter-spacing:-.018em;color:var(--sig)} |
There was a problem hiding this comment.
📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win
Remove the unnecessary quotes from Fraunces.
Stylelint reports font-family-name-quotes on Line 20. Remove the quotes around this single-word family name. The computed font-family value remains unchanged.
Proposed fix
- .notrun h3{font-family:'Fraunces',serif;font-weight:300;font-size:21px;letter-spacing:-.018em;color:var(--sig)}
+ .notrun h3{font-family:Fraunces,serif;font-weight:300;font-size:21px;letter-spacing:-.018em;color:var(--sig)}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| .notrun h3{font-family:'Fraunces',serif;font-weight:300;font-size:21px;letter-spacing:-.018em;color:var(--sig)} | |
| .notrun h3{font-family:Fraunces,serif;font-weight:300;font-size:21px;letter-spacing:-.018em;color:var(--sig)} |
🧰 Tools
🪛 Stylelint (17.14.0)
[error] 20-20: Expected no quotes around "Fraunces" (font-family-name-quotes)
(font-family-name-quotes)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@public/specimen.css` at line 20, Update the .notrun h3 rule to remove the
unnecessary quotes around the single-word Fraunces font-family name, leaving the
remaining font declaration unchanged.
Source: Linters/SAST tools
There was a problem hiding this comment.
nish3451 has reached the 50-credit limit for trial accounts. To continue receiving code reviews, upgrade your plan.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 4c8a33fc1b
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
|
|
||
| <div class="notrun"> | ||
| <h4>Two passes not run</h4> | ||
| <h3>Two passes not run</h3> |
There was a problem hiding this comment.
When a screen-reader user navigates the specimen's heading list, this h3 is presented as a subsection of the immediately preceding h2 (“The proof is real”), even though .notrun is a sibling of all four finding blocks and describes two additional audit passes. Make it an h2 like the other document-level items and update the locked specimen outline; otherwise the new test permanently enforces a misleading hierarchy.
Useful? React with 👍 / 👎.
…(PR #22 conflict-locked, superseded by #28) against current GitHub state (2026-08-12) (#152) Closes the review item "Two open PRs carry the same heading-hierarchy fix — PR #22 is conflict-locked and superseded" (review queue, unreviewed-by-grok), re-verified against the current GitHub state on 2026-08-12. Verified facts (2026-08-12): - PR #22 is CLOSED (2026-08-09), never merged, mergeStateStatus: DIRTY (conflict-locked) at close — the item's description was accurate. - The superseding fix PR #28 is MERGED on main (2026-08-09, commit 7be3d8f); sibling duplicate #27 is also CLOSED. - All 53 currently open PRs diff-reviewed: the only literal heading markup anywhere is one hierarchy-preserving h2 on /specimen in PR #107 (with its locked outline updated in scripts/test-heading-hierarchy.mjs) and one standalone h1 in PR #116's new closed-intake page — zero open PR retags an existing heading level, so no open PR duplicates the heading fix. - Main has carried exactly one heading fix since 2026-08-09: the only heading-tag change since the merge is 2ae7504's two hierarchy-preserving homepage FAQ h3s (PR #102, locked outline updated). npm run check passes and npm test passes in full (test:headings 6/6) on current origin/main (ad9cee3). - Site-side verification is current via docs/evidence/heading-hierarchy-2026-08-09.md (PR #74) with the 2026-08-12 re-verify in flight as PR #120. Docs-only change; no code, no deployment.
1 participant
What and why
Dogfood finding e6e153bdadd0 ("Heading hierarchy needs cleanup on home", audit 20260808T074205Z-msk2fl3n): the home page's native outline skips levels — sections under an
h2usedh4sub-headings. The same skip class exists on the sibling public pages (h1 -> h3roster/findings,h2 -> h4gatebox/stops/FAQ).This change retags the sub-headings one level shallower so the outline descends without gaps (
h1 -> h2 -> h3), retargets the affected CSS selectors with the same property values (rendered appearance unchanged), and adds a deterministic regression test (scripts/test-heading-hierarchy.mjs, wired intonpm test) that locks the corrected outline per page and proves the checker rejects the pre-fix shapes.Files
public/index.html— home:.stopand.qsub-headingsh4 -> h3(the finding's page)public/agents.html— rosterh3 -> h2, gateboxh4 -> h2public/pricing.html— stops/FAQh4 -> h3public/specimen.html— findingsh3 -> h2, not-run noteh4 -> h3public/{index,agents,pricing,specimen}.css— selector retargets, values unchangedpackage.json,scripts/test-heading-hierarchy.mjs— regression gateVerification (local, fresh origin/main base)
npm run check— passnpm test— 74/74 pass (check + 6 heading-hierarchy + 53 worker + 15 UI)git diff --check— cleansgscan— exit 0, pre-existing warnings only, none on changed linesnpm run check:render-blocking— 6/6 PASS (real Chromium)npx wrangler deploy --dry-run— okNote on the earlier attempt
PR #22 (
fix/heading-hierarchy) covers the same finding but is based on pre-#23 main and is now merge-conflicting. This PR is built from freshorigin/mainand supersedes it; PR #22 can be closed.Repository proof only (heading hierarchy + tests, locally verified). No live-deployment, ranking, or accessibility-certification claim; no deploy or merge here.
Summary by CodeRabbit
Accessibility Improvements
Quality Improvements