fix(landing): address WCAG issues 4.1.2 and 1.1.1 (#1795)

entur · Jan 23, 2025 · 77e14fb · 77e14fb
1 parent 2683958
commit 77e14fb
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 3 deletions.
diff --git a/tavla/app/components/ImageCarousel/ImageCarousel.tsx b/tavla/app/components/ImageCarousel/ImageCarousel.tsx
@@ -5,9 +5,31 @@ import gymImage from 'assets/illustrations/Gym_illustration.svg'
 import libraryImage from 'assets/illustrations/Library_illustration.svg'
 import schoolImage from 'assets/illustrations/School_illustration.svg'
 import Image from 'next/image'
+import { StaticImport } from 'next/dist/shared/lib/get-img-props'
 
+type TImage = {
+    src: StaticImport | string
+    alt: string
+}
 function ImageCarousel() {
-    const images = [receptionImage, schoolImage, libraryImage, gymImage]
+    const images: TImage[] = [
+        {
+            src: receptionImage,
+            alt: 'En mor og hennes sønn står i en resepsjon, hvor det er en avgangstavle på veggen som viser viktig informasjon',
+        },
+        {
+            src: schoolImage,
+            alt: 'En jente henter bøker fra skapet sitt på skolen og ser på en avgangstavle på veggen.',
+        },
+        {
+            src: libraryImage,
+            alt: 'En mann ser på bøker på et bibliotek. Det er en avgangstavle på veggen',
+        },
+        {
+            src: gymImage,
+            alt: 'En kvinne løper på en tredemølle. En avgangstavle på veggen viser avganger.',
+        },
+    ]
     const [currentImageIndex, setCurrentImageIndex] = useState(0)
     const [fade, setFade] = useState(true)
 
@@ -31,8 +53,8 @@ function ImageCarousel() {
             }`}
         >
             <Image
-                src={images[currentImageIndex]}
-                alt="Et bilde av en avgangstavle"
+                src={images[currentImageIndex]!.src}
+                alt={images[currentImageIndex]!.alt}
             />
         </div>
     )

diff --git a/tavla/app/components/PreviewCarousel/index.tsx b/tavla/app/components/PreviewCarousel/index.tsx
@@ -29,6 +29,11 @@ const CarouselIndicators = ({
                     className={`md:w-5 md:h-5 w-6 h-6 rounded-full  bottom-5 ${
                         index === activeIndex ? 'bg-blue' : 'bg-tertiary'
                     }`}
+                    aria-label={
+                        index === activeIndex
+                            ? `Aktiv knapp for tavle ${index + 1}`
+                            : `Bytt til tavle ${index + 1}`
+                    }
                     onClick={() => onClick(index)}
                 />
             ))}