la suite numérique

DISIC · Jun 21, 2024 · 0272d76 · 0272d76
1 parent 1b651cf
commit 0272d76
Show file tree

Hide file tree

Showing 9 changed files with 55 additions and 27 deletions.
diff --git a/public/static/media/visuel_webconf.webp b/public/static/media/visuel_webconf.webp
diff --git a/src/assets/visuel_webconf.webp b/src/assets/visuel_webconf.webp
diff --git a/src/assets/webconf_img_40OP.png b/src/assets/webconf_img_40OP.png
diff --git a/src/components/footer/Footer.tsx b/src/components/footer/Footer.tsx
@@ -2,11 +2,13 @@ import { Footer, FooterProps } from '@codegouvfr/react-dsfr/Footer';
 
 interface props {
   headerFooterDisplayItem: FooterProps.BottomItem;
+  style: any;
 }
 
-function footer({ headerFooterDisplayItem }: props) {
+function footer({ headerFooterDisplayItem, style }: props) {
   return (
     <Footer
+      className={style}
       accessibility="fully compliant"
       brandTop={
         <>

diff --git a/src/components/layout/Layout.module.css b/src/components/layout/Layout.module.css
@@ -0,0 +1,7 @@
+/* .layout {
+  background-image: url(../../assets/visuel_webconf.webp);
+} */
+
+/* .footer {
+  background-color: white;
+} */
diff --git a/src/components/layout/Layout.tsx b/src/components/layout/Layout.tsx
@@ -20,11 +20,18 @@ interface headerProps {
 export default function Layout(propos: headerProps) {
   return (
     <div className={styles.layout}>
-      <Header {...propos} />
+      <header>
+        <Header {...propos} />
+      </header>
       <main>
         <Outlet />
       </main>
-      <Footer headerFooterDisplayItem={headerFooterDisplayItem} />
+      <footer className={styles.footer}>
+        <Footer
+          style="footer"
+          headerFooterDisplayItem={headerFooterDisplayItem}
+        />
+      </footer>
       <Display />
     </div>
   );

diff --git a/src/pages/home/Home.tsx b/src/pages/home/Home.tsx
@@ -20,28 +20,30 @@ interface AuthModalProps {
 function Home(props: AuthModalProps) {
   const [buttons, setButtons] = useState<boolean>(false);
   return (
-    <div
-      className={styles.home}
-      onClick={
-        ((event: MouseEvent) => {
-          const div = event.currentTarget;
-          const plusButton = div.querySelector('#plusButton');
-          const copyButton = div.querySelector('#copyButton');
-          const calendarButton = div.querySelector('#calendarButton');
-          const calendar = document.querySelector('#Calendar');
-          if (
-            event.target !== plusButton &&
-            event.target !== copyButton &&
-            event.target !== calendarButton &&
-            !calendar?.contains(event.target as any)
-          ) {
-            setButtons(false);
-          }
-        }) as MouseEventHandler<HTMLDivElement>
-      }
-    >
-      <HomeForm {...props} setButtons={setButtons} buttons={buttons} />
-      <HomeSlider />
+    <div className={styles.homeContainer}>
+      <div
+        className={styles.home}
+        onClick={
+          ((event: MouseEvent) => {
+            const div = event.currentTarget;
+            const plusButton = div.querySelector('#plusButton');
+            const copyButton = div.querySelector('#copyButton');
+            const calendarButton = div.querySelector('#calendarButton');
+            const calendar = document.querySelector('#Calendar');
+            if (
+              event.target !== plusButton &&
+              event.target !== copyButton &&
+              event.target !== calendarButton &&
+              !calendar?.contains(event.target as any)
+            ) {
+              setButtons(false);
+            }
+          }) as MouseEventHandler<HTMLDivElement>
+        }
+      >
+        <HomeForm {...props} setButtons={setButtons} buttons={buttons} />
+        <HomeSlider />
+      </div>
     </div>
   );
 }

diff --git a/src/pages/home/HomeForm.tsx b/src/pages/home/HomeForm.tsx
@@ -288,14 +288,14 @@ function HomeForm(props: AuthModalProps) {
         {props.participantNumber} participants.
       </Badge>
       <hr />
-      <Alert
+      {/* <Alert
         closable={false}
         description="Il est recommandé de ne pas dépasser 40 participants par conférence pour
         optimiser le confort de vos différents échanges."
         severity="info"
         small
         title=""
-      />
+      /> */}
       <br />
       <p>
         En savoir plus sur la <strong>WebConf</strong> de l'Etat

diff --git a/src/pages/home/HomeSlider.tsx b/src/pages/home/HomeSlider.tsx
@@ -1,4 +1,6 @@
 import { Fade } from 'react-slideshow-image';
+import { Alert } from '@codegouvfr/react-dsfr/Alert';
+
 import 'react-slideshow-image/dist/styles.css';
 import styles from './Home.module.css';
 
@@ -34,6 +36,14 @@ const HomeSlider = () => {
           ))}
         </Fade>
       </div>
+      <Alert
+        closable={false}
+        description="Il est recommandé de ne pas dépasser 40 participants par conférence pour
+        optimiser le confort de vos différents échanges."
+        severity="info"
+        small
+        title=""
+      />
     </div>
   );
 };