feat(frontend): scaffold Vue 3 + Vuetify landing page

2026-10-03 18:30:47 +02:00
parent f26ad1744e
commit 3a45267ad8
21 changed files with 1862 additions and 0 deletions
@@ -0,0 +1,106 @@
+.v-theme--light {
+  --a11y-focus: #0b3d91;
+}
+.v-theme--dark {
+  --a11y-focus: #ffd54f;
+}
+.v-theme--highContrast {
+  --a11y-focus: #ffff00;
+}
+
+html {
+  font-size: 112.5%;
+}
+
+body {
+  line-height: 1.6;
+}
+
+:where(a, button, input, select, textarea, summary, [tabindex], .v-btn, .v-field, .v-list-item,
+    .v-tab, .v-chip--link, .v-selection-control__input):focus-visible {
+  outline: 3px solid var(--a11y-focus) !important;
+  outline-offset: 2px;
+}
+.v-field:focus-within {
+  outline: 3px solid var(--a11y-focus);
+  outline-offset: 2px;
+}
+.v-btn:focus-visible .v-btn__overlay {
+  opacity: 0.12;
+}
+
+.v-btn:not(.v-btn--icon):not(.v-btn--size-x-small) {
+  min-height: 44px;
+}
+.v-btn--icon {
+  min-width: 44px;
+  min-height: 44px;
+}
+.v-selection-control {
+  min-height: 44px;
+}
+.v-list-item {
+  min-height: 48px;
+}
+
+.prose a,
+p a,
+li a {
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+
+.skip-link {
+  position: absolute;
+  left: 8px;
+  top: -100px;
+  z-index: 10000;
+  padding: 12px 16px;
+  background: #000;
+  color: #fff;
+  font-weight: 700;
+  border-radius: 4px;
+}
+.skip-link:focus {
+  top: 8px;
+}
+
+.sr-only {
+  position: absolute !important;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}
+
+@media (forced-colors: active) {
+  .v-btn,
+  .v-card,
+  .v-field__outline,
+  .v-chip,
+  .v-alert {
+    border: 1px solid CanvasText;
+  }
+  .v-btn:focus-visible,
+  .v-field:focus-within {
+    outline: 3px solid Highlight !important;
+  }
+  .v-selection-control__input {
+    forced-color-adjust: auto;
+  }
+}