Commita48f839
fix(a11y): register and 2FA pages had no h1 element
fix(a11y): register and 2FA pages had no h1 element
The readiness gate's headings check flagged /register as having no <h1>. The
raw HTML does contain the string "<h1", which made it look like a false
positive — but that occurrence is inside an inlined <script>: the client-side
markdown renderer in views/client-js.ts replaces /^# (.+)$/ with '<h1>$1</h1>'.
Script text is not DOM, so document.querySelectorAll('h1') correctly returned
zero. (The same script text is why the page appears to contain a literal "$1"
seven times; all seven are inside <script> and are legitimate JS replacement
patterns, not broken output.)
Both auth pages used <h2> for what is unambiguously the page's primary
heading, leaving the document with no h1 for screen readers or document
outline. /login already gets this right with <h1 class="si-heading">.
Promote both to <h1> and extend `.auth-container h2` to
`.auth-container h1, .auth-container h2`. That rule fully specifies
font-size/weight/family/letter-spacing, so without widening the selector the
generic `h1 { font-size: var(--t-xl) }` would have taken over and changed the
rendered size. This way the fix is semantic only — pixel-identical output.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>2 files changed+9−2a48f839c823c2286c93172ab38d82d201cf89070
2 changed files+9−2
Modifiedsrc/routes/auth.tsx+2−2View fileUnifiedSplit
@@ -96,7 +96,7 @@ auth.get("/register", softAuth, (c) => {
9696 <Layout title="Register" user={null}>
9797 <AuthMobileStyle />
9898 <div class="auth-container">
99 <h2>Create your account</h2>
99 <h1>Create your account</h1>
100100 <p class="auth-subtitle">
101101 Get the full AI suite — code review, auto-merge, spec-to-PR — on
102102 unlimited public repos. No credit card.
@@ -594,7 +594,7 @@ auth.get("/login/2fa", async (c) => {
594594 <Layout title="Two-factor authentication" user={null}>
595595 <AuthMobileStyle />
596596 <div class="auth-container">
597 <h2>Enter your code</h2>
597 <h1>Enter your code</h1>
598598 <p
599599 class="auth-switch"
600600 style="margin-bottom: 16px; margin-top: 0"
Modifiedsrc/views/layout.tsx+7−0View fileUnifiedSplit
@@ -2224,6 +2224,13 @@ const css = `
22242224 position: relative;
22252225 overflow: hidden;
22262226 }
2227 /* h1 and h2 share this rule so the auth pages' primary heading can be a
2228 semantic <h1> — which is what it is — without any visual change. The
2229 register page previously had NO h1 element at all: its only <h1> in the
2230 markup sits inside the inlined client-side markdown renderer's JS
2231 (views/client-js.ts replaces /^# (.+)$/ with '<h1>$1</h1>'), which is
2232 script text, not DOM. */
2233 .auth-container h1,
22272234 .auth-container h2 {
22282235 margin: 0 0 8px;
22292236 font-size: 28px;
22302237