LaconicNetwork/laconic.com
6
0
Fork 0
mirror of https://github.com/LaconicNetwork/laconic.com.git synced 2026-02-28 18:54:09 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

General style changes

Browse Source
This commit is contained in:
Fede Álvarez 2022-07-01 13:19:09 +02:00
parent 79e26149c2
commit edff569d4d
36 changed files with 125 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/common/footer/footer.module.scss
View File

@ -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 {

13
src/components/common/header/header.module.scss
View File

@ -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;
}
}
}

12
src/components/primitives/link/link.module.scss
View File

@ -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;
}
}
}
}

5
src/components/sections/about/hero/hero.module.scss
View File

@ -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') {

4
src/components/sections/about/related/related.module.scss
View File

@ -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) {

2
src/components/sections/about/roadmap/roadmap.module.scss
View File

@ -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') {

10
src/components/sections/about/whitepaper/whitepaper.module.scss
View File

@ -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;

9
src/components/sections/blog/hero/hero.module.scss
View File

@ -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);

8
src/components/sections/blog/post-content/content.module.scss
View File

@ -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);

11
src/components/sections/blog/post-hero/hero.module.scss
View File

@ -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);

2
src/components/sections/blog/posts-grid/posts-grid.module.scss
View File

@ -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;
}

7
src/components/sections/blog/shares/shares.module.scss
View File

@ -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;

11
src/components/sections/careers/hero/hero.module.scss
View File

@ -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%);
}
}

10
src/components/sections/careers/positions/positions.module.scss
View File

@ -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') {

2
src/components/sections/careers/values/values.module.scss
View File

@ -7,7 +7,7 @@
}
position: relative;
padding: tovw(180px, 'default', 100px) 0;
padding: tovw(100px, 'default', 60px) 0;
.container {
@include respond-to('mobile') {

3
src/components/sections/careers/why/why.module.scss
View File

@ -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 {

30
src/components/sections/community/events/events.module.scss
View File

@ -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%
);
}
}

4
src/components/sections/community/events/index.tsx
View File

@ -53,8 +53,8 @@ const Events = ({ eventsData, data }: Props) => {
})
return (
<Section className={s['section']} id="events">
<Container className={s['container']}>
<Section className={s['section']}>
<Container className={s['container']} id="events">
<div className={s['header']}>
<Heading as="h2" variant="lg">
{data?.eventsHeading}

3
src/components/sections/community/hero/hero.module.scss
View File

@ -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;

8
src/components/sections/community/socials/socials.module.scss
View File

@ -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;
}

3
src/components/sections/contact/form/form.module.scss
View File

@ -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;

2
src/components/sections/contact/hero/hero.module.scss
View File

@ -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;

6
src/components/sections/homepage/benefits/benefits.module.scss
View File

@ -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;

2
src/components/sections/homepage/latest-news/latest-news.module.scss
View File

@ -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') {

3
src/components/sections/homepage/what-others-say/what-others-say.module.scss
View File

@ -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;
}

5
src/components/sections/newsroom/hero/hero.module.scss
View File

@ -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;
}

1
src/components/sections/newsroom/media/media.module.scss
View File

@ -3,6 +3,7 @@
.section {
@include respond-to('mobile') {
padding: 0;
margin-bottom: tovw(25px, 'mobile');
}
position: relative;

2
src/components/sections/newsroom/press/press.module.scss
View File

@ -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;

5
src/components/sections/partners/contact/contact.module.scss
View File

@ -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') {

4
src/components/sections/partners/hero/hero.module.scss
View File

@ -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);

7
src/components/sections/partners/opportunities/opportunities.module.scss
View File

@ -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);

1
src/components/sections/products/app/app.module.scss
View File

@ -36,6 +36,7 @@
max-width: 550px;
margin-top: tovw(20px, 'mobile', 40px);
line-height: 1.5;
font-weight: 400;
}
line-height: 1.35;

6
src/components/sections/products/hero/hero.module.scss
View File

@ -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') {

4
src/components/sections/products/stack/stack.module.scss
View File

@ -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;

1
src/components/sections/products/token/token.module.scss
View File

@ -3,7 +3,6 @@
.section {
@include respond-to('mobile') {
padding: 0;
padding-bottom: tovw(18px, 'mobile');
}
position: relative;

2
src/components/sections/products/watchers/watchers.module.scss
View File

@ -179,7 +179,7 @@
mix-blend-mode: darken;
}
.watchers__img__mobile {
.mobile_img_container .watchers__img__mobile {
mix-blend-mode: darken;
}
}