♿️(frontend) improve pagination control accessibility

Turn main-window pagination into a labelled nav landmark with a live
page counter for screen readers. Add pagination.label in all locales.

src/frontend/src/features/layout/components/PaginationControl.tsx

@@ -44,7 +44,8 @@ export function PaginationControl({
   if (totalPageCount <= 1) return null
 
   return (
-    <div
+    <nav
+      aria-label={t('label')}
       className={css({
         position: 'absolute',
         bottom: '1rem',
@@ -74,7 +75,7 @@ export function PaginationControl({
         <RiArrowLeftSLine />
       </Button>
       <span
-        aria-live="polite"
+        role="status"
         className={css({
           padding: '0.25rem 0.5rem',
         })}
@@ -93,6 +94,6 @@ export function PaginationControl({
       >
         <RiArrowRightSLine />
       </Button>
-    </div>
+    </nav>
   )
 }

src/frontend/src/locales/de/rooms.json

@@ -97,6 +97,7 @@
     }
   },
   "pagination": {
+    "label": "Teilnehmerseiten",
     "count": "{{currentPage}} von {{totalPageCount}}",
     "next": "nächste Seite",
     "previous": "vorherige Seite"

src/frontend/src/locales/en/rooms.json

@@ -97,6 +97,7 @@
     }
   },
   "pagination": {
+    "label": "Participants pages",
     "count": "{{currentPage}} of {{totalPageCount}}",
     "next": "next page",
     "previous": "previous page"

src/frontend/src/locales/fr/rooms.json

@@ -97,6 +97,7 @@
     }
   },
   "pagination": {
+    "label": "Pages des participants",
     "count": "{{currentPage}} sur {{totalPageCount}}",
     "next": "page suivante",
     "previous": "page précédente"

src/frontend/src/locales/nl/rooms.json

@@ -97,6 +97,7 @@
     }
   },
   "pagination": {
+    "label": "Pagina's van deelnemers",
     "count": "{{currentPage}} van {{totalPageCount}}",
     "next": "volgende pagina",
     "previous": "vorige pagina"