bachir/materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

refactored front pricing to use graphql, refactored to add 2 products (web & web+showroom) each one with 2 variations (monthly, annual)

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2021-01-04 22:11:11 +01:00
parent 830f5a5909
commit 7f027f322c
15 changed files with 967 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
web/themes/custom/materiotheme/assets/styles/main.scss
View File

@@ -356,6 +356,10 @@ header[role="banner"]{
color: #fff;
background-color: $color-base;
}
body.path-pricing & {
color: #fff;
background-color: $color-webshowroom;
}
}
}
@@ -483,13 +487,25 @@ aside.messages{
// | _| '_/ _ \ ' \ _|
// |_| |_| \___/_||_\__|
@mixin btn{
display: inline-block;
font-size: 0.9em;
font-weight: bold;
padding: 0.7em 1em;
margin-bottom: 0.3em;
background-color: #fff;
color: #000;
border-radius: 5px;
border: none;
}
article.node--type-frontpage{
%front-col-field__label{
font-size: 3.5em;
line-height: 1;
}
%front-col-descritpion{
%front-col-description{
font-size: 0.9em;
line-height: 1.3;
}
@@ -505,7 +521,7 @@ article.node--type-frontpage{
@extend %front-col-field__label;
}
.field__item{
@extend %front-col-descritpion;
@extend %front-col-description;
}
}
}
@@ -522,7 +538,7 @@ article.node--type-frontpage{
// @extend %front-col-field__label;
// }
// .field__item{
// @extend %front-col-descritpion;
// @extend %front-col-description;
// }
// }
// >div:nth-child(2){
@@ -543,7 +559,7 @@ article.node--type-frontpage{
@extend %front-col-field__label;
}
.field__item{
@extend %front-col-descritpion;
@extend %front-col-description;
}
}
>div:nth-child(2){
@@ -559,17 +575,6 @@ article.node--type-frontpage{
.node__content{
@mixin btn{
display: inline-block;
font-size: 0.9em;
font-weight: bold;
padding: 0.7em 1em;
margin-bottom: 0.3em;
background-color: #fff;
color: #000;
border-radius: 5px;
}
&>section{
&.home-intro{
@extend %part-centered-layout;
@@ -882,7 +887,7 @@ article.node--type-frontpage{
word-spacing: 30000px;
}
.field--name-field-description{
@extend %front-col-descritpion;
@extend %front-col-description;
padding:0.5em;
p{
margin: 0;
@@ -1135,7 +1140,6 @@ article.card{
}
}
// _____ _ _ _
// |_ _| |_ ___ _ __ __ _| |_(_)__ _ _ _ ___
// | | | ' \/ -_) ' \/ _` | _| / _` | || / -_)
@@ -1192,11 +1196,10 @@ article.card{
}
// ___ _ _ _
// | _ ) |__ _| |__| |__ _
// | _ \ / _` | '_ \ / _` |
// |___/_\__,_|_.__/_\__,_|
// ___ _ _ _
// | _ ) |__ _| |__| |__ _
// | _ \ / _` | '_ \ / _` |
// |___/_\__,_|_.__/_\__,_|
#blabla{
}
@@ -1333,10 +1336,10 @@ article.card{
}
}
// ___ _
// / __| |_ _____ __ ___ _ ___ ___ _ __ ___
// \__ \ ' \/ _ \ V V / '_/ _ \/ _ \ ' \(_-<
// |___/_||_\___/\_/\_/|_| \___/\___/_|_|_/__/
// ___ _
// / __| |_ _____ __ ___ _ ___ ___ _ __ ___
// \__ \ ' \/ _ \ V V / '_/ _ \/ _ \ ' \(_-<
// |___/_||_\___/\_/\_/|_| \___/\___/_|_|_/__/
#showrooms{
width: calc(100% + #{$column_goutiere});
article.showroom{
@@ -1360,7 +1363,59 @@ article.card{
}
// ___ _ _
// | _ \_ _(_)__(_)_ _ __ _
// | _/ '_| / _| | ' \/ _` |
// |_| |_| |_\__|_|_||_\__, |
// |___/
#main-content>#pricing,
#main-content .view-pricing-products .view-content{
display: flex;
flex-flow: row nowrap;
article.product,
.views-row{
flex: auto;
// flex:0 0 50%;
text-align: center;
padding: 2em 0;
>header h1,
.views-field-title{
font-size: 4em;
line-height: 1;
color: #fff;
}
section.content,
.views-field-body{
color: #fff;
.description{
@extend %front-col-description;
p{
margin: 0;
}
}
span.price{
font-size: 2em;
font-weight: 700;
}
}
button{
@include btn;
background-color: #fff;
}
&:nth-child(1){
background-color: $color-base;
button{
color: $color-base;
}
}
&:nth-child(2){
background-color: $color-webshowroom;
button{
color: $color-webshowroom;
}
}
}
}
// ___ _
// | __|__ ___| |_ ___ _ _
// | _/ _ \/ _ \ _/ -_) '_|