feat(uat-batch-21): a11y — auth-page link contrast bumped past AA
`text-[#007bff] hover:underline` (light blue, 12-14px) was falling below WCAG 1.4.3 AA contrast against the auth shell's white card. Bumped to `text-[#0058b3]` (darker variant of the same hue) and added `underline underline-offset-2 hover:no-underline` so the link is always visibly underlined as a backup affordance. Affects: /login, /reset-password, /set-password, /portal/login, /portal/forgot-password, portal password-set-form. Button bg colors (white-text on the same blue) are unchanged — those pass AA at button sizes. tsc clean. 1419/1419 vitest pass. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -133,7 +133,10 @@ export default function LoginPage() {
|
|||||||
<div className="space-y-1.5">
|
<div className="space-y-1.5">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<Label htmlFor="password">Password</Label>
|
<Label htmlFor="password">Password</Label>
|
||||||
<Link href="/reset-password" className="text-xs text-[#007bff] hover:underline">
|
<Link
|
||||||
|
href="/reset-password"
|
||||||
|
className="text-xs text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
|
>
|
||||||
Forgot password?
|
Forgot password?
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -88,7 +88,10 @@ export default function ResetPasswordPage() {
|
|||||||
If an account exists for that email address, we have sent a password reset link. Please
|
If an account exists for that email address, we have sent a password reset link. Please
|
||||||
check your inbox and spam folder.
|
check your inbox and spam folder.
|
||||||
</p>
|
</p>
|
||||||
<Link href="/login" className="inline-block text-sm text-[#007bff] hover:underline">
|
<Link
|
||||||
|
href="/login"
|
||||||
|
className="inline-block text-sm text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
|
>
|
||||||
Back to sign in
|
Back to sign in
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
@@ -118,7 +121,10 @@ export default function ResetPasswordPage() {
|
|||||||
|
|
||||||
<p className="text-center text-sm text-gray-500">
|
<p className="text-center text-sm text-gray-500">
|
||||||
Remember your password?{' '}
|
Remember your password?{' '}
|
||||||
<Link href="/login" className="text-[#007bff] hover:underline">
|
<Link
|
||||||
|
href="/login"
|
||||||
|
className="text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
|
>
|
||||||
Sign in
|
Sign in
|
||||||
</Link>
|
</Link>
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@@ -120,7 +120,10 @@ function SetPasswordInner() {
|
|||||||
Please use the link from the email we sent you. If the link is broken, ask your
|
Please use the link from the email we sent you. If the link is broken, ask your
|
||||||
administrator for a new one.
|
administrator for a new one.
|
||||||
</p>
|
</p>
|
||||||
<Link href="/login" className="inline-block text-sm text-[#007bff] hover:underline">
|
<Link
|
||||||
|
href="/login"
|
||||||
|
className="inline-block text-sm text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
|
>
|
||||||
Back to sign in
|
Back to sign in
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -44,7 +44,7 @@ export default function PortalForgotPasswordPage() {
|
|||||||
</p>
|
</p>
|
||||||
<Link
|
<Link
|
||||||
href="/portal/login"
|
href="/portal/login"
|
||||||
className="mt-6 inline-block text-sm text-[#007bff] hover:underline"
|
className="mt-6 inline-block text-sm text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
>
|
>
|
||||||
Back to sign in
|
Back to sign in
|
||||||
</Link>
|
</Link>
|
||||||
@@ -95,7 +95,10 @@ export default function PortalForgotPasswordPage() {
|
|||||||
|
|
||||||
<p className="text-center text-sm text-gray-500">
|
<p className="text-center text-sm text-gray-500">
|
||||||
Remember your password?{' '}
|
Remember your password?{' '}
|
||||||
<Link href="/portal/login" className="text-[#007bff] hover:underline">
|
<Link
|
||||||
|
href="/portal/login"
|
||||||
|
className="text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
|
>
|
||||||
Sign in
|
Sign in
|
||||||
</Link>
|
</Link>
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@@ -91,7 +91,10 @@ export default function PortalLoginPage() {
|
|||||||
<div className="space-y-1.5">
|
<div className="space-y-1.5">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<Label htmlFor="password">Password</Label>
|
<Label htmlFor="password">Password</Label>
|
||||||
<Link href="/portal/forgot-password" className="text-xs text-[#007bff] hover:underline">
|
<Link
|
||||||
|
href="/portal/forgot-password"
|
||||||
|
className="text-xs text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
|
>
|
||||||
Forgot password?
|
Forgot password?
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -128,7 +128,7 @@ export function PasswordSetForm({
|
|||||||
</p>
|
</p>
|
||||||
<Link
|
<Link
|
||||||
href="/portal/forgot-password"
|
href="/portal/forgot-password"
|
||||||
className="inline-block text-sm text-[#007bff] hover:underline"
|
className="inline-block text-sm text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
>
|
>
|
||||||
Request a new link
|
Request a new link
|
||||||
</Link>
|
</Link>
|
||||||
@@ -148,7 +148,7 @@ export function PasswordSetForm({
|
|||||||
<p className="text-gray-500 text-sm">{successDescription}</p>
|
<p className="text-gray-500 text-sm">{successDescription}</p>
|
||||||
<Link
|
<Link
|
||||||
href="/portal/login"
|
href="/portal/login"
|
||||||
className="mt-6 inline-block text-sm text-[#007bff] hover:underline"
|
className="mt-6 inline-block text-sm text-[#0058b3] underline-offset-2 underline hover:no-underline"
|
||||||
>
|
>
|
||||||
Sign in
|
Sign in
|
||||||
</Link>
|
</Link>
|
||||||
|
|||||||
Reference in New Issue
Block a user