Simplify the footer and remove the astronanut component.

Author: HaudinFlorence

src/components/footer/Footer.tsx

@@ -9,50 +9,10 @@ export default function Footer() {
   return (
     <div className={"container" + " " + styles.footer_container}>
       <div className={"row"} style={{ paddingBottom: "var(--ifm-spacing-xl)" }}>
-        <div className="col col--4" style={{display:"flex", alignItems:"center"}}>
-          <div className={styles.astronaut_container}>
-            <div>
-              <Link href={"/home"}>
-                <AstronautPicture width={"140px"} height={"140px"} />
-              </Link>
-            </div>
-          </div>
-        </div>
-        <div
-          className={
-            "col col--4 flex-full-centred" + " " + styles.menu_container
-          }
-        >
-          <b>Menu</b> <br />
-          <ul>
-            <li>
-              <Link href={"/home"}>Home</Link>
-            </li>
-            <li>
-              <Link href={"/projects"}>Projects</Link>
-            </li>
-            <li>
-              <Link href={"/about"}>About us</Link>
-            </li>
-            <li>
-              <Link href={"/services"}>Services</Link>
-            </li>
-            <li>
-              <Link href={"/careers"}>Careers</Link>
-            </li>
-            <li>
-              <Link href={"/blog"}>Blog</Link>
-            </li>
-            <li>
-              <Link href={"/contact"}>Contact us</Link>
-            </li>
-          </ul>
-        </div>
-
         <div className="col col--4 flex-full-centered">
           <div className={styles.social_media_links}>
             <b>Follow us on</b> <br />
-            <div >
+            <div className="flex-full-centered">
               <Link href={"https://github.com/QuantStack"}>
                 {<GHPicture />}
               </Link>
@@ -65,15 +25,55 @@ export default function Footer() {
                 {<XPicture />}
               </Link>
             </div>
-            <div className={styles.office_address}>
-              <b>QuantStack office</b> <br />
-              16, avenue Curti <br />
-              94100 Saint-Maur-des-Fossés <br />
-              France
+          </div>
+        </div>
+        <div className={"col col--4"}>
+          <div className={"container" + " " + styles.menu_container}>
+            <div style={{ textAlign: "center" }}>
+              <b>Menu</b> <br />
+            </div>
+            <div className="row">
+              <div className="col">
+                <ul>
+                  <li>
+                    <Link href={"/home"}>Home</Link>
+                  </li>
+
+                  <li>
+                    <Link href={"/projects"}>Projects</Link>
+                  </li>
+                  <li>
+                    <Link href={"/about"}>About us</Link>
+                  </li>
+                </ul>
+              </div>
+              <div className="col">
+                <ul>
+                  <li>
+                    <Link href={"/services"}>Services</Link>
+                  </li>
+                  <li>
+                    <Link href={"/careers"}>Careers</Link>
+                  </li>
+                  <li>
+                    <Link href={"/blog"}>Blog</Link>
+                  </li>
+                </ul>
+              </div>
             </div>
           </div>
         </div>
+
+        <div className="col col--4 flex-full-centered">
+          <div className={styles.office_address}>
+            <b>QuantStack office</b> <br />
+            16, avenue Curti <br />
+            94100 Saint-Maur-des-Fossés <br />
+            France
+          </div>
+        </div>
       </div>
+
       <div className={"row flex-full-centered"}>
         <div className={styles.copyright_container}>
           Copyright © 2024 · QuantStack website · Built with Docusaurus

src/components/footer/styles.module.css

@@ -4,27 +4,19 @@
 }
 
 .copyright_container {
-    text-align: center;
+  text-align: center;
+  padding-bottom: var(--ifm-spacing-lg);
 }
 
 @media only screen and (max-width: 996px) {
   /*Mobile*/
-  .astronaut_container {
-    display: none;
-  }
   .menu_container {
     display: none;
   }
 }
 
 @media only screen and (min-width: 996px) {
   /*Desktop*/
-  .astronaut-container {
-    padding: 100px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
   .social_media_links {
     padding-bottom: var(--ifm-spacing-xl);
   }