General styles

This commit is contained in:
Fede Álvarez 2022-06-01 16:05:09 +02:00
parent 9a26a926df
commit 47f256445d
3 changed files with 14 additions and 11 deletions

View File

@ -106,8 +106,6 @@
&::before {
width: 100%;
opacity: 1;
// width: 90%;
transition: all var(--duration-normal) var(--ease);
}
}
@ -125,7 +123,7 @@
}
&::before {
top: 102%;
top: 105%;
}
}
}

View File

@ -3,7 +3,7 @@
.switch {
position: relative;
display: inline-block;
width: tovw(24px, 'default', 24px);
width: tovw(26px, 'default', 26px);
height: tovw(15px, 'default', 15px);
}
@ -22,7 +22,7 @@
bottom: 0;
background-color: var(--color-black);
border-radius: tovw(100px, 'default', 100px);
border: tovw(1px, 'default', 1px) solid var(--color-white);
border: tovw(2px, 'default', 2px) solid var(--color-white);
transition: var(--normal-transition);
}
@ -31,19 +31,19 @@
content: '';
height: tovw(9px, 'default', 9px);
width: tovw(9px, 'default', 9px);
left: tovw(2px, 'default', 2px);
bottom: tovw(2px, 'default', 2px);
left: tovw(1px, 'default', 1px);
bottom: tovw(1px, 'default', 1px);
background-color: white;
border-radius: 50%;
transition: var(--normal-transition);
}
input:checked + .slider {
border: tovw(1px, 'default', 1px) solid var(--color-black);
border: tovw(2px, 'default', 2px) solid var(--color-black);
background-color: var(--color-white);
}
input:checked + .slider::before {
background-color: var(--color-black);
transform: translateX(tovw(10px, 'default', 10px));
transform: translateX(tovw(11.5px, 'default', 11px));
}

View File

@ -1,6 +1,10 @@
@import '~/css/helpers';
.section {
@include respond-to('mobile') {
margin-bottom: tovw(30px, 'mobile');
}
position: relative;
margin-top: tovw(24px, 'default', 16px);
padding: tovw(104px, 'default', 72px) 0 0 0;
@ -63,12 +67,13 @@
display: flex;
align-items: center;
justify-content: center;
margin-bottom: tovw(150px, 'default', 100px);
perspective: tovw(3000px);
transform: rotateX(-15deg) scale(0.85) translateY(0%);
transform-style: preserve-3d;
cursor: grab;
width: 100%;
height: 100vh;
height: tovw(1100px, 'default', 700px);
user-select: none;
}
@ -99,7 +104,7 @@
.image {
position: absolute;
left: tovw(10px, 'mobile');
left: tovw(35px, 'mobile');
transform: none;
z-index: -1;
width: 85%;