villeneuve-dascq: improve "top-bandeau" layout on desktop (#44572)
* increase carrousel height, * carrousel layout more responsive, * vertical align for tracking-code-cell content,
This commit is contained in:
parent
2654010d8a
commit
60fabdc986
|
@ -200,7 +200,7 @@ div.cell {
|
|||
}
|
||||
}
|
||||
div.carrousel-nav {
|
||||
top: $theme-gutter-mobile*2;
|
||||
top: $theme-gutter-mobile*3;
|
||||
left: $theme-gutter-mobile*2;
|
||||
width: auto;
|
||||
@media ($min-desktop-viewport) {
|
||||
|
@ -226,7 +226,7 @@ div.cell {
|
|||
background-size: 1.5rem;
|
||||
@include arrowIcon($property: background-image);
|
||||
|
||||
top: $theme-gutter;
|
||||
top: $theme-gutter-mobile*2;
|
||||
right: $theme-page-padding;
|
||||
&::after {
|
||||
content: none;
|
||||
|
@ -664,11 +664,16 @@ div.gru-nav {
|
|||
margin-right: $theme-gutter-mobile;
|
||||
margin-left: $theme-gutter-mobile;
|
||||
}
|
||||
@media ($min-desktop-viewport) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.carrousel {
|
||||
// stretch all flex space
|
||||
@media ($min-desktop-viewport) {
|
||||
position: relative;
|
||||
padding-top: 38%;
|
||||
> div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
@ -684,9 +689,6 @@ div.gru-nav {
|
|||
// Desktop layout
|
||||
@media ($min-desktop-viewport) {
|
||||
display: flex;
|
||||
& > .cell:first-child {
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
& > .cell:last-child {
|
||||
flex: 0 0 calc( (100% - #{$theme-gutter}) / 3 );
|
||||
@media (min-width: $width + 1) {
|
||||
|
@ -694,6 +696,9 @@ div.gru-nav {
|
|||
|
||||
}
|
||||
}
|
||||
& > .cell:first-child {
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue