Keyboard Navigation only on vissible elements

src/components/NavigationDropdown.tsx

@@ -71,12 +71,10 @@ export function NavigationDropdown() {
       >
         <Menu className="h-5 w-5" />
       </button>
+      {isOpen && (
         <div
           className={cn(
-          'absolute pointer-events-none left-0 top-full z-[999] mt-2 w-48 min-w-[320px] -translate-y-1 rounded-lg bg-slate-800 py-2 opacity-0 shadow-xl transition-all duration-100',
+            'pointer-events-auto absolute left-0 top-full z-[999] mt-2 w-48 min-w-[320px] translate-y-2.5 rounded-lg bg-slate-800 py-2 opacity-100 shadow-xl transition-all duration-100',
-          {
-            'pointer-events-auto translate-y-2.5 opacity-100': isOpen,
-          },
           )}
         >
           {links.map((link) => (
@@ -99,6 +97,7 @@ export function NavigationDropdown() {
             </a>
           ))}
         </div>
+      )}
     </div>
   );
 }