Fix some style issues.

Author: HaudinFlorence

docusaurus.config.ts

@@ -202,7 +202,7 @@ const config: Config = {
             {
               html: `
               
-               <div class="quantstack-address">
+               <div class="div .quantstack-address">
                       16, avenue Curti <br/>
                       94100 Saint-Maur-des-Fossés <br/>
                       France

src/components/about/styles.module.css

@@ -240,7 +240,7 @@
   }
 
   .four_values_container {
-    margin: var(--ifm-spacing-5xl) 0;
+    margin-bottom: var(--ifm-spacing-5xl);
   }
 
   .join_the_team_container {

src/components/blog/BlogpostCard.tsx

@@ -11,7 +11,7 @@ export default function BlogpostCard({ blogpost, timeIndex }) {
       className={"card " + styles.blogpost_card}
       style={{ marginBottom: "var(--ifm-spacing-lg)" }}
     >
-      <div className={styles.blog_time_index}>{timeIndex}</div>
+   
       <Link href={blogpost.url}>
         <div className="container">
           <div

src/components/blog/styles.module.css

@@ -8,20 +8,29 @@
   border-radius: 8px;
   box-shadow: 4px 4px 18px -1px #dee0fc;
   padding: var(--ifm-spacing-xl);
-  background:var(--ifm-background-color-card);
+  background: var(--ifm-background-color-card);
 }
 
 .blogpost_card:hover {
   border: 1px solid #cbc7b1;
 }
 
-.blog_time_index {
-  font-size: 10px;
-  font-family: var(--ifm-font-family-roboto);
+div .blogpost_header {
+  color: var(--ifm-text-color);
+}
+div .blogpost_summary {
+  color: var(--ifm-text-color);
+}
+
+div .blogpost_authors {
+  color: var(--ifm-text-color);
+}
+
+div .blogpost_date {
+  color: var(--ifm-text-color);
 }
 
 .blogpost_summary {
-  color: var(---ifm-text-color);
   font-family: var(--ifm-font-family-roboto);
   font-size: 14px;
   font-style: normal;
@@ -31,6 +40,7 @@
   text-align: justify;
   margin-bottom: var(--ifm-spacing-sm);
   height: 140px;
+  color: var(--ifm-text-color-card);
 }
 
 .blogpost_header {
@@ -43,6 +53,7 @@
   letter-spacing: -0.198px;
   height: 48px;
   margin: var(--ifm-spacing-xl) 0;
+  color: var(--ifm-text-color-card);
 }
 
 .blogpost_date {
@@ -54,6 +65,7 @@
   line-height: 16px;
   letter-spacing: -0.132px;
   text-align: left;
+  color: var(--ifm-text-color-card);
 }
 
 .blogpost_authors {
@@ -63,6 +75,7 @@
   font-weight: 400;
   line-height: 16px;
   text-align: left;
+  color: var(--ifm-text-color-card);
 }
 
 .search_input {
@@ -84,6 +97,6 @@
 @media only screen and (min-width: 996px) {
   /*Desktop */
   .blogposts_container {
-   margin: var(--ifm-spacing-6xl) 0;
+    margin: var(--ifm-spacing-6xl) 0;
   }
 }

src/components/careers/Header.tsx

@@ -5,7 +5,7 @@ export default function Header() {
     return (
       <div className={styles.careers_header}>
         <h1 className="text-centered">Join the QuantStack team!</h1>
-        <div className={styles.group_photo_container}>
+        <div className={styles.group_photo_container + " " + "flex-full-centered"}>
           <img src={GroupPhotoJupyterConUrl} />
         </div>
       </div>

src/components/careers/Interviews.tsx

@@ -6,7 +6,7 @@ export default function Interviews({ details, description }) {
     <div className={styles.subteam_component}>
       <h2 className={styles.h2_custom}>{description}</h2>
       <div className="container">
-        <ul className="row">
+        <ul className={"row" + " "+ "flex-full-centered"}>
           {details.map((person, index) => (
             <li className="cards-list" key={index}>
               <div className="col col--2">

src/components/careers/index.tsx

@@ -10,17 +10,25 @@ export default function Careers() {
     <div>
       <div className="main-container-with-margins">
         <div className={"container" + " " + styles.careers_container}>
-          <div className={"row" + " " + "padding-none"}>
-            <div className="col col--10 col--offset-1">
+          <div className={"row" + " " + "padding-none" + " "+ "flex-full-centered"}>
+            <div className="col">
               <Header />
             </div>
           </div>
-          <div className={"row" + " " + styles.join_the_team_container}>
+          <div
+            className={
+              "row" +
+              " " +
+              styles.join_the_team_container +
+              " " +
+              "flex-full-centered"
+            }
+          >
             <div className="col col--10 col--offset-1">
               <JoinTheTeam />
             </div>
-            <div className="row">
-              <div className="col col--10 col--offset-1">
+            <div className={"row" + " " + "flex-full-container"}>
+              <div className="col col--8 col--offset-2">
                 <div className={styles.interviews_container}>
                   <Interviews
                     details={interviewDetails}

src/components/careers/styles.module.css

@@ -104,8 +104,8 @@ div .learn_more_WTJ {
   }
 
   .interview_card {
-    width: 300px;
-    height: 340px;
+    width: 280px;
+    height: 300px;
     background-color: var(--ifm-background-color);
     border-radius: 10px;
     box-shadow: 0px 0px 8px 1px #c8c8c7;

src/components/home/ProjectsOverview/Jupyter.tsx

@@ -20,7 +20,7 @@ export default function JupyterProject() {
         <div
           className={"col col--5" + " " + "flex-full-centered"+" " +styles.col_project_overview_with_padding}
         >
-          <img src={JupyterPictureUrl} />
+          <img src={JupyterPictureUrl} width={"540px"} />
         </div>
       </div>
     </div>

src/components/home/ProjectsOverview/Robotics.tsx

@@ -15,7 +15,7 @@ export default function RoboticsProjects() {
             styles.col_project_overview_with_padding
           }
         >
-          <img src={RoboticsPictureUrl} />
+          <img src={RoboticsPictureUrl} width={"640px"}/>
         </div>
         <div className={"col col--5" + " " + styles.col_project_overview_with_padding}>
           <h1 className="padding-none">Robotics </h1>