add bypass link to the main block - Issue #1779

src/App.vue

@@ -1,7 +1,13 @@
 <template>
   <div id="mobilizon">
-    <!-- <VueAnnouncer />
+    <!-- <VueAnnouncer /> -->
-    <VueSkipTo to="#main" :label="t('Skip to main content')" /> -->
+    <a
+      class="peer sr-only left-1/2 top-6 z-[101] !inline-flex -translate-x-1/2 focus-visible:not-sr-only focus-visible:absolute focus-visible:!outline-none"
+      href="#main"
+    >
+      <span class="block px-3 py-2">{{ t("Skip to main content") }}</span>
+    </a>
+
     <NavBar />
     <div v-if="isDemoMode">
       <o-notification

src/i18n/en_US.json

@@ -306,6 +306,7 @@
   "Show the time when the event begins": "Show the time when the event begins",
   "Show the time when the event ends": "Show the time when the event ends",
   "Sign up": "Sign up",
+  "Skip to main content": "Skip to main content",
   "Starts on…": "Starts on…",
   "Status": "Status",
   "Street": "Street",
@@ -1208,7 +1209,6 @@
   "Resent confirmation email": "Resent confirmation email",
   "Send password reset": "Send password reset",
   "Email validate": "Email validate",
-  "Skip to main content": "Skip to main content",
   "{timezoneLongName} ({timezoneShortName})": "{timezoneLongName} ({timezoneShortName})",
   "Back to top": "Back to top",
   "Powered by Mobilizon": "Powered by Mobilizon",