flayks/housesof
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Place: Add @1x desktop illustration size, Optimize responsive
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Félix Péault
2020-04-11 19:33:37 +02:00
parent 90bdb5890d
commit 7180419fb0
9 changed files with 62 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/style/pages/_place.scss
View File

@@ -22,7 +22,7 @@
@include breakpoint (sm) {
flex-direction: row;
align-items: flex-end;
padding: pxVW(208) 0 pxVW(320);
padding: pxVW(240) 0 pxVW(288); // 528
height: auto;
max-height: none;
}
@@ -165,9 +165,12 @@
position: absolute;
z-index: 0;
top: 0;
left: 0;
left: 50%;
width: 100%;
max-width: 1920px;
height: 100%;
transform: translateX(-50%);
transform-origin: 0 0;
background-image: var(--url-mobile);
background-position: 0 0;
background-repeat: no-repeat;
@@ -177,22 +180,9 @@
@include breakpoint (sm) {
background-image: var(--url-desktop);
}
// Gradient on top
&:before {
content: "";
width: 100%;
height: 60vw;
display: block;
position: absolute;
bottom: 0;
left: 0;
background: linear-gradient(180deg, rgba($color-primary, 0%) 0%, $color-primary 100%);
@include breakpoint (lg) {
height: 50%;
min-height: 600px;
}
@media (min-width: $screen-sm) and (-webkit-min-device-pixel-ratio: 2),
(min-width: $screen-sm) and (min-resolution: 192dpi) {
background-image: var(--url-desktop-2x);
}
}
}