WCAG fixes

2026-02-16 12:57:11 -03:00
parent 93bbfee7f7
commit 7b63c0c922
2 changed files with 22 additions and 1 deletions
--- a/src/assets/css/style.css
+++ b/src/assets/css/style.css
@@ -1,3 +1,23 @@
+.skip-link {
+    position: absolute;
+    top: -100%;
+    left: 0;
+    z-index: 100;
+    padding: 0.75rem 1.25rem;
+    background: #70ffd7;
+    color: #1b1e22;
+    font-weight: 700;
+    text-decoration: none;
+    border-radius: 0 0 0.25rem;
+    transition: top 0.2s;
+}
+
+.skip-link:focus {
+    top: 0;
+    outline: 2px solid #70ffd7;
+    outline-offset: 2px;
+}
+
 html,
 body {
    height: 100%;
--- a/src/index.html
+++ b/src/index.html
@@ -59,7 +59,8 @@
        </script>
    </head>
    <body>
-        <main class="container">
+        <a href="#main-content" class="skip-link">Skip to main content</a>
+        <main id="main-content" class="container" tabindex="-1">
            <div class="emoji">🛸</div>
            <h1>Nothing to See Here</h1>
            <p>