💄(frontend) change gouvernement logo

Change the gourvernement logo.

src/frontend/apps/impress/src/components/LogoGouv.tsx

@@ -0,0 +1,42 @@
+import Image from 'next/image';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { default as IconDevise } from '@/assets/icons/icon-devise.svg?url';
+import { default as IconMarianne } from '@/assets/icons/icon-marianne.svg?url';
+
+import { Box } from './Box';
+import { Text, TextType } from './Text';
+
+interface LogoGouvProps {
+  imagesWidth?: number;
+  textProps?: TextType;
+}
+
+const LogoGouv = ({ imagesWidth, textProps }: LogoGouvProps) => {
+  const { t } = useTranslation();
+
+  return (
+    <Box>
+      <Box>
+        <Image
+          priority
+          src={IconMarianne}
+          alt={t('Marianne Logo')}
+          width={imagesWidth}
+        />
+      </Box>
+      <Text $weight="bold" $size="1.3rem" {...textProps}>
+        Gouvernement
+      </Text>
+      <Image
+        width={imagesWidth}
+        priority
+        src={IconDevise}
+        alt={t('Freedom Equality Fraternity Logo')}
+      />
+    </Box>
+  );
+};
+
+export default LogoGouv;

src/frontend/apps/impress/src/features/footer/Footer.tsx

@@ -1,11 +1,9 @@
-import Image from 'next/image';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import styled from 'styled-components';
 
-import { default as IconGouv } from '@/assets/icons/icon-gouv.svg?url';
-import { default as IconMarianne } from '@/assets/icons/icon-marianne.svg?url';
 import { Box, StyledLink, Text } from '@/components/';
+import LogoGouv from '@/components/LogoGouv';
 
 import IconLink from './assets/external-link.svg';
 
@@ -24,14 +22,6 @@ export const Footer = () => {
     <Box $position="relative" as="footer">
       <BlueStripe />
       <Box $padding={{ top: 'large', horizontal: 'big', bottom: 'small' }}>
-        <Box>
-          <Image
-            priority
-            src={IconMarianne}
-            alt={t('Marianne Logo')}
-            width={70}
-          />
-        </Box>
         <Box
           $direction="row"
           $gap="1.5rem"
@@ -41,11 +31,11 @@ export const Footer = () => {
         >
           <Box>
             <Box $align="center" $gap="6rem" $direction="row">
-              <Image
-                width={100}
-                priority
-                src={IconGouv}
-                alt={t('Freedom Equality Fraternity Logo')}
+              <LogoGouv
+                textProps={{
+                  $size: '1.3rem',
+                }}
+                imagesWidth={70}
               />
             </Box>
           </Box>

src/frontend/apps/impress/src/features/header/Header.tsx

@@ -3,9 +3,8 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 import styled from 'styled-components';
 
-import { default as IconGouv } from '@/assets/icons/icon-gouv.svg?url';
-import { default as IconMarianne } from '@/assets/icons/icon-marianne.svg?url';
 import { Box, StyledLink, Text } from '@/components/';
+import LogoGouv from '@/components/LogoGouv';
 
 import { LanguagePicker } from '../language/';
 
@@ -36,20 +35,19 @@ export const Header = () => {
       $css="box-shadow: 0 1px 4px #00000040;"
     >
       <RedStripe />
-      <Box $margin={{ horizontal: 'xbig' }}>
-        <Image priority src={IconMarianne} alt={t('Marianne Logo')} />
-      </Box>
       <Box
         $margin={{ horizontal: 'xbig' }}
         $align="center"
         $justify="space-between"
         $direction="row"
       >
-        <Box $align="center" $gap="6rem" $direction="row">
-          <Image
-            priority
-            src={IconGouv}
-            alt={t('Freedom Equality Fraternity Logo')}
+        <Box $gap="6rem" $direction="row">
+          <LogoGouv
+            textProps={{
+              $size: 't',
+              $css: 'line-height:10px',
+              $margin: { vertical: '3px' },
+            }}
           />
           <StyledLink href="/">
             <Box $align="center" $gap="1rem" $direction="row">