From edff569d4d7bc4c17a5183f35a60b19c43a84e0e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fede=20=C3=81lvarez?= Date: Fri, 1 Jul 2022 13:19:09 +0200 Subject: [PATCH] General style changes --- .../common/footer/footer.module.scss | 4 +-- .../common/header/header.module.scss | 13 ++++---- .../primitives/link/link.module.scss | 12 ++++---- .../sections/about/hero/hero.module.scss | 5 ++-- .../about/related/related.module.scss | 4 +-- .../about/roadmap/roadmap.module.scss | 2 +- .../about/whitepaper/whitepaper.module.scss | 10 ++++--- .../sections/blog/hero/hero.module.scss | 9 +++--- .../blog/post-content/content.module.scss | 8 +++-- .../sections/blog/post-hero/hero.module.scss | 11 +++---- .../blog/posts-grid/posts-grid.module.scss | 2 +- .../sections/blog/shares/shares.module.scss | 7 ++++- .../sections/careers/hero/hero.module.scss | 11 ++++--- .../careers/positions/positions.module.scss | 10 ++++--- .../careers/values/values.module.scss | 2 +- .../sections/careers/why/why.module.scss | 3 +- .../community/events/events.module.scss | 30 +++++++++++++++---- .../sections/community/events/index.tsx | 4 +-- .../sections/community/hero/hero.module.scss | 3 +- .../community/socials/socials.module.scss | 8 +---- .../sections/contact/form/form.module.scss | 3 +- .../sections/contact/hero/hero.module.scss | 2 +- .../homepage/benefits/benefits.module.scss | 6 +++- .../latest-news/latest-news.module.scss | 2 +- .../what-others-say.module.scss | 3 +- .../sections/newsroom/hero/hero.module.scss | 5 ++-- .../sections/newsroom/media/media.module.scss | 1 + .../sections/newsroom/press/press.module.scss | 2 +- .../partners/contact/contact.module.scss | 5 ++-- .../sections/partners/hero/hero.module.scss | 4 +-- .../opportunities/opportunities.module.scss | 7 +++-- .../sections/products/app/app.module.scss | 1 + .../sections/products/hero/hero.module.scss | 6 ++-- .../sections/products/stack/stack.module.scss | 4 +-- .../sections/products/token/token.module.scss | 1 - .../products/watchers/watchers.module.scss | 2 +- 36 files changed, 125 insertions(+), 87 deletions(-) diff --git a/src/components/common/footer/footer.module.scss b/src/components/common/footer/footer.module.scss index bc904c2..b533a0d 100644 --- a/src/components/common/footer/footer.module.scss +++ b/src/components/common/footer/footer.module.scss @@ -195,10 +195,10 @@ @include respond-to('mobile') { display: grid; - column-gap: tovw(97px, 'tablet', 50px); + column-gap: tovw(95px, 'tablet', 50px); grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; - row-gap: tovw(44px, 'tablet', 44px); + row-gap: tovw(45px, 'tablet', 25px); } span { diff --git a/src/components/common/header/header.module.scss b/src/components/common/header/header.module.scss index c3d0102..9aa9878 100644 --- a/src/components/common/header/header.module.scss +++ b/src/components/common/header/header.module.scss @@ -103,11 +103,12 @@ gap: tovw(18px, 'default', 14px); border: 1px solid var(--color-white); border-radius: tovw(8px, 'default', 8px); - top: tovw(40px, 'default', 30px); + top: tovw(35px, 'default', 30px); padding: tovw(23px, 'default', 20px) tovw(24px, 'default', 23px) - tovw(24px, 'default', 20px) tovw(21px, 'default', 19px); + tovw(24px, 'default', 21px) tovw(21px, 'default', 18px); background-color: rgb(4 4 4 / 0.8); backdrop-filter: blur(20px); + transform: translateX(tovw(-8px, 'default', -4px)); animation: viewporto 250ms ease-in-out; z-index: 20; @@ -193,15 +194,15 @@ position: relative; display: flex; flex-flow: row wrap; - gap: tovw(10px, 'mobile'); + gap: tovw(14px, 'mobile') tovw(20px, 'mobile'); background-color: unset; border: unset; - padding: unset; - padding: tovw(15px, 'mobile') 0 tovw(10px, 'mobile') tovw(5px, 'mobile'); + max-width: 80vw; + padding: tovw(14px, 'mobile') 0 tovw(10px, 'mobile') tovw(1px, 'mobile'); animation: mobile-menu ease-in-out 250ms; a { - font-size: tovw(18px, 'mobile') !important; + font-size: tovw(20px, 'mobile') !important; } } } diff --git a/src/components/primitives/link/link.module.scss b/src/components/primitives/link/link.module.scss index 76a2c0d..84ee49d 100644 --- a/src/components/primitives/link/link.module.scss +++ b/src/components/primitives/link/link.module.scss @@ -35,6 +35,11 @@ } &::before { + @include respond-to('mobile') { + width: 100%; + opacity: 1; + } + position: absolute; top: 100%; left: 0; @@ -132,12 +137,5 @@ [data-theme='light'] { .link { color: var(--color-accent); - - &--default, - &--nav { - .icon svg { - fill: red !important; - } - } } } diff --git a/src/components/sections/about/hero/hero.module.scss b/src/components/sections/about/hero/hero.module.scss index bf0c17b..aad980f 100644 --- a/src/components/sections/about/hero/hero.module.scss +++ b/src/components/sections/about/hero/hero.module.scss @@ -9,7 +9,8 @@ display: flex; flex-direction: column; justify-content: center; - padding: tovw(100px, 'default', 50px) tovw(221px, 'default', 100px); + padding: tovw(100px, 'default', 50px) tovw(221px, 'default', 100px) + tovw(60px, 'default', 30px) tovw(221px, 'default', 100px); max-width: 100%; min-height: calc(var(--vh) * 100); @@ -87,7 +88,7 @@ display: flex; flex-direction: column; margin-top: tovw(26px, 'default', 26px); - gap: tovw(65px, 'default', 56px); + gap: tovw(65px, 'default', 36px); .header { @include respond-to('mobile') { diff --git a/src/components/sections/about/related/related.module.scss b/src/components/sections/about/related/related.module.scss index c89df6d..f4f760b 100644 --- a/src/components/sections/about/related/related.module.scss +++ b/src/components/sections/about/related/related.module.scss @@ -2,7 +2,7 @@ .section { @include respond-to('mobile') { - padding-bottom: tovw(80px, 'mobile', 140px); + padding-bottom: tovw(50px, 'mobile'); } display: flex; @@ -37,7 +37,7 @@ display: flex; align-items: center; justify-content: space-between; - margin-bottom: tovw(90px, 'default', 64px); + margin-bottom: tovw(90px, 'default', 38px); &.altheader { @media screen and (min-width: 901px) { diff --git a/src/components/sections/about/roadmap/roadmap.module.scss b/src/components/sections/about/roadmap/roadmap.module.scss index 8a230a9..204a1b8 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(25px, 'default', 20px) 0 tovw(135px, 'default', 70px) 0; + margin: tovw(25px, 'default', 20px) 0 tovw(135px, 'default', 38px) 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 e5ab5c9..ce016d5 100644 --- a/src/components/sections/about/whitepaper/whitepaper.module.scss +++ b/src/components/sections/about/whitepaper/whitepaper.module.scss @@ -2,17 +2,19 @@ .section { @include respond-to('mobile') { - margin-top: 0; - padding: tovw(30px, 'mobile') 0; + padding: tovw(10px, 'mobile') 0; + margin-bottom: tovw(-80px, 'mobile'); + margin-top: tovw(-50px, 'mobile'); } position: relative; - margin-bottom: tovw(-80px, 'default', -85px); + margin-bottom: tovw(-110px, 'default', -115px); + margin-top: tovw(-90px, 'default', -95px); .container { @include respond-to('mobile') { padding: 0 tovw(56px, 'default', 16px); - min-height: unset; + min-height: tovw(500px, 'mobile', 660px); } display: flex; diff --git a/src/components/sections/blog/hero/hero.module.scss b/src/components/sections/blog/hero/hero.module.scss index c399491..8a15c22 100644 --- a/src/components/sections/blog/hero/hero.module.scss +++ b/src/components/sections/blog/hero/hero.module.scss @@ -1,6 +1,11 @@ @import '~/css/helpers'; .section { + @include respond-to('mobile') { + min-height: auto; + padding-top: tovw(46px, 'mobile', 100px); + } + display: flex; align-items: center; flex-direction: column; @@ -15,10 +20,6 @@ max-width: 100%; text-align: center; - @media screen and (max-width: 800px) { - min-height: auto; - } - .hero__container { @include respond-to('mobile') { margin-top: tovw(-300px, 'default', -80px); diff --git a/src/components/sections/blog/post-content/content.module.scss b/src/components/sections/blog/post-content/content.module.scss index cd61ecd..81c7714 100644 --- a/src/components/sections/blog/post-content/content.module.scss +++ b/src/components/sections/blog/post-content/content.module.scss @@ -4,13 +4,15 @@ $img-height: 590px; $img-height-mobile: 200px; .section { - margin-top: tovw(108px, 'default', 60px); - margin-bottom: tovw(147px, 'default', 60px); - @media screen and (max-width: 800px) { transform: none; + margin-top: tovw(15px, 'mobile'); + margin-bottom: tovw(30px, 'mobile'); } + margin-top: tovw(108px, 'default', 60px); + margin-bottom: tovw(147px, 'default', 60px); + .container { min-width: tovw(856px, 'default', 856px); diff --git a/src/components/sections/blog/post-hero/hero.module.scss b/src/components/sections/blog/post-hero/hero.module.scss index 04218f8..9625851 100644 --- a/src/components/sections/blog/post-hero/hero.module.scss +++ b/src/components/sections/blog/post-hero/hero.module.scss @@ -1,6 +1,12 @@ @import '~/css/helpers'; .section { + @include respond-to('mobile') { + padding-top: tovw(60px, 'mobile', 120px); + padding-bottom: tovw(36px, 'mobile', 36px); + min-height: auto; + } + display: flex; position: relative; align-items: center; @@ -15,11 +21,6 @@ overflow: visible; text-align: center; - @media screen and (max-width: 800px) { - padding-bottom: tovw(66px, 'default', 66px); - min-height: auto; - } - .meta { display: flex; gap: tovw(25px, 'default', 25px); diff --git a/src/components/sections/blog/posts-grid/posts-grid.module.scss b/src/components/sections/blog/posts-grid/posts-grid.module.scss index 97261ff..b027f3d 100644 --- a/src/components/sections/blog/posts-grid/posts-grid.module.scss +++ b/src/components/sections/blog/posts-grid/posts-grid.module.scss @@ -15,7 +15,7 @@ @media screen and (max-width: 1100px) { display: flex; flex-direction: column; - gap: tovw(80px, 'default', 80px); + gap: tovw(80px, 'default', 55px); padding-left: 0; padding-right: 0; } diff --git a/src/components/sections/blog/shares/shares.module.scss b/src/components/sections/blog/shares/shares.module.scss index c93b1bb..7e4c713 100644 --- a/src/components/sections/blog/shares/shares.module.scss +++ b/src/components/sections/blog/shares/shares.module.scss @@ -1,7 +1,12 @@ @import '~/css/helpers'; .container { + @include respond-to('mobile') { + padding-bottom: tovw(15px, 'mobile'); + } + border-top: 1px solid var(--color-white); + padding: 0; padding-top: tovw(96px, 'default', 48px); padding-bottom: tovw(100px, 'default', 95px); text-align: center; @@ -19,7 +24,7 @@ > div { display: flex; - gap: tovw(32px, 'default', 16px); + gap: tovw(32px, 'default', 8px); justify-content: center; flex-wrap: wrap; diff --git a/src/components/sections/careers/hero/hero.module.scss b/src/components/sections/careers/hero/hero.module.scss index ccc7c68..9107c10 100644 --- a/src/components/sections/careers/hero/hero.module.scss +++ b/src/components/sections/careers/hero/hero.module.scss @@ -2,7 +2,7 @@ .section { @include respond-to('mobile') { - margin-bottom: tovw(88px, 'mobile'); + margin-bottom: tovw(68px, 'mobile'); padding: 0; width: 100vw; justify-content: flex-start; @@ -45,7 +45,7 @@ &::after { position: absolute; - top: 0; + bottom: tovw(-45px, 'default', -45px); left: 0; z-index: 1; background: radial-gradient( @@ -55,8 +55,8 @@ rgb(3 3 3 / 1) 100% ); transform: translateX(-30%) translateY(-3%); - width: 650%; - height: tovw(495px, 'default', 200px); + width: 1000%; + height: tovw(575px, 'default', 200px); content: ''; } } @@ -201,10 +201,9 @@ background: radial-gradient( ellipse, rgb(251 251 251 / 0) 40%, - rgb(251 251 251 / 1) 62%, + rgb(251 251 251 / 1) 70%, rgb(251 251 251 / 1) 100% ); - transform: translateX(-20%); } } diff --git a/src/components/sections/careers/positions/positions.module.scss b/src/components/sections/careers/positions/positions.module.scss index 74e089f..9dc8050 100644 --- a/src/components/sections/careers/positions/positions.module.scss +++ b/src/components/sections/careers/positions/positions.module.scss @@ -2,12 +2,14 @@ .section { @include respond-to('mobile') { - margin-top: 0; + margin: 0; + padding-top: tovw(36px, 'mobile'); + padding-bottom: tovw(16px, 'mobile'); } position: relative; margin: tovw(55px, 'default', 40px) 0; - padding: tovw(104px, 'default', 95px) 0 tovw(105px, 'default', 55px) 0; + padding: tovw(44px, 'default', 35px) 0 tovw(105px, 'default', 55px) 0; .container { @include respond-to('mobile') { @@ -43,14 +45,14 @@ .careers { @include respond-to('mobile') { - gap: tovw(80px, 'default', 70px); + gap: tovw(80px, 'default', 40px); } display: flex; flex-direction: column; justify-content: space-between; gap: tovw(150px); - margin-top: tovw(70px, 'default', 40px); + margin-top: tovw(70px, 'default', 30px); div { @include respond-to('mobile') { diff --git a/src/components/sections/careers/values/values.module.scss b/src/components/sections/careers/values/values.module.scss index 030b916..08cc614 100644 --- a/src/components/sections/careers/values/values.module.scss +++ b/src/components/sections/careers/values/values.module.scss @@ -7,7 +7,7 @@ } position: relative; - padding: tovw(180px, 'default', 100px) 0; + padding: tovw(100px, 'default', 60px) 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 785e66c..275df48 100644 --- a/src/components/sections/careers/why/why.module.scss +++ b/src/components/sections/careers/why/why.module.scss @@ -3,10 +3,11 @@ .section { @include respond-to('mobile') { padding-bottom: 0; + margin-top: tovw(45px, 'mobile'); } position: relative; - margin: tovw(50px, 'default', 40px) 0; + margin: tovw(100px, '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 b77e9b1..32ba7d4 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 tovw(120px, 'default', 72px) 0; + padding: tovw(220px, 'default', 36px) 0 tovw(120px, 'default', 36px) 0; .container { @include respond-to('mobile') { @@ -36,7 +36,7 @@ display: flex; align-items: center; justify-content: space-between; - margin-bottom: tovw(80px, 'default', 64px); + margin-bottom: tovw(80px, 'default', 40px); border-bottom: tovw(1px, 'default', 1px) solid var(--color-white); padding-bottom: tovw(60px, 'default', 30px); @@ -174,11 +174,31 @@ .events__container { &::after, &::before { + @media screen and (max-width: 1140px) { + background: linear-gradient( + 90deg, + rgb(251 251 251 / 0) 0%, + rgb(251 251 251 / 0.95) 35%, + rgb(251 251 251 / 1) 65% + ); + width: tovw(280px, 'default', 150px); + } + + @include respond-to('mobile') { + background: linear-gradient( + 90deg, + rgb(251 251 251 / 0) 0%, + rgb(251 251 251 / 0.55) 35%, + rgb(251 251 251 / 1) 95% + ); + width: tovw(20px, 'default', 20px); + } + background: linear-gradient( 90deg, - rgb(251 251 251 / 0) 0%, - rgb(251 251 251 / 0.95) 35%, - rgb(251 251 251 / 1) 65% + rgb(251 251 251 / 0) 79.5%, + rgb(251 251 251 / 1) 80.8%, + rgb(251 251 251 / 1) 100% ); } } diff --git a/src/components/sections/community/events/index.tsx b/src/components/sections/community/events/index.tsx index c4b5d43..dd98826 100644 --- a/src/components/sections/community/events/index.tsx +++ b/src/components/sections/community/events/index.tsx @@ -53,8 +53,8 @@ const Events = ({ eventsData, data }: Props) => { }) return ( -
- +
+
{data?.eventsHeading} diff --git a/src/components/sections/community/hero/hero.module.scss b/src/components/sections/community/hero/hero.module.scss index 52f9581..5db1842 100644 --- a/src/components/sections/community/hero/hero.module.scss +++ b/src/components/sections/community/hero/hero.module.scss @@ -26,7 +26,7 @@ @include respond-to('mobile') { display: flex; place-content: center; - min-height: tovw(460px, 'mobile', 515px); + min-height: tovw(460px, 'mobile', 495px); } display: none; @@ -105,6 +105,7 @@ h1 { @include respond-to('mobile') { font-size: tovw(50px, 'mobile'); + margin-bottom: tovw(20px, 'mobile'); } margin: 0; diff --git a/src/components/sections/community/socials/socials.module.scss b/src/components/sections/community/socials/socials.module.scss index cbc9fde..28cce4b 100644 --- a/src/components/sections/community/socials/socials.module.scss +++ b/src/components/sections/community/socials/socials.module.scss @@ -3,7 +3,7 @@ .section { @include respond-to('mobile') { margin-top: 0; - margin-bottom: tovw(80px, 'mobile'); + margin-bottom: tovw(36px, 'mobile'); } position: relative; @@ -81,12 +81,6 @@ height: tovw(80px, 'default', 38px); } - // position: absolute; - // top: tovw(170px, 'default', 120px); - // left: tovw(770px, 'default', 300px); - // transform: rotate(270deg) scale(1.6); - // width: tovw(173px, 'default', 120px); - // height: tovw(72px, 'default', 40px); display: none; } diff --git a/src/components/sections/contact/form/form.module.scss b/src/components/sections/contact/form/form.module.scss index 92d44a5..dec8b37 100644 --- a/src/components/sections/contact/form/form.module.scss +++ b/src/components/sections/contact/form/form.module.scss @@ -5,7 +5,8 @@ margin-top: 0; display: flex; place-content: center; - padding-bottom: tovw(80px, 'default', 80px); + padding-bottom: tovw(60px, 'mobile'); + margin-bottom: 0; } position: relative; diff --git a/src/components/sections/contact/hero/hero.module.scss b/src/components/sections/contact/hero/hero.module.scss index 0cb3954..89e0f9a 100644 --- a/src/components/sections/contact/hero/hero.module.scss +++ b/src/components/sections/contact/hero/hero.module.scss @@ -2,7 +2,7 @@ .section { @include respond-to('mobile') { - margin-bottom: tovw(88px, 'mobile'); + margin-bottom: tovw(35px, 'mobile'); padding: 0; padding-bottom: tovw(10px, 'mobile'); width: 100vw; diff --git a/src/components/sections/homepage/benefits/benefits.module.scss b/src/components/sections/homepage/benefits/benefits.module.scss index 7141737..6c86ea3 100644 --- a/src/components/sections/homepage/benefits/benefits.module.scss +++ b/src/components/sections/homepage/benefits/benefits.module.scss @@ -13,8 +13,12 @@ } } + @media screen and (max-width: 1420px) { + padding-bottom: tovw(100px, 'default', 100px); + } + @media screen and (max-width: 1400px) { - padding-bottom: tovw(250px, 'default', 160px); + padding-bottom: tovw(200px, 'default', 200px); } position: relative; diff --git a/src/components/sections/homepage/latest-news/latest-news.module.scss b/src/components/sections/homepage/latest-news/latest-news.module.scss index 93f10fe..f5e8498 100644 --- a/src/components/sections/homepage/latest-news/latest-news.module.scss +++ b/src/components/sections/homepage/latest-news/latest-news.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(115px, 'default', 90px) 0; .slider__container { @include respond-to('mobile') { 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 a3a9a61..d771fda 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 @@ -28,6 +28,7 @@ width: 100%; max-width: tovw(1076px, 'default', 700px); text-transform: capitalize; + padding-bottom: tovw(160px, 'default', 50px); span { @include respond-to('mobile') { @@ -73,7 +74,7 @@ transform-style: preserve-3d; cursor: grab; width: 100%; - height: tovw(950px, 'default', 700px); + height: tovw(650px, 'default', 550px); user-select: none; } diff --git a/src/components/sections/newsroom/hero/hero.module.scss b/src/components/sections/newsroom/hero/hero.module.scss index 969d8fd..2049d03 100644 --- a/src/components/sections/newsroom/hero/hero.module.scss +++ b/src/components/sections/newsroom/hero/hero.module.scss @@ -2,8 +2,9 @@ .section { @include respond-to('mobile') { - margin-bottom: tovw(88px, 'mobile'); - padding: 0; + padding: unset; + padding-bottom: tovw(20px, 'mobile'); + margin-bottom: tovw(18px, 'mobile'); width: 100vw; justify-content: center; } diff --git a/src/components/sections/newsroom/media/media.module.scss b/src/components/sections/newsroom/media/media.module.scss index e183bce..271adaa 100644 --- a/src/components/sections/newsroom/media/media.module.scss +++ b/src/components/sections/newsroom/media/media.module.scss @@ -3,6 +3,7 @@ .section { @include respond-to('mobile') { padding: 0; + margin-bottom: tovw(25px, 'mobile'); } position: relative; diff --git a/src/components/sections/newsroom/press/press.module.scss b/src/components/sections/newsroom/press/press.module.scss index ed3757a..e04f56c 100644 --- a/src/components/sections/newsroom/press/press.module.scss +++ b/src/components/sections/newsroom/press/press.module.scss @@ -3,7 +3,7 @@ .section { @include respond-to('mobile') { margin-top: unset; - padding: tovw(30px, 'mobile', 60px) 0 tovw(40px, 'mobile', 70px) 0; + padding: tovw(25px, 'mobile', 25px) 0 tovw(40px, 'mobile', 50px) 0; } display: flex; diff --git a/src/components/sections/partners/contact/contact.module.scss b/src/components/sections/partners/contact/contact.module.scss index 3785a4b..aa9a189 100644 --- a/src/components/sections/partners/contact/contact.module.scss +++ b/src/components/sections/partners/contact/contact.module.scss @@ -3,13 +3,14 @@ .section { @include respond-to('mobile') { margin-top: 0; + padding-top: tovw(10px, 'mobile'); display: flex; place-content: center; } position: relative; - margin: tovw(105px, 'default', 70px) 0; - padding: tovw(64px, 'default', 55px) 0; + margin: tovw(105px, 'default', 20px) 0; + padding: tovw(24px, 'default', 20px) 0 tovw(64px, 'default', 60px) 0; .container { @include respond-to('mobile') { diff --git a/src/components/sections/partners/hero/hero.module.scss b/src/components/sections/partners/hero/hero.module.scss index 45df23c..0fd12bf 100644 --- a/src/components/sections/partners/hero/hero.module.scss +++ b/src/components/sections/partners/hero/hero.module.scss @@ -2,7 +2,7 @@ .section { @include respond-to('mobile') { - margin-bottom: tovw(88px, 'mobile'); + margin-bottom: tovw(30px, 'mobile'); padding: 0; width: 100vw; justify-content: flex-start; @@ -11,7 +11,7 @@ display: flex; flex-direction: column; justify-content: center; - padding: tovw(100px, 'default', 50px) 0; + padding: tovw(100px, 'default', 50px) 0 tovw(70px, 'default', 50px) 0; max-width: 100%; min-height: calc(var(--vh) * 100); diff --git a/src/components/sections/partners/opportunities/opportunities.module.scss b/src/components/sections/partners/opportunities/opportunities.module.scss index e460abd..7d21e75 100644 --- a/src/components/sections/partners/opportunities/opportunities.module.scss +++ b/src/components/sections/partners/opportunities/opportunities.module.scss @@ -4,6 +4,7 @@ @include respond-to('mobile') { margin-top: 0; padding-bottom: tovw(20px, 'mobile'); + margin-bottom: tovw(20px, 'mobile'); } position: relative; @@ -23,7 +24,7 @@ @include respond-to('mobile') { display: flex; flex-direction: column; - padding-top: tovw(60px, 'tablet', 60px); + padding-top: tovw(40px, 'tablet', 40px); } display: grid; @@ -34,7 +35,7 @@ &:not(:first-child) { @include respond-to('mobile') { - margin-top: tovw(86px, 'tablet', 86px); + margin-top: tovw(60px, 'tablet', 60px); } margin-top: tovw(86px, 'default', 30px); @@ -43,7 +44,7 @@ &:last-child { @include respond-to('mobile') { border-bottom: unset; - padding-bottom: tovw(30px, 'mobile'); + padding-bottom: tovw(20px, 'mobile'); } padding-bottom: tovw(120px, 'default', 60px); diff --git a/src/components/sections/products/app/app.module.scss b/src/components/sections/products/app/app.module.scss index 4b4932d..0f0476c 100644 --- a/src/components/sections/products/app/app.module.scss +++ b/src/components/sections/products/app/app.module.scss @@ -36,6 +36,7 @@ max-width: 550px; margin-top: tovw(20px, 'mobile', 40px); line-height: 1.5; + font-weight: 400; } line-height: 1.35; diff --git a/src/components/sections/products/hero/hero.module.scss b/src/components/sections/products/hero/hero.module.scss index 0078cb3..dadcd15 100644 --- a/src/components/sections/products/hero/hero.module.scss +++ b/src/components/sections/products/hero/hero.module.scss @@ -2,7 +2,7 @@ .section { @include respond-to('mobile') { - margin-bottom: tovw(88px, 'mobile'); + margin-bottom: tovw(60px, 'mobile'); padding: 0; width: 100vw; } @@ -50,7 +50,7 @@ width: 200%; mix-blend-mode: screen; place-self: center; - min-height: tovw(328px, 'mobile', 340px); + min-height: tovw(308px, 'mobile', 310px); mask-image: linear-gradient( 0deg, rgb(255 255 255 / 0) 0%, @@ -70,7 +70,7 @@ display: flex; flex-direction: column; margin-top: tovw(16px, 'default', 10px); - gap: tovw(65px, 'default', 56px); + gap: tovw(65px, 'default', 36px); h1 { @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 34d9e39..078cc69 100644 --- a/src/components/sections/products/stack/stack.module.scss +++ b/src/components/sections/products/stack/stack.module.scss @@ -2,8 +2,8 @@ .section { @include respond-to('mobile') { - padding: 0; - padding-bottom: tovw(40px, 'mobile'); + padding-top: tovw(15px, 'mobile'); + padding-bottom: tovw(15px, 'mobile'); } position: relative; diff --git a/src/components/sections/products/token/token.module.scss b/src/components/sections/products/token/token.module.scss index 7f28b40..8214c04 100644 --- a/src/components/sections/products/token/token.module.scss +++ b/src/components/sections/products/token/token.module.scss @@ -3,7 +3,6 @@ .section { @include respond-to('mobile') { padding: 0; - padding-bottom: tovw(18px, 'mobile'); } position: relative; diff --git a/src/components/sections/products/watchers/watchers.module.scss b/src/components/sections/products/watchers/watchers.module.scss index 06b69e4..d7eef70 100644 --- a/src/components/sections/products/watchers/watchers.module.scss +++ b/src/components/sections/products/watchers/watchers.module.scss @@ -179,7 +179,7 @@ mix-blend-mode: darken; } - .watchers__img__mobile { + .mobile_img_container .watchers__img__mobile { mix-blend-mode: darken; } }