fix(compare): anchor grade-5 & EBacc rows; restore secondary-button outline
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m4s
PR Checks / Backend Smoke (pull_request) Successful in 7s
PR Checks / Build Backend (no push) (pull_request) Successful in 11s
PR Checks / Build Frontend (no push) (pull_request) Successful in 48s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 10s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 8s
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m4s
PR Checks / Backend Smoke (pull_request) Successful in 7s
PR Checks / Build Backend (no push) (pull_request) Successful in 11s
PR Checks / Build Frontend (no push) (pull_request) Successful in 48s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 10s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 8s
SF1 (expert sign-off): the secondary academics 'Grade 5+ in English & maths' and 'EBacc entry' rows rendered as bare numbers — the one place the 'every number anchored against the England average' promise broke. Both now show the official England anchor (already in the payload) + an Above/Close/Below verdict chip, matching Attainment 8 (which also gains a chip for consistency). Button affordance: globals.css has a duplicate .btn block whose 'border: none' overrode the base '1px solid transparent', so .btn-secondary/.btn-active's 'border-color' had no width — every outline button (the modal's '+ Compare', search-result '+ Compare', 'Comparing') rendered as borderless teal text. Give the outline variants the full 'border' shorthand so the outline renders regardless of the clobbered base. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_0146VHeLAWjDVE2B5uU67jCB
This commit is contained in:
@@ -183,10 +183,15 @@ body {
|
||||
}
|
||||
|
||||
/* Secondary: teal outline — supporting actions (+ Compare) */
|
||||
/* NOTE: a duplicate `.btn` block further down this file sets `border: none`,
|
||||
which wins over the base `.btn`'s `1px solid transparent`. The outline
|
||||
variants below therefore declare the full `border` shorthand explicitly so
|
||||
they don't depend on the base border-width — otherwise `border-color` alone
|
||||
has no width and the outline never renders (buttons read as plain text). */
|
||||
.btn-secondary {
|
||||
background: transparent;
|
||||
color: var(--accent-teal);
|
||||
border-color: var(--accent-teal);
|
||||
border: 1px solid var(--accent-teal);
|
||||
}
|
||||
.btn-secondary:hover:not(:disabled) {
|
||||
background: var(--accent-teal-bg);
|
||||
@@ -196,7 +201,7 @@ body {
|
||||
.btn-tertiary {
|
||||
background: var(--bg-secondary);
|
||||
color: var(--text-secondary);
|
||||
border-color: var(--border-color);
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
.btn-tertiary:hover:not(:disabled) {
|
||||
background: var(--border-color);
|
||||
@@ -207,7 +212,7 @@ body {
|
||||
.btn-active {
|
||||
background: var(--accent-teal-bg);
|
||||
color: var(--accent-teal);
|
||||
border-color: var(--accent-teal);
|
||||
border: 1px solid var(--accent-teal);
|
||||
}
|
||||
.btn-active:hover:not(:disabled) {
|
||||
background: transparent;
|
||||
|
||||
Reference in New Issue
Block a user