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