From f68b5a1b013ea74dbd49e8045d243d0a3e3eeb70 Mon Sep 17 00:00:00 2001
From: Ane <ane-ness@hotmail.no>
Date: Fri, 13 Dec 2024 09:15:20 +0100
Subject: [PATCH 1/2] remove div

---
 .../imageSection/ImageSectionComponent.tsx         |  4 ++--
 .../imageSection/imageSectionComponent.module.css  | 14 +++++++-------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/sections/imageSection/ImageSectionComponent.tsx b/src/components/sections/imageSection/ImageSectionComponent.tsx
index 6cda21ed9..08ff3bdb3 100644
--- a/src/components/sections/imageSection/ImageSectionComponent.tsx
+++ b/src/components/sections/imageSection/ImageSectionComponent.tsx
@@ -6,13 +6,13 @@ import styles from "./imageSectionComponent.module.css";
 
 const ImageSectionComponent = ({ section }: { section: ImageSection }) => {
   return (
-    <article className={styles.article}>
+    <div className={styles.article}>
       {section.image && (
         <div className={styles.image}>
           <SanityImage image={section.image} />
         </div>
       )}
-    </article>
+    </div>
   );
 };
 
diff --git a/src/components/sections/imageSection/imageSectionComponent.module.css b/src/components/sections/imageSection/imageSectionComponent.module.css
index 86dfd689c..f1e0a57f6 100644
--- a/src/components/sections/imageSection/imageSectionComponent.module.css
+++ b/src/components/sections/imageSection/imageSectionComponent.module.css
@@ -1,14 +1,14 @@
 .article {
   width: 100%;
-  max-width: var(--max-content-width-medium);
   display: flex;
-  flex-direction: column;
-  justify-self: center;
+  justify-content: center;
 }
 
 .image {
+  display: flex;
   flex-shrink: 1;
-  max-width: 46rem;
+  max-width: var(--max-content-width-large);
+  width: 100%;
   padding: var(--padding-l) 0rem;
 
   @media (max-width: 834px) {
@@ -23,16 +23,16 @@
 }
 
 .image img {
-  max-width: var(--max-content-width-large);
+  max-width: var(--max-content-width-medium) !important;
   width: 100%;
   height: 100%;
   display: block;
 
   @media (max-width: 834px) {
-    max-width: var(--max-content-width-medium);
+    max-width: var(--max-content-width-medium) !important;
   }
 
   @media (max-width: 425px) {
-    max-width: var(--max-content-width-small);
+    max-width: var(--max-content-width-small) !important;
   }
 }

From b6751d0ca70e58a20508079f750469cfe0f2a2e4 Mon Sep 17 00:00:00 2001
From: Ane <ane-ness@hotmail.no>
Date: Fri, 13 Dec 2024 10:31:14 +0100
Subject: [PATCH 2/2] fix featured cases hover and link

---
 messages/en.json                              |  3 +++
 messages/no.json                              |  3 +++
 messages/se.json                              |  3 +++
 .../featuredCases/FeaturedCases.tsx           | 25 +++++++++++--------
 .../featuredCases/featuredCases.module.css    | 10 +++++++-
 5 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/messages/en.json b/messages/en.json
index e6aff85e7..869bef251 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -22,6 +22,9 @@
       "image": "image",
       "case": "Case",
       "field": "Field"
+    },
+    "featured_cases": {
+      "projects": "Featured Projects"
     }
   },
   "contact_information": {
diff --git a/messages/no.json b/messages/no.json
index 6bf2433ec..eb45d6cb6 100644
--- a/messages/no.json
+++ b/messages/no.json
@@ -22,6 +22,9 @@
       "image": "bilde",
       "case": "Case",
       "field": "Fag"
+    },
+    "featured_cases": {
+      "projects": "Lignende prosjekter"
     }
   },
   "contact_information": {
diff --git a/messages/se.json b/messages/se.json
index 0172c8005..d784bbc9a 100644
--- a/messages/se.json
+++ b/messages/se.json
@@ -22,6 +22,9 @@
       "image": "bild",
       "case": "Case",
       "field": "Fält"
+    },
+    "featured_cases": {
+      "projects": "Liknande Projekt"
     }
   },
   "contact_information": {
diff --git a/src/components/customerCases/customerCase/featuredCases/FeaturedCases.tsx b/src/components/customerCases/customerCase/featuredCases/FeaturedCases.tsx
index e1996305e..6b3113fb4 100644
--- a/src/components/customerCases/customerCase/featuredCases/FeaturedCases.tsx
+++ b/src/components/customerCases/customerCase/featuredCases/FeaturedCases.tsx
@@ -1,4 +1,5 @@
 import Link from "next/link";
+import { useTranslations } from "next-intl";
 
 import { SanitySharedImage } from "src/components/image/SanityImage";
 import Text from "src/components/text/Text";
@@ -15,24 +16,26 @@ export default function FeaturedCases({
   featuredCases,
   customerCasesPath,
 }: FeaturedCasesProps) {
+  const t = useTranslations("customer_case");
+
   return (
     featuredCases.length > 0 && (
       <div className={styles.wrapper}>
-        <Text type={"h3"}>Lignende prosjekter</Text>
+        <Text type={"h3"}>{t("featured_cases.projects")}</Text>
         <div className={styles.content}>
           {featuredCases.map((featuredCase) => (
             <div key={featuredCase._id} className={styles.caseWrapper}>
-              <div className={styles.caseImageWrapper}>
-                <SanitySharedImage image={featuredCase.image} />
-              </div>
-              <div>
-                <Link
-                  href={`/${[...customerCasesPath, featuredCase.slug].join("/")}`}
-                >
+              <Link
+                href={`/${[...customerCasesPath, featuredCase.slug].join("/")}`}
+              >
+                <div className={styles.caseImageWrapper}>
+                  <SanitySharedImage image={featuredCase.image} />
+                </div>
+                <div>
                   <Text type={"bodyBig"}>{featuredCase.basicTitle}</Text>
-                </Link>
-                <Text type={"bodySmall"}>{featuredCase.description}</Text>
-              </div>
+                  <Text type={"bodySmall"}>{featuredCase.description}</Text>
+                </div>
+              </Link>
             </div>
           ))}
         </div>
diff --git a/src/components/customerCases/customerCase/featuredCases/featuredCases.module.css b/src/components/customerCases/customerCase/featuredCases/featuredCases.module.css
index 15f0c866c..0b7153f0b 100644
--- a/src/components/customerCases/customerCase/featuredCases/featuredCases.module.css
+++ b/src/components/customerCases/customerCase/featuredCases/featuredCases.module.css
@@ -27,6 +27,14 @@
 }
 
 .caseImageWrapper img {
-  border-radius: 0.75rem;
+  border-radius: 1.5rem;
+  transition: all 0.3s ease;
   width: 100% !important;
+  &:hover {
+    border-radius: 0.375rem;
+  }
+}
+
+.content:hover img {
+  border-radius: 0.375rem;
 }