♻️ Bedre visning av bilder i nyhet-modal

navikt · Dec 21, 2024 · 0b7894b · 0b7894b
1 parent 72f57fb
commit 0b7894b
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 8 deletions.
diff --git a/src/components/header/nyheter/NyhetModal.module.scss b/src/components/header/nyheter/NyhetModal.module.scss
@@ -5,8 +5,19 @@
   min-height: 10rem;
 }
 
+.bildecontainer {
+  width: 100%;
+  max-height: 350px;
+  display: flex;
+  justify-content: center;
+
+}
+
 .bilde {
   object-fit: contain;
+  width: auto !important;
+  position: relative !important;
+  height: unset !important;
 }
 
 .step {

diff --git a/src/components/header/nyheter/NyhetModal.tsx b/src/components/header/nyheter/NyhetModal.tsx
@@ -38,14 +38,15 @@ export const NyhetModal = ({ onClose, showModal, nyhetModal }: NyhetModalProps):
                     <PortableText value={slides[slideIndex]?.slideBeskrivelse} components={components} />
                 )}
                 {slides[slideIndex]?.bildeUrl && (
-                    <Image
-                        className={styles.bilde}
-                        src={slides[slideIndex]?.bildeUrl}
-                        alt={slides[slideIndex]?.altTekst}
-                        height={400}
-                        width={730}
-                        unoptimized
-                    />
+                    <div className={styles.bildecontainer}>
+                        <Image
+                            className={styles.bilde}
+                            src={slides[slideIndex]?.bildeUrl}
+                            alt={slides[slideIndex]?.altTekst}
+                            fill
+                            unoptimized
+                        />
+                    </div>
                 )}
             </Modal.Body>
             {slides.length > 1 && (