Keep on working on style and css classes. Add svg pictures for the mobile menu.

Author: HaudinFlorence

src/components/about/Avatar.tsx

@@ -11,7 +11,7 @@ export default function Avatar({ person }) {
           height={"160px"}
           alt={
             "Avatar of " +
-            person.CompleteName +
+            person.completeName +
             "working at QuantStack as a " +
             person.position
           }

src/components/about/FourValues.tsx

@@ -4,7 +4,7 @@ import { valuesDetails } from "./Values/valuesDetails";
 
 export default function FourValues() {
   return (
-    <div className={styles.four_values_container}>
+    <div className="upper-container-with-margin-top">
       <div className="row">
         <div className="col">
           <h1 className={"padding-none" + " " + "full-flex-centered"}>

src/components/about/LargePortraitCard.tsx

@@ -49,7 +49,7 @@ export default function LargePortraitCard({ person, avatarUrl, BioComponent }) {
                 className={styles.avatar}
                 alt={
                   "Avatar of " +
-                  person.CompleteName +
+                  person.completeName +
                   "working at QuantStack as a " +
                   person.position
                 }

src/components/about/SmallPortraitCard.tsx

@@ -56,7 +56,7 @@ export function SmallPortraitCard({ person, avatarUrl, setOffsets }) {
             height={"160px"}
             alt={
               "Avatar of " +
-              person.CompleteName +
+              person.completeName +
               "working at QuantStack as a " +
               person.position
             }

src/components/about/SubTeam.tsx

@@ -1,5 +1,4 @@
 import styles from "./styles.module.css";
-import Link from "@docusaurus/Link";
 import PopupPortrait from "./SmallPortraitCard";
 
 export default function SubTeam ({

src/components/about/index.tsx

@@ -14,12 +14,11 @@ import FourValues from "./FourValues";
 import SubTeam from "./SubTeam";
 import LinkToContact from "../home/LinkToContact";
 
-
 export function About() {
   return (
     <div>
       <div className="main-container-with-margins">
-        <div className={"container" + " " + styles.about_container}>
+        <div className="container upper-container-with-margin-top">
           <div className={"row"}>
             <div className={"col" + " " + "flex-full-centered"}>
               <FourValues />
@@ -59,24 +58,10 @@ export function About() {
           </div>
         </div>
       </div>
-      <div className={styles.join_the_team_container}>
-        <h1
-          className={
-            "text--center" +
-            " " +
-            "padding-none" +
-            " " +
-            "h1-margin-none" +
-            " " +
-            styles.join_the_team_title
-          }
-        >
-          Join the team
-        </h1>
-        <div className={styles.join_the_team_text}>
-          QuantStack is seeking talents in the open-source scientific computing
-          community. Join a team committed to open-science and free software.
-        </div>
+      <div className="blue-banner-container">
+        <div className="blue-banner-header">Join the team</div>
+        QuantStack is seeking talents in the open-source scientific computing
+        community. Join a team committed to open-science and free software.
         <LinkToContact label={"JOIN THE TEAM!"} />
       </div>
     </div>

src/components/about/styles.module.css

@@ -60,10 +60,6 @@ div .row {
   margin-right: 0;
 }
 
-.about_container {
-  margin-top: var(--ifm-spacing-6xl);
-}
-
 .value_card {
   height: 540px;
   width: 264px;

src/components/blog/styles.module.css

@@ -90,6 +90,4 @@ div .blogpost_date {
     var(--ifm-spacing-lg);
 }
 
-.blogposts_container {
-  margin: var(--ifm-spacing-6xl) 0;
-}
+

src/components/careers/Header.tsx

@@ -1,14 +0,0 @@
-import styles from "./styles.module.css";
-import GroupPhotoJupyterConUrl from "@site/static/img/group/group-photo.png";
-
-export default function Header() {
-    return (
-      <div className={styles.careers_header}>
-        <h1 className="text--center">Join the QuantStack team!</h1>
-        <div className={styles.group_photo_container + " " + "flex-full-centered"}>
-          <img src={GroupPhotoJupyterConUrl} alt={"Picture showing QuantStack people gathered at the Jupytercon in Paris in May 2023."}/>
-        </div>
-      </div>
-    );
-  }
-  

src/components/careers/InterviewPicture.tsx

@@ -9,7 +9,7 @@ export default function InterviewPicture({ person }) {
           src={person.pictureRoute}
           alt={
             "Picture of" +
-            person.CompleteName +
+            person.completeName +
             "working at QuantStack as a" +
             person.position
           }