From fd3783188c53ad5381f7e79ba44df0bd177d4b75 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fede=20=C3=81lvarez?= <fedealvarezcampos@gmail.com>
Date: Tue, 28 Jun 2022 12:48:31 +0200
Subject: [PATCH] Work on re-styling

---
 .../sections/about/related/related.module.scss      |  2 +-
 .../sections/about/roadmap/roadmap.module.scss      |  2 +-
 src/components/sections/about/team/team.module.scss |  2 +-
 .../about/whitepaper/whitepaper.module.scss         |  4 ++--
 src/components/sections/blog/hero/index.tsx         | 10 +++++-----
 .../sections/blog/post-content/content.module.scss  | 13 +++++++++++++
 .../careers/positions/positions.module.scss         |  4 ++--
 src/components/sections/careers/why/why.module.scss |  2 +-
 .../sections/community/events/events.module.scss    |  2 +-
 .../sections/community/socials/socials.module.scss  |  4 ++--
 .../sections/contact/form/form.module.scss          |  4 ++--
 .../sections/homepage/benefits/benefits.module.scss |  9 ++++++---
 .../what-others-say/what-others-say.module.scss     |  2 +-
 .../sections/newsroom/press/press.module.scss       |  2 +-
 .../sections/partners/contact/contact.module.scss   |  4 ++--
 .../opportunities/opportunities.module.scss         |  4 ++--
 .../sections/products/app/app.module.scss           |  1 -
 .../sections/products/network/network.module.scss   |  2 +-
 .../sections/products/stack/stack.module.scss       |  8 ++++----
 .../sections/products/token/token.module.scss       |  3 ++-
 .../sections/products/watchers/watchers.module.scss |  2 +-
 21 files changed, 51 insertions(+), 35 deletions(-)

diff --git a/src/components/sections/about/related/related.module.scss b/src/components/sections/about/related/related.module.scss
index 5fcd888..c89df6d 100644
--- a/src/components/sections/about/related/related.module.scss
+++ b/src/components/sections/about/related/related.module.scss
@@ -9,7 +9,7 @@
   align-items: center;
   flex-direction: column;
   margin-top: tovw(35px, 'default', 20px);
-  padding: tovw(130px, 'default', 95px) 0;
+  padding: tovw(40px, 'default', 35px) 0 tovw(70px, 'default', 60px);
 
   .slider__container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/about/roadmap/roadmap.module.scss b/src/components/sections/about/roadmap/roadmap.module.scss
index eaa95b8..8a230a9 100644
--- a/src/components/sections/about/roadmap/roadmap.module.scss
+++ b/src/components/sections/about/roadmap/roadmap.module.scss
@@ -7,7 +7,7 @@
   }
 
   position: relative;
-  margin: tovw(85px, 'default', 70px) 0 tovw(135px, 'default', 70px) 0;
+  margin: tovw(25px, 'default', 20px) 0 tovw(135px, 'default', 70px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/about/team/team.module.scss b/src/components/sections/about/team/team.module.scss
index acc91c8..9440e87 100644
--- a/src/components/sections/about/team/team.module.scss
+++ b/src/components/sections/about/team/team.module.scss
@@ -7,7 +7,7 @@
 
   position: relative;
   margin-top: tovw(24px, 'default', 16px);
-  padding: tovw(124px, 'default', 120px) 0 tovw(80px, 'default', 60px) 0;
+  padding: tovw(124px, 'default', 120px) 0 tovw(20px, 'default', 20px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/about/whitepaper/whitepaper.module.scss b/src/components/sections/about/whitepaper/whitepaper.module.scss
index d660ea6..c353270 100644
--- a/src/components/sections/about/whitepaper/whitepaper.module.scss
+++ b/src/components/sections/about/whitepaper/whitepaper.module.scss
@@ -7,7 +7,7 @@
   }
 
   position: relative;
-  margin: tovw(50px, 'default', 30px) 0;
+  margin-bottom: tovw(-80px, 'default', -85px);
 
   .container {
     @include respond-to('mobile') {
@@ -53,7 +53,7 @@
         padding-top: tovw(60px, 'mobile', 60px);
       }
 
-      padding-top: tovw(75px, 'default', 60px);
+      padding-top: tovw(55px, 'default', 40px);
       width: tovw(1300px, 'default', 400px);
     }
 
diff --git a/src/components/sections/blog/hero/index.tsx b/src/components/sections/blog/hero/index.tsx
index 27789a7..2350385 100644
--- a/src/components/sections/blog/hero/index.tsx
+++ b/src/components/sections/blog/hero/index.tsx
@@ -4,7 +4,7 @@ import { useEffect, useRef } from 'react'
 import { BlogCard } from '~/components/common/card'
 import { Container } from '~/components/layout/container'
 import Section from '~/components/layout/section'
-import Heading from '~/components/primitives/heading'
+// import Heading from '~/components/primitives/heading'
 import { BlogPostFragment } from '~/lib/cms/generated'
 
 import s from './hero.module.scss'
@@ -31,7 +31,7 @@ const Hero = ({ featuredPost }: HeroProps) => {
 
   return (
     <Section className={s['section']} disableFadeIn>
-      <div className={s.hero__container}>
+      {/* <div className={s.hero__container}>
         <img ref={blogHeroRef} className={s.hero} loading="eager" alt="hero" />
         <img
           ref={blogHeroMobileRef}
@@ -39,11 +39,11 @@ const Hero = ({ featuredPost }: HeroProps) => {
           loading="eager"
           alt="hero"
         />
-      </div>
+      </div> */}
       <Container className={s['container']}>
-        <Heading as="h1" variant="xl" centered>
+        {/* <Heading as="h1" variant="xl" centered>
           Blog
-        </Heading>
+        </Heading> */}
         <BlogCard data={featuredPost} horizontal />
       </Container>
     </Section>
diff --git a/src/components/sections/blog/post-content/content.module.scss b/src/components/sections/blog/post-content/content.module.scss
index 82d0d2b..cd61ecd 100644
--- a/src/components/sections/blog/post-content/content.module.scss
+++ b/src/components/sections/blog/post-content/content.module.scss
@@ -21,6 +21,19 @@ $img-height-mobile: 200px;
     }
   }
 
+  p {
+    margin: tovw(45px, 'default', 30px) 0 tovw(45px, 'default', 30px) 0;
+  }
+
+  ol,
+  ul {
+    padding-left: tovw(35px, 'default', 15px);
+
+    p {
+      margin-left: tovw(15px, 'default', 10px);
+    }
+  }
+
   .image__container {
     border-top: tovw(1px, 'default', 1px) solid var(--color-white);
     border-bottom: tovw(1px, 'default', 1px) solid var(--color-white);
diff --git a/src/components/sections/careers/positions/positions.module.scss b/src/components/sections/careers/positions/positions.module.scss
index be2e84c..74e089f 100644
--- a/src/components/sections/careers/positions/positions.module.scss
+++ b/src/components/sections/careers/positions/positions.module.scss
@@ -6,8 +6,8 @@
   }
 
   position: relative;
-  margin: tovw(105px, 'default', 70px) 0;
-  padding: tovw(104px, 'default', 95px) 0 tovw(44px, 'default', 35px) 0;
+  margin: tovw(55px, 'default', 40px) 0;
+  padding: tovw(104px, 'default', 95px) 0 tovw(105px, 'default', 55px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/careers/why/why.module.scss b/src/components/sections/careers/why/why.module.scss
index cd064c4..785e66c 100644
--- a/src/components/sections/careers/why/why.module.scss
+++ b/src/components/sections/careers/why/why.module.scss
@@ -6,7 +6,7 @@
   }
 
   position: relative;
-  margin: tovw(140px, 'default', 110px) 0;
+  margin: tovw(50px, 'default', 40px) 0;
   padding-bottom: tovw(50px, 'default', 40px);
 
   .container {
diff --git a/src/components/sections/community/events/events.module.scss b/src/components/sections/community/events/events.module.scss
index fb597ce..5eb5bec 100644
--- a/src/components/sections/community/events/events.module.scss
+++ b/src/components/sections/community/events/events.module.scss
@@ -5,7 +5,7 @@
   align-items: center;
   flex-direction: column;
   margin-top: tovw(55px, 'default', 20px);
-  padding: tovw(220px, 'default', 72px) 0;
+  padding: tovw(220px, 'default', 72px) 0 tovw(120px, 'default', 72px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/community/socials/socials.module.scss b/src/components/sections/community/socials/socials.module.scss
index e805fd4..cbc9fde 100644
--- a/src/components/sections/community/socials/socials.module.scss
+++ b/src/components/sections/community/socials/socials.module.scss
@@ -7,8 +7,8 @@
   }
 
   position: relative;
-  padding: tovw(44px, 'default', 30px) 0;
-  margin-bottom: tovw(165px, 'default', 120px);
+  padding: tovw(30px, 'default', 25px) 0;
+  margin-bottom: tovw(100px, 'default', 80px);
 }
 
 .container {
diff --git a/src/components/sections/contact/form/form.module.scss b/src/components/sections/contact/form/form.module.scss
index 1c8962a..92d44a5 100644
--- a/src/components/sections/contact/form/form.module.scss
+++ b/src/components/sections/contact/form/form.module.scss
@@ -9,8 +9,8 @@
   }
 
   position: relative;
-  margin: tovw(135px, 'default', 55px) 0;
-  padding: tovw(104px, 'default', 55px) 0;
+  margin: tovw(105px, 'default', 55px) 0;
+  padding: tovw(64px, 'default', 55px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/homepage/benefits/benefits.module.scss b/src/components/sections/homepage/benefits/benefits.module.scss
index 5891e73..7141737 100644
--- a/src/components/sections/homepage/benefits/benefits.module.scss
+++ b/src/components/sections/homepage/benefits/benefits.module.scss
@@ -13,6 +13,12 @@
     }
   }
 
+  @media screen and (max-width: 1400px) {
+    padding-bottom: tovw(250px, 'default', 160px);
+  }
+
+  position: relative;
+
   .header {
     @include respond-to('mobile') {
       padding-right: 0;
@@ -24,9 +30,6 @@
     }
   }
 
-  position: relative;
-  padding-bottom: tovw(200px, 'default', 200px);
-
   .grid {
     @include respond-to('mobile') {
       display: unset;
diff --git a/src/components/sections/homepage/what-others-say/what-others-say.module.scss b/src/components/sections/homepage/what-others-say/what-others-say.module.scss
index 2e58baa..a3a9a61 100644
--- a/src/components/sections/homepage/what-others-say/what-others-say.module.scss
+++ b/src/components/sections/homepage/what-others-say/what-others-say.module.scss
@@ -73,7 +73,7 @@
   transform-style: preserve-3d;
   cursor: grab;
   width: 100%;
-  height: tovw(1000px, 'default', 700px);
+  height: tovw(950px, 'default', 700px);
   user-select: none;
 }
 
diff --git a/src/components/sections/newsroom/press/press.module.scss b/src/components/sections/newsroom/press/press.module.scss
index ce68d6f..ed3757a 100644
--- a/src/components/sections/newsroom/press/press.module.scss
+++ b/src/components/sections/newsroom/press/press.module.scss
@@ -10,7 +10,7 @@
   align-items: center;
   flex-direction: column;
   margin-top: tovw(55px, 'default', 55px);
-  padding: tovw(95px, 'default', 90px) 0 tovw(185px, 'default', 90px) 0;
+  padding: tovw(95px, 'default', 90px) 0 tovw(125px, 'default', 90px) 0;
 
   .slider__container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/partners/contact/contact.module.scss b/src/components/sections/partners/contact/contact.module.scss
index 920acaa..3785a4b 100644
--- a/src/components/sections/partners/contact/contact.module.scss
+++ b/src/components/sections/partners/contact/contact.module.scss
@@ -8,8 +8,8 @@
   }
 
   position: relative;
-  margin: tovw(135px, 'default', 70px) 0;
-  padding: tovw(104px, 'default', 95px) 0;
+  margin: tovw(105px, 'default', 70px) 0;
+  padding: tovw(64px, 'default', 55px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/partners/opportunities/opportunities.module.scss b/src/components/sections/partners/opportunities/opportunities.module.scss
index bac44ea..02c5fae 100644
--- a/src/components/sections/partners/opportunities/opportunities.module.scss
+++ b/src/components/sections/partners/opportunities/opportunities.module.scss
@@ -7,8 +7,8 @@
   }
 
   position: relative;
-  margin: tovw(105px, 'default', 70px) 0;
-  padding: tovw(104px, 'default', 95px) 0;
+  margin: tovw(55px, 'default', 50px) 0;
+  padding: tovw(54px, 'default', 45px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/products/app/app.module.scss b/src/components/sections/products/app/app.module.scss
index 993250c..372a1fe 100644
--- a/src/components/sections/products/app/app.module.scss
+++ b/src/components/sections/products/app/app.module.scss
@@ -13,7 +13,6 @@
   position: relative;
   align-items: center;
   justify-content: center;
-  margin: tovw(40px, 'default', 30px) 0;
   height: calc(var(--vw) * 40);
 
   .container {
diff --git a/src/components/sections/products/network/network.module.scss b/src/components/sections/products/network/network.module.scss
index fdba72d..73a2e68 100644
--- a/src/components/sections/products/network/network.module.scss
+++ b/src/components/sections/products/network/network.module.scss
@@ -7,7 +7,7 @@
   }
 
   position: relative;
-  padding: tovw(124px, 'default', 100px) 0;
+  padding: tovw(80px, 'default', 70px) 0 tovw(84px, 'default', 70px) 0;
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/products/stack/stack.module.scss b/src/components/sections/products/stack/stack.module.scss
index e3a6dfe..29a7cb3 100644
--- a/src/components/sections/products/stack/stack.module.scss
+++ b/src/components/sections/products/stack/stack.module.scss
@@ -7,7 +7,7 @@
   }
 
   position: relative;
-  padding: tovw(124px, 'default', 100px) 0;
+  padding: tovw(110px, 'default', 100px) 0 tovw(80px, 'default', 80px) 0;
 
   .container {
     @include respond-to('mobile') {
@@ -121,11 +121,11 @@
         min-height: unset;
       }
 
-      min-height: tovw(1611px, 'default', 758px);
+      min-height: tovw(1540px, 'default', 758px);
 
       .stack__img {
         width: 100%;
-        margin-top: tovw(293px, 'default', 88px);
+        margin-top: tovw(193px, 'default', 88px);
         image-rendering: optimizequality;
         @media screen and (max-width: 1450px) {
           display: none;
@@ -148,7 +148,7 @@
 
       position: absolute;
       right: 0;
-      bottom: tovw(530px, 'default', 300px);
+      bottom: tovw(590px, 'default', 300px);
       left: 0;
       opacity: 0.4;
       z-index: -1;
diff --git a/src/components/sections/products/token/token.module.scss b/src/components/sections/products/token/token.module.scss
index 437b32d..efe5d3a 100644
--- a/src/components/sections/products/token/token.module.scss
+++ b/src/components/sections/products/token/token.module.scss
@@ -7,7 +7,8 @@
   }
 
   position: relative;
-  padding: tovw(124px, 'default', 100px) 0;
+  padding: tovw(20px, 'default', 20px) 0 tovw(124px, 'default', 100px) 0;
+  margin-top: tovw(-20px, 'default', -20px);
 
   .container {
     @include respond-to('mobile') {
diff --git a/src/components/sections/products/watchers/watchers.module.scss b/src/components/sections/products/watchers/watchers.module.scss
index bf38a3c..c695edc 100644
--- a/src/components/sections/products/watchers/watchers.module.scss
+++ b/src/components/sections/products/watchers/watchers.module.scss
@@ -7,7 +7,7 @@
   }
 
   position: relative;
-  padding: tovw(124px, 'default', 100px) 0;
+  padding: tovw(110px, 'default', 100px) 0;
 
   .container {
     @include respond-to('mobile') {