Add shell accessibility landmarks

2026-03-21 13:20:25 +01:00
parent 15a2b0825a
commit 8b34851010
3 changed files with 27 additions and 5 deletions
--- a/src/RolemasterDb.App/Components/Shell/AppShell.razor.css
+++ b/src/RolemasterDb.App/Components/Shell/AppShell.razor.css
@@ -4,6 +4,24 @@
    flex-direction: column;
 }

+.skip-link {
+    position: absolute;
+    left: 1rem;
+    top: -3rem;
+    z-index: 80;
+    padding: 0.75rem 1rem;
+    border-radius: 999px;
+    background: var(--accent-5);
+    color: var(--text-on-accent);
+    text-decoration: none;
+    box-shadow: var(--shadow-1);
+    transition: top 140ms ease;
+}
+
+.skip-link:focus {
+    top: 1rem;
+}
+
 .app-shell-header {
    position: sticky;
    top: 0;