responsive: blabla ok, pricing first page ok
This commit is contained in:
parent
d72e102cc5
commit
5fb69e008d
|
@ -19717,7 +19717,7 @@ header[role="banner"] {
|
|||
padding: 1em 0 0; }
|
||||
body.path-frontpage header[role="banner"] #block-pagetitle, body.path-home header[role="banner"] #block-pagetitle {
|
||||
display: none; }
|
||||
header[role="banner"] #block-pagetitle h2 {
|
||||
body.path-base header[role="banner"] #block-pagetitle h2 {
|
||||
padding: 0.5em 1em 0 !important; } }
|
||||
header[role="banner"] #block-pagetitle h2 {
|
||||
margin: 0;
|
||||
|
@ -20175,7 +20175,7 @@ article.node--type-frontpage .node__content > section.home-pricing .field--name-
|
|||
width: 100%;
|
||||
height: auto;
|
||||
box-shadow: none; }
|
||||
.cards-list > ul > li > article > section.images {
|
||||
#base .cards-list > ul > li > article > section.images {
|
||||
height: auto; }
|
||||
.cards-list > ul > li > article > section.images > figure {
|
||||
position: relative; }
|
||||
|
@ -20581,6 +20581,7 @@ article.card {
|
|||
font-size: 0.756em;
|
||||
font-weight: 400; }
|
||||
|
||||
@media (min-width: 655px) {
|
||||
#main-content > article.article div.cols {
|
||||
display: grid;
|
||||
grid-template-rows: 1fr;
|
||||
|
@ -20589,7 +20590,14 @@ article.card {
|
|||
#main-content > article.article div.cols div.col-left {
|
||||
grid-column: 1; }
|
||||
#main-content > article.article div.cols div.col-right {
|
||||
grid-column: 2/6; }
|
||||
grid-column: 2/6; } }
|
||||
|
||||
@media (max-width: 654px) {
|
||||
#main-content > article.article div.cols {
|
||||
padding: 1em;
|
||||
box-sizing: border-box; }
|
||||
#main-content > article.article div.cols .accroche figure {
|
||||
width: 100%; } }
|
||||
|
||||
#main-content > article.article section.accroche figure {
|
||||
width: 423px;
|
||||
|
@ -20612,13 +20620,24 @@ article.card {
|
|||
height: 147.5px;
|
||||
background-size: cover; }
|
||||
|
||||
@media (max-width: 654px) {
|
||||
#main-content > article.article div.gallery-wrapper {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-between; }
|
||||
#main-content > article.article div.gallery-wrapper .image {
|
||||
display: block;
|
||||
flex: 0 1 48%;
|
||||
margin: 0 0 7.8px 0; } }
|
||||
|
||||
@media (min-width: 655px) {
|
||||
#main-content > article.article aside.linked-materials ul {
|
||||
width: calc(100% + 13px); }
|
||||
#main-content > article.article aside.linked-materials ul li {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 205px;
|
||||
margin: 0 13px 13px 0; }
|
||||
margin: 0 13px 13px 0; } }
|
||||
|
||||
#main-content > article.article aside.linked-materials h3.field__label {
|
||||
font-size: 1em;
|
||||
|
@ -20637,6 +20656,10 @@ article.card {
|
|||
font-size: 0.756em;
|
||||
font-weight: 400; }
|
||||
|
||||
@media (max-width: 654px) {
|
||||
#main-content > article.article nav.prevnext {
|
||||
padding: 0 1em; } }
|
||||
|
||||
#main-content > article.article nav.prevnext.bottom {
|
||||
margin: 2em 0; }
|
||||
|
||||
|
@ -20652,16 +20675,24 @@ article.card {
|
|||
list-style: none; }
|
||||
#main-content > article.article nav.prevnext li a {
|
||||
font-size: 0.756em;
|
||||
font-weight: 700; }
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 0 1em; }
|
||||
#main-content > article.article nav.prevnext li:nth-child(1) {
|
||||
grid-column: 1; }
|
||||
#main-content > article.article nav.prevnext li:nth-child(1) a:before {
|
||||
content: '< '; }
|
||||
content: '\021A4';
|
||||
position: absolute;
|
||||
left: 0; }
|
||||
#main-content > article.article nav.prevnext li:nth-child(2) {
|
||||
grid-column: 2;
|
||||
text-align: right; }
|
||||
#main-content > article.article nav.prevnext li:nth-child(2) a:after {
|
||||
content: ' >'; }
|
||||
content: '\021A6';
|
||||
position: absolute;
|
||||
right: 0; }
|
||||
|
||||
#showrooms {
|
||||
width: calc(100% + 13px); }
|
||||
|
@ -20794,6 +20825,15 @@ article.card {
|
|||
#main-content .view-pricing-products .view-content article.product:nth-child(2) aside .variation button,
|
||||
#main-content .view-pricing-products .view-content .views-row:nth-child(2) aside .variation button {
|
||||
color: #ff9f50; }
|
||||
@media (max-width: 654px) {
|
||||
#main-content > #pricing,
|
||||
#main-content .view-pricing-products .view-content {
|
||||
flex-flow: column; }
|
||||
#main-content > #pricing article.product,
|
||||
#main-content > #pricing .views-row,
|
||||
#main-content .view-pricing-products .view-content article.product,
|
||||
#main-content .view-pricing-products .view-content .views-row {
|
||||
flex: 0 1 auto; } }
|
||||
|
||||
.modal {
|
||||
position: relative; }
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -527,10 +527,13 @@ header[role="banner"]{
|
|||
display: none;
|
||||
}
|
||||
padding: 1em 0 0;
|
||||
body.path-base &{
|
||||
h2{
|
||||
padding: 0.5em 1em 0!important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
h2{
|
||||
margin:0;
|
||||
font-size: 1.512em;
|
||||
|
@ -1240,7 +1243,9 @@ article.node--type-frontpage{
|
|||
height:auto;
|
||||
box-shadow: none;
|
||||
>section.images{
|
||||
#base &{
|
||||
height: auto;
|
||||
}
|
||||
>figure{
|
||||
position: relative;
|
||||
&:not(:first-child){
|
||||
|
@ -1831,6 +1836,8 @@ article.card{
|
|||
}
|
||||
|
||||
#main-content > article.article{
|
||||
// grid only on big screens
|
||||
@include col-mediaquery-min(3){
|
||||
div.cols{
|
||||
display: grid;
|
||||
grid-template-rows: 1fr;
|
||||
|
@ -1843,6 +1850,20 @@ article.card{
|
|||
grid-column: 2/6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include col-mediaquery-max(3){
|
||||
div.cols{
|
||||
padding:1em;
|
||||
box-sizing: border-box;
|
||||
.accroche{
|
||||
figure{
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.accroche{
|
||||
figure{
|
||||
width:$column_width*2 + $column_goutiere;
|
||||
|
@ -1870,6 +1891,17 @@ article.card{
|
|||
height:$card_height / 2;
|
||||
background-size: cover;
|
||||
}
|
||||
@include col-mediaquery-max(3){
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-between;
|
||||
.image{
|
||||
// width: auto; height: auto;
|
||||
display: block;
|
||||
flex: 0 1 48%;
|
||||
margin: 0 0 $column_goutiere*0.6 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
// section.videos{
|
||||
// ul{
|
||||
|
@ -1900,6 +1932,8 @@ article.card{
|
|||
// }
|
||||
// }
|
||||
aside.linked-materials{
|
||||
|
||||
@include col-mediaquery-min(3){
|
||||
ul{
|
||||
width:calc(100% + #{$column_goutiere});
|
||||
li{
|
||||
|
@ -1909,6 +1943,7 @@ article.card{
|
|||
margin:0 $column_goutiere $column_goutiere 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
h3.field__label{
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
|
@ -1928,6 +1963,10 @@ article.card{
|
|||
}
|
||||
}
|
||||
nav.prevnext{
|
||||
|
||||
@include col-mediaquery-max(3){
|
||||
padding: 0 1em;
|
||||
}
|
||||
&.bottom{
|
||||
margin:2em 0;
|
||||
}
|
||||
|
@ -1944,18 +1983,26 @@ article.card{
|
|||
a{
|
||||
font-size: 0.756em;
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 0 1em;
|
||||
}
|
||||
&:nth-child(1){
|
||||
grid-column: 1;
|
||||
a:before{
|
||||
content:'< ';
|
||||
content:'\021A4';
|
||||
position: absolute;
|
||||
left:0;
|
||||
}
|
||||
}
|
||||
&:nth-child(2){
|
||||
grid-column: 2;
|
||||
text-align: right;
|
||||
a:after{
|
||||
content:' >';
|
||||
content:'\021A6';
|
||||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1998,6 +2045,7 @@ article.card{
|
|||
#main-content .view-pricing-products .view-content{
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
|
||||
article.product,
|
||||
.views-row{
|
||||
flex:0 0 50%;
|
||||
|
@ -2059,6 +2107,13 @@ article.card{
|
|||
}
|
||||
}
|
||||
}
|
||||
@include col-mediaquery-max(3){
|
||||
flex-flow: column;
|
||||
article.product,
|
||||
.views-row{
|
||||
flex:0 1 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modal{
|
||||
|
|
|
@ -81,7 +81,7 @@
|
|||
</div>
|
||||
<aside class="linked-materials">
|
||||
<h3 class="field__label">{{$t("materio.Linked Materials")}}</h3>
|
||||
<div class="card-list">
|
||||
<div class="cards-list">
|
||||
<ul class="">
|
||||
<li v-for="node in article.linked_materials" v-bind:key="node.id">
|
||||
<Card :item="node" />
|
||||
|
|
Loading…
Reference in New Issue