1+ <!-- Main site navigation -->
12<nav
23 x-ref =" nav"
34 x-init ="
2122 }
2223 "
2324 class =" relative mx-auto flex max-w-8xl items-center justify-between overflow-x-clip px-8 pb-12 pt-5 sm:overflow-x-visible"
25+ aria-label =" Primary navigation"
2426>
2527 {{-- Mobile Menu Button --}}
2628 <button
2729 aria-controls =" main-menu"
30+ aria-expanded =" false"
2831 aria-haspopup =" true"
2932 x-on:click.prevent =" $store.sidebar.isOpen = ! $store.sidebar.isOpen"
3033 x-on:click.away =" $store.sidebar.isOpen = false"
3134 class =" transition duration-300 hover:scale-110 lg:hidden"
35+ id =" mobile-menu-button"
3236 >
33- <x-heroicon-o-bars-3 class =" h-7 w-7"
34-
35- <span class =" sr-only" span >
37+ <x-heroicon-o-bars-3
38+ class =" size-7"
39+ aria-hidden =" true"
40+ />
41+ <span class =" sr-only" span >
3642 </button >
3743
3844 @php
@@ -62,6 +68,7 @@ class="transition duration-300 hover:scale-110 lg:hidden"
6268 ' opacity-80' => ! request ()-> routeIs (' home*'
6369 ' font-semibold' => request ()-> routeIs (' home*'
6470 ] )
71+ @if (request ()-> routeIs (' home*' aria-current =" page" @endif
6572 >
6673 <div
6774 x-ref =" navItem"
@@ -82,6 +89,7 @@ class="transition duration-300 hover:scale-110 lg:hidden"
8289 ' text-evening opacity-80' => ! request ()-> routeIs (' docs*'
8390 ' text-butter' => request ()-> routeIs (' docs*'
8491 ] )
92+ @if (request ()-> routeIs (' docs*' aria-current =" page" @endif
8593 >
8694 <div
8795 x-ref =" navItem"
@@ -98,6 +106,7 @@ class="transition duration-300 hover:scale-110 lg:hidden"
98106 ' opacity-80' => ! request ()-> routeIs (' plugins*'
99107 ' font-semibold' => request ()-> routeIs (' plugins*'
100108 ] )
109+ @if (request ()-> routeIs (' plugins*' aria-current =" page" @endif
101110 >
102111 <div
103112 x-ref =" navItem"
@@ -118,6 +127,7 @@ class="transition duration-300 hover:scale-110 lg:hidden"
118127 ' opacity-80' => ! request ()-> routeIs (' articles*'
119128 ' font-semibold' => request ()-> routeIs (' articles*'
120129 ] )
130+ @if (request ()-> routeIs (' articles*' aria-current =" page" @endif
121131 >
122132 <div
123133 x-ref =" navItem"
@@ -138,6 +148,7 @@ class="transition duration-300 hover:scale-110 lg:hidden"
138148 ' opacity-80' => ! request ()-> routeIs (' consulting*'
139149 ' font-semibold' => request ()-> routeIs (' consulting*'
140150 ] )
151+ @if (request ()-> routeIs (' consulting*' aria-current =" page" @endif
141152 >
142153 <div
143154 x-ref =" navItem"
@@ -154,6 +165,7 @@ class="transition duration-300 hover:scale-110 lg:hidden"
154165 <a
155166 href =" https://shop.filamentphp.com"
156167 class =" group relative hidden text-evening opacity-80 transition duration-300 hover:opacity-100 motion-reduce:transition-none lg:block"
168+ aria-label =" Filament Shop"
157169 >
158170 <div
159171 x-ref =" navItem"
@@ -169,19 +181,26 @@ class="group relative hidden text-evening opacity-80 transition duration-300 hov
169181 <a
170182 href =" https://github.com/filamentphp/filament"
171183 target =" _blank"
184+ rel =" noopener noreferrer"
172185 class =" peer text-evening opacity-80 transition delay-75 duration-300 group-hover/github:opacity-100 motion-reduce:transition-none"
186+ aria-label =" Filament GitHub repository"
173187 >
174188 <div
175189 x-ref =" navItem"
176190 :class =" {'opacity-0': !reducedMotion}"
177191 >
178- <x-icons .github class =" size-6"
192+ <x-icons .github
193+ class =" size-6"
194+ aria-hidden =" true"
195+ />
196+ <span class =" sr-only" span >
179197 </div >
180198 </a >
181199
182200 {{-- Star Count --}}
183201 <div
184202 class =" invisible absolute right-1/2 top-6 -translate-y-2 translate-x-1/3 p-3 opacity-0 transition delay-75 duration-300 hover:visible hover:translate-y-0 hover:opacity-100 peer-hover:visible peer-hover:translate-y-0 peer-hover:opacity-100 motion-reduce:transition-none min-[1400px]:translate-x-1/2"
203+ aria-hidden =" true"
185204 >
186205 <div
187206 class =" flex items-center justify-center gap-2 whitespace-nowrap rounded-xl bg-black/5 py-3 pl-3 pr-4 backdrop-blur-md"
@@ -190,6 +209,7 @@ class="flex items-center justify-center gap-2 whitespace-nowrap rounded-xl bg-bl
190209 xmlns =" http://www.w3.org/2000/svg"
191210 class =" -mt-0.5 size-5 text-butter"
192211 viewBox =" 0 0 24 24"
212+ aria-hidden =" true"
193213 >
194214 <path
195215 fill =" currentColor"
0 commit comments