fix(fiche service public): fix image width on mobile

SocialGouv · Jul 10, 2023 · 98bca41 · 98bca41
1 parent c8a5eaf
commit 98bca41
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/Image.tsx b/packages/code-du-travail-frontend/src/fiche-service-public/components/Image.tsx
@@ -37,15 +37,15 @@ function ImageComponent({ data }: ImageProps) {
 
   return (
     <>
-      <figure role="group" aria-label={legendText}>
+      <Figure role="group" aria-label={legendText}>
         <img
           src={`https://www.service-public.fr/webapp/images/vdd/extralarge/${name}`}
           alt={legendText}
         />
         <Figcaption>
           {creditText && <span>Crédits : {creditText}</span>}
         </Figcaption>
-      </figure>
+      </Figure>
       {texteDeRemplacement && (
         <MoreContent noLeftPadding title="Voir en détail">
           <Wrapper variant="dark">{texteDeRemplacement}</Wrapper>
@@ -57,6 +57,12 @@ function ImageComponent({ data }: ImageProps) {
 
 export const Image = memo(ImageComponent) as typeof ImageComponent;
 
+const Figure = styled.figure`
+  img {
+    max-width: 100%;
+  }
+`;
+
 const Figcaption = styled.figcaption`
   display: flex;
   justify-content: flex-end;