fix: layout

fractaldotbox · Sep 25, 2024 · a75d18f · a75d18f
1 parent 0d0a194
commit a75d18f
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 9 deletions.
diff --git a/page-container/index-page/CaseStudies.tsx b/page-container/index-page/CaseStudies.tsx
@@ -64,11 +64,11 @@ const CaseStudies = ({ className }: Partial<{ className: string }>) => {
   return (
     <Grid id="case-studies" container component="article" className={className}>
       <Grid item xs={12}>
-        <Typography variant="h2" color="textSecondary">
+        <Typography className="mb-3" variant="h2" color="textSecondary">
           Case Studies
         </Typography>
       </Grid>
-      <Grid item className={classes.articleCardList}>
+      <Grid item className="text-center items-center justify-center">
         <ArticleCardList articleCards={articleCards} />
       </Grid>
       <Grid item container justify="center">

diff --git a/page-container/index-page/ClientCompanies.tsx b/page-container/index-page/ClientCompanies.tsx
@@ -3,7 +3,7 @@ import { LogoList } from 'fractal-shared/components';
 
 const content = {
   title: (
-    <h2 className="text-4xl font-bold p-4 m-4 text-center">
+    <h2 className="text-4xl mt-4 font-bold p-4 m-4 text-center">
       Companies we work with
     </h2>
 
@@ -42,7 +42,7 @@ const ClientCompanies = ({ className }: Partial<{ className: string }>) => {
   const { title, brands } = content;
   const classes = useStyle();
   return (
-    <Box component="article" className={className}>
+    <Box component="article">
       <LogoList
         className={classes.listRoot}
         title={title}

diff --git a/page-container/index-page/IndexPageContainer.tsx b/page-container/index-page/IndexPageContainer.tsx
@@ -134,7 +134,6 @@ const IndexPageContainer = () => {
           <Header isIndexPage />
           <HeroContent className={classes.heroContent} />
           <OurCompany className={classes.ourCompany} />
-
           <ClientCompanies className={classes.clientCompanies} />
           {/* <SoftwareDelivery className={classes.softwareDelivery} /> */}
         </Grid>

diff --git a/page-container/index-page/OurCompany.tsx b/page-container/index-page/OurCompany.tsx
@@ -24,7 +24,7 @@ const OurCompany = ({ className }: Partial<{ className: string }>) => {
   const classes = useStyles();
 
   return (
-    <Grid container direction="column" component="article" className={className} id="our-company">
+    <Grid container direction="column" component="article" className={className + " mb-10"} id="our-company">
 
       <Typography component="h3" variant="h2" color="primary">
         The Fractal Labs
@@ -35,15 +35,16 @@ const OurCompany = ({ className }: Partial<{ className: string }>) => {
         Why employ Tech Lead as a service to grow together instead of just outsourcing?
       </Typography>
       <Grid item className={classes.imageContainer}>
-        <img style={{ borderRadius: "99999px", height: "360px", width: "360px" }} src="/logo_fractal_labs.png" width="360" height="360" alt="our company introduction logo" />
-
+        <div className="avatar w-48">
+          <img className="rounded-full" src="/logo_fractal_labs.png" alt="our company introduction logo" />
+        </div>
       </Grid>
 
       <Grid item className={classes.imageContainer}>
 
       </Grid>
 
-      <Grid item className={classes.textContainer}>
+      <Grid item className="w-full">
         <Typography variant="body1" color="secondary">
           We are a team of ex-startup founders & tech-leads, who understand both the power of technology and trade-offs to make in fast paced startups or
           innovative projects.