Clearer focus ring for all elements

frontend/src/app/[id]/page.module.scss

@@ -52,6 +52,11 @@
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
   cursor: pointer;
+
+  &:focus-visible {
+    outline: var(--focus-ring);
+    outline-offset: 2px;
+  }
 }
 
 .tabSelected {

frontend/src/app/[id]/page.tsx

@@ -20,7 +20,6 @@ export const generateMetadata = async ({ params }: PageProps): Promise<Metadata>
   const event = await getEvent(params.id).catch(() => undefined)
   const { t } = await useTranslation('event')
 
-  // TODO: More metadata
   return {
     title: event?.name ?? t('error.title'),
   }

frontend/src/app/global.css

@@ -89,6 +89,7 @@ body {
   background: var(--background);
   color: var(--text);
   font-weight: var(--font-weight);
+  --focus-ring: 2px solid var(--secondary);
 }
 
 .light {
@@ -131,6 +132,11 @@ body {
 
 a {
   color: var(--primary);
+  border-radius: .2em;
+}
+a:focus-visible {
+  outline: var(--focus-ring);
+  outline-offset: 2px;
 }
 
 *::-webkit-scrollbar {