add .github/copilot-instructions.md file

https://docs.github.com/en/copilot/customizing-copilot/adding-repository-custom-instructions-for-github-copilot

components/layout/skip-nav.tsx

@@ -1,14 +1,16 @@
+import Button from "@/components/ui/button";
+
 const SKIP_NAV_ID = "skip-nav";
 
 export const SkipNavLink = () => {
   return (
-    <a
-      href={`#${SKIP_NAV_ID}`}
-      tabIndex={0}
-      className="text-primary bg-muted focus:border-ring sr-only z-[1000] underline focus:not-sr-only focus:fixed focus:top-2.5 focus:left-2.5 focus:border-2 focus:border-solid focus:p-4"
+    <Button
+      asChild
+      className="sr-only transition-none focus:not-sr-only focus:absolute focus:top-4 focus:left-4 focus:z-100 focus:inline-flex focus:px-4 focus:py-2"
+      variant="default"
     >
-      Skip to content
-    </a>
+      <a href={`#${SKIP_NAV_ID}`}>Skip to content</a>
+    </Button>
   );
 };
 

components/layout/theme-toggle.tsx

@@ -12,11 +12,12 @@ const ThemeToggle = ({ ...rest }: ComponentPropsWithoutRef<LucideIcon>) => {
   return (
     <button
       onClick={() => setTheme(theme === "light" ? "dark" : "light")}
-      aria-label="Toggle Theme"
+      aria-label="Toggle theme"
       className="hover:*:stroke-warning block bg-transparent p-2.5 hover:cursor-pointer not-dark:[&_.lucide-moon]:hidden dark:[&_.lucide-sun]:hidden"
     >
-      <SunIcon aria-label="Light Mode" {...rest} />
-      <MoonIcon aria-label="Dark Mode" {...rest} />
+      <SunIcon {...rest} />
+      <MoonIcon {...rest} />
+      <span className="sr-only">Toggle theme</span>
     </button>
   );
 };

components/video.tsx

@@ -15,16 +15,18 @@ const Video = ({
       {...(typeof src === "string" ? { src } : {})}
       {...(autoPlay
         ? {
+            autoPlay: true,
             preload: "auto",
             controls: false,
-            autoPlay: true,
             playsInline: true, // safari autoplay workaround
             loop: true,
             muted: true,
           }
         : {
+            autoPlay: false,
             preload: "metadata",
             controls: true,
+            playsInline: true,
           })}
       crossOrigin="anonymous"
       className={cn("mx-auto block h-auto max-h-[500px] w-full", className)}