docs: improve accessibility with ARIA labels, focus states and contrast adjustments

This commit is contained in:
AyrisAI
2026-05-16 01:15:12 +03:00
parent 158e6be514
commit f6af0ba227
3 changed files with 17 additions and 15 deletions

View File

@@ -14,7 +14,7 @@ export default function Navbar() {
>
<div className="flex items-center justify-between px-6 md:px-12 py-5">
{/* Logo */}
<Link href="/" className="flex items-center gap-3">
<Link href="/" className="flex items-center gap-3 focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-4 rounded-sm" aria-label="Muğla Dijital - Ana Sayfaya Dön">
<motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
@@ -59,7 +59,7 @@ export default function Navbar() {
>
<Link
href={item.href}
className="text-[11px] tracking-[0.15em] uppercase text-black/60 hover:text-black transition-colors nav-link-hover px-3 py-2"
className="text-[11px] tracking-[0.15em] uppercase text-black/70 hover:text-black transition-colors nav-link-hover px-3 py-2 focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-4 rounded-sm"
>
{item.label}
</Link>
@@ -74,6 +74,7 @@ export default function Navbar() {
animate={{ opacity: 1 }}
transition={{ delay: 1 }}
className="text-[13px] font-bold tracking-[0.1em] uppercase text-black"
aria-hidden="true"
>
Muğla Dijital
</motion.span>