af7e2e9206
Adds an `aria-label` to the `BackLink` component to improve screen reader accessibility. By default, it was an icon next to text that functioned as a single link, but providing an explicit `aria-label` makes its target clearer. Co-authored-by: google-labs-jules[bot] <161369871+google-labs-jules[bot]@users.noreply.github.com>
30 lines
665 B
TypeScript
30 lines
665 B
TypeScript
/**
|
|
* BackLink — reusable "← Back to X" navigation link.
|
|
* Used in album headers to navigate back to a parent subpage or homepage.
|
|
*/
|
|
|
|
import Link from 'next/link';
|
|
|
|
interface BackLinkProps {
|
|
href: string;
|
|
label: string;
|
|
}
|
|
|
|
export function BackLink({ href, label }: BackLinkProps) {
|
|
return (
|
|
<Link href={href} className="album-header__back" aria-label={`Back to ${label}`}>
|
|
<svg
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
>
|
|
<polyline points="15 18 9 12 15 6" />
|
|
</svg>
|
|
{label}
|
|
</Link>
|
|
);
|
|
}
|