Fix some responsive and scrolling issues
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
@@ -60,7 +60,6 @@ export const animateIn = scope => {
|
|||||||
})
|
})
|
||||||
window.addEventListener('scroll', throttle(() => parallaxAnime(el, translate), 50))
|
window.addEventListener('scroll', throttle(() => parallaxAnime(el, translate), 50))
|
||||||
setTimeout(() => parallaxAnime(el, translate), 50)
|
setTimeout(() => parallaxAnime(el, translate), 50)
|
||||||
console.log('show')
|
|
||||||
},
|
},
|
||||||
onHidden () {
|
onHidden () {
|
||||||
if (parallaxAnime) window.removeEventListener('scroll', parallaxAnime)
|
if (parallaxAnime) window.removeEventListener('scroll', parallaxAnime)
|
||||||
|
|||||||
@@ -112,11 +112,8 @@ button {
|
|||||||
|
|
||||||
// Bigger version
|
// Bigger version
|
||||||
&--big {
|
&--big {
|
||||||
font-size: rem(40px);
|
font-size: pxVW(180);
|
||||||
|
|
||||||
@include breakpoint (m) {
|
|
||||||
font-size: rem(56px);
|
|
||||||
}
|
|
||||||
@include breakpoint (sm) {
|
@include breakpoint (sm) {
|
||||||
font-size: pxVW(160);
|
font-size: pxVW(160);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -205,8 +205,8 @@
|
|||||||
** Big version
|
** Big version
|
||||||
*/
|
*/
|
||||||
&--big {
|
&--big {
|
||||||
width: 72px;
|
width: 88px;
|
||||||
height: 72px;
|
height: 88px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
||||||
@include breakpoint (sm) {
|
@include breakpoint (sm) {
|
||||||
@@ -225,7 +225,7 @@
|
|||||||
color: rgba(#fff, 0.3);
|
color: rgba(#fff, 0.3);
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
font-family: $font-sans-sb;
|
font-family: $font-sans-sb;
|
||||||
font-size: rem(6px);
|
font-size: rem(8px);
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
|
|
||||||
@@ -247,14 +247,15 @@
|
|||||||
|
|
||||||
// Big Dashed
|
// Big Dashed
|
||||||
&.button-control--dashed {
|
&.button-control--dashed {
|
||||||
@include breakpoint (xs) {
|
// Icon
|
||||||
svg[fill] {
|
svg[fill] {
|
||||||
width: 24px;
|
@include breakpoint (xs) {
|
||||||
|
width: 28px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
// Circle
|
||||||
@include breakpoint (sm) {
|
|
||||||
circle {
|
circle {
|
||||||
|
@include breakpoint (sm) {
|
||||||
stroke-width: 4.5;
|
stroke-width: 4.5;
|
||||||
stroke-dasharray: 20, 8;
|
stroke-dasharray: 20, 8;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,4 +10,10 @@
|
|||||||
margin-bottom: 120px;
|
margin-bottom: 120px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Browse
|
||||||
|
.browse {
|
||||||
|
padding-left: 0;
|
||||||
|
padding-right: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -44,6 +44,7 @@
|
|||||||
|
|
||||||
@include breakpoint (sm) {
|
@include breakpoint (sm) {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-bottom: pxVW(232);
|
margin-bottom: pxVW(232);
|
||||||
margin-top: 112px;
|
margin-top: 112px;
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
.photos {
|
.photos {
|
||||||
|
overflow: hidden;
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-top: -22px;
|
margin-top: -22px;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
|||||||
@@ -184,7 +184,12 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
background: linear-gradient(180deg, transparent 0%, $color-primary 100%);
|
background: linear-gradient(180deg, rgba($color-primary, 0%) 0%, $color-primary 100%);
|
||||||
|
|
||||||
|
@include breakpoint (lg) {
|
||||||
|
height: 50%;
|
||||||
|
min-height: 600px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user