Merge remote-tracking branch 'origin/main' into epic-governance-page

safe-global · Oct 24, 2023 · 8fcb903 · 8fcb903
2 parents 58a8a78 + 5b806d8
commit 8fcb903
Show file tree

Hide file tree

Showing 37 changed files with 206 additions and 233 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "safe-homepage",
   "homepage": "https://github.com/safe-global/safe-homepage",
-  "version": "1.3.2",
+  "version": "1.3.3",
   "scripts": {
     "build": "next build && next export",
     "lint": "tsc && next lint",

diff --git a/public/images/IdentPlanets/label.svg b/public/images/IdentPlanets/label.svg
diff --git a/public/images/bug-bounty.png b/public/images/bug-bounty.png
diff --git a/public/images/discourse-icon.svg b/public/images/discourse-icon.svg
diff --git a/public/images/total-audits.png b/public/images/total-audits.png
diff --git a/public/images/x-icon.svg b/public/images/x-icon.svg
diff --git a/public/images/youtube-icon.svg b/public/images/youtube-icon.svg
diff --git a/src/components/Careers/Cards/index.tsx b/src/components/Careers/Cards/index.tsx
@@ -61,7 +61,7 @@ export const Cards = ({
     <Container id={id} sx={{ marginBottom: '80px' }} className={layoutCss.containerMedium}>
       <Grid container spacing={{ xs: 2, md: '30px', xl: '50px' }}>
         <Grid item xs={12}>
-          <Typography variant="h1" className={css.title} mb={{ xs: 3, md: '50px' }}>
+          <Typography variant="h1" textAlign="center" mb={{ xs: 3, md: '50px' }}>
             {title}
           </Typography>
         </Grid>

diff --git a/src/components/Careers/Cards/styles.module.css b/src/components/Careers/Cards/styles.module.css
@@ -21,10 +21,6 @@
   transform: rotate(45deg);
 }
 
-.title {
-  text-align: center;
-}
-
 .cardTitle {
   margin-bottom: 16px;
 }

diff --git a/src/components/Careers/Intro/index.tsx b/src/components/Careers/Intro/index.tsx
@@ -32,7 +32,7 @@ export const Intro = ({
         </Grid>
 
         <Grid item xs={12} md={10} xl={5}>
-          <Typography variant="h1" className={css.title}>
+          <Typography variant="h1" textAlign="center">
             {title}
           </Typography>
         </Grid>

diff --git a/src/components/Careers/Intro/styles.module.css b/src/components/Careers/Intro/styles.module.css
@@ -28,15 +28,6 @@
   margin-top: 0px;
 }
 
-/* TODO: Use h1 from theme when implemented
-https://github.com/safe-global/safe-homepage/issues/11 */
-.title {
-  font-size: 64px;
-  line-height: 64px;
-  text-align: center;
-  padding: 0;
-}
-
 .text {
   text-align: center;
 }
@@ -46,11 +37,6 @@ https://github.com/safe-global/safe-homepage/issues/11 */
     gap: 24px;
   }
 
-  .title {
-    font-size: 80px;
-    line-height: 88px;
-  }
-
   .bg {
     width: 900px;
     height: 900px;

diff --git a/src/components/Core/BannerCta/index.tsx b/src/components/Core/BannerCta/index.tsx
@@ -22,7 +22,7 @@ export const BannerCta = ({ title, buttons, caption }: BaseBlock): ReactElement
         <Typography variant="h2" color="text.primary" mt={3} mb={5}>
           {title}
         </Typography>
-        <ButtonsWrapper buttons={buttons} btnColor="secondary" />
+        <ButtonsWrapper buttons={buttons} />
       </div>
     </Container>
   )

diff --git a/src/components/Core/Intro/index.tsx b/src/components/Core/Intro/index.tsx
@@ -29,7 +29,7 @@ const CoreIntro = ({ title, text, link }: BaseBlock) => {
           </video>
         </Grid>
         <Grid item md={6}>
-          <Typography className={css.title} variant="h1" mb={4}>
+          <Typography variant="h1" mb={4}>
             {title}
           </Typography>
           <Typography variant="h4" component="div" mb={5}>

diff --git a/src/components/Core/Intro/styles.module.css b/src/components/Core/Intro/styles.module.css
@@ -32,12 +32,6 @@
   margin: auto;
 }
 
-.title {
-  font-size: 64px;
-  line-height: 64px;
-  letter-spacing: -0.01em;
-}
-
 .video {
   max-width: 90%;
   height: auto;
@@ -53,11 +47,6 @@
     padding-top: 30px;
     margin-bottom: 120px;
   }
-
-  .title {
-    font-size: 80px;
-    line-height: 82px;
-  }
 }
 
 @keyframes bounce {

diff --git a/src/components/Core/Masthead/index.tsx b/src/components/Core/Masthead/index.tsx
@@ -25,7 +25,7 @@ export const Masthead = ({ title, buttons, caption, image }: BaseBlock): ReactEl
             <Typography variant="h2" color="text.primary" mt={3} mb={5}>
               {title}
             </Typography>
-            <ButtonsWrapper buttons={buttons} btnColor="secondary" />
+            <ButtonsWrapper buttons={buttons} />
           </Grid>
           {image ? (
             <Grid item xs={12} md={4} lg={3} xl={2.5} className={css.image}>

diff --git a/src/components/Ecosystem/Intro/index.tsx b/src/components/Ecosystem/Intro/index.tsx
@@ -9,7 +9,7 @@ const EcosystemIntro = ({ title, text }: BaseBlock) => {
       <BackgroundParticles className={css.bg} />
       <Grid container className={css.container} spacing={{ xs: 6, md: '30px', xl: '50px' }}>
         <Grid item md={8}>
-          <Typography className={css.title} variant="h1" mb={4}>
+          <Typography variant="h1" mb={4}>
             {title}
           </Typography>
           <Typography variant="h4" component="div" mb={5}>

diff --git a/src/components/Ecosystem/Intro/styles.module.css b/src/components/Ecosystem/Intro/styles.module.css
@@ -14,22 +14,11 @@
   width: 100%;
 }
 
-.title {
-  font-size: 64px;
-  line-height: 64px;
-  letter-spacing: -0.01em;
-}
-
 @media (min-width: 600px) {
   .container {
     margin-top: 100px;
   }
 
-  .title {
-    font-size: 80px;
-    line-height: 82px;
-  }
-
   .bg {
     width: auto;
   }

diff --git a/src/components/Ecosystem/Projects/ProjectCard.tsx b/src/components/Ecosystem/Projects/ProjectCard.tsx
@@ -1,6 +1,6 @@
 import { Avatar, Typography, IconButton, SvgIcon, Chip } from '@mui/material'
 
-import TwitterIcon from '@/public/images/twitter-icon-28x28.svg'
+import XIcon from '@/public/images/x-icon.svg'
 import GithubIcon from '@/public/images/github-icon.svg'
 
 import css from './styles.module.css'
@@ -27,7 +27,7 @@ export const ProjectCard = (item: EcosystemProjectWithCategories) => {
             size="small"
             sx={{ color: 'primary.light' }}
           >
-            <SvgIcon component={TwitterIcon} fontSize="inherit" color="inherit" inheritViewBox />
+            <SvgIcon component={XIcon} fontSize="inherit" color="inherit" inheritViewBox />
           </IconButton>
         )}
 

diff --git a/src/components/Ecosystem/TextBlockItems/index.tsx b/src/components/Ecosystem/TextBlockItems/index.tsx
@@ -13,7 +13,7 @@ const TextBlockItems = ({ title, text, buttons, items }: BaseBlock) => {
             {title}
           </Typography>
           <Typography mb={5}>{text}</Typography>
-          <ButtonsWrapper buttons={buttons} btnColor="primary" />
+          <ButtonsWrapper buttons={buttons} mobileDirection="row" />
         </Grid>
         <Grid item md={2} display={{ xs: 'none', md: 'block' }} />
         <Grid item md={5}>

diff --git a/src/components/Home/BannerTextCard/index.tsx b/src/components/Home/BannerTextCard/index.tsx
@@ -1,8 +1,9 @@
 import { useEffect, useRef, type ReactElement } from 'react'
-import { Grid, Typography, Container, Box } from '@mui/material'
+import { Grid, Typography, Container, Box, Button } from '@mui/material'
 
 import css from './styles.module.css'
 import type { BaseBlock } from '@/components/Home/types'
+import { ECOSYSTEM_LINK } from '@/config/constants'
 
 const BannerTextCard = ({ title, text }: BaseBlock): ReactElement => {
   const bgRef = useRef<HTMLDivElement>(null)
@@ -36,15 +37,18 @@ const BannerTextCard = ({ title, text }: BaseBlock): ReactElement => {
     <div className={css.gradient} ref={bgRef}>
       <Container sx={{ textAlign: 'center' }}>
         <Box height={{ xs: '700px', md: '1090px' }} display="flex" alignItems="center">
-          <Grid container justifyContent="center" flexDirection="column" alignItems="center">
+          <Grid container justifyContent="center" flexDirection="column" alignItems="center" gap={4}>
             <Grid item md={8} xl={6}>
-              <Typography variant="h2" mb={4} textAlign="center">
-                {title}
-              </Typography>
+              <Typography variant="h2">{title}</Typography>
             </Grid>
             <Grid item md={6}>
               <Typography>{text}</Typography>
             </Grid>
+            <Grid item md={6}>
+              <Button href={ECOSYSTEM_LINK} target="_blank" rel="noreferrer" variant="contained" size="large">
+                Explore ecosystem
+              </Button>
+            </Grid>
           </Grid>
         </Box>
       </Container>