add to cart links for products in home

This commit is contained in:
2021-06-09 13:06:52 +02:00
parent d9d2180f94
commit 352223500f
25 changed files with 561 additions and 249 deletions
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
@@ -1,8 +1,83 @@
.overlay[data-v-b98ce164]{background-color:rgba(0,0,0,0.8);position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999}.modal[data-v-b98ce164]{background-color:#fff;position:absolute;box-sizing:border;max-width:80vw;max-height:70vh;top:0;right:0;bottom:0;left:0;margin:auto;padding:1em;border-radius:3px;box-shadow:2px 2px}
.overlay[data-v-b98ce164] {
background-color: rgba(0, 0, 0, 0.8);
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 99999;
}
.modal[data-v-b98ce164] {
background-color: #fff;
position: absolute;
box-sizing: border;
max-width: 80vw;
max-height: 70vh;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
padding: 1em;
border-radius: 3px;
box-shadow: 2px 2px;
}
.form-item[data-v-7bb795f8],.form-actions[data-v-7bb795f8]{display:inline-block;max-width:32%;margin:0}input[data-v-7bb795f8]{box-sizing:border-box;max-width:100%}div.description[data-v-7bb795f8]{display:none}.form-item-persistent-login[data-v-7bb795f8]{display:none}
.form-item[data-v-7bb795f8],
.form-actions[data-v-7bb795f8] {
display: inline-block;
max-width: 32%;
margin: 0;
}
input[data-v-7bb795f8] {
box-sizing: border-box;
max-width: 100%;
}
div.description[data-v-7bb795f8] {
display: none;
}
.form-item-persistent-login[data-v-7bb795f8] {
display: none;
}
.form-type-email[data-v-2acc57a0],.form-type-password-confirm[data-v-2acc57a0]{max-width:30%;margin:0}.form-type-password input.weak[data-v-2acc57a0]{border-width:2px;border-color:red !important}.form-type-password input.weak[data-v-2acc57a0]:focus{outline:none}.form-type-password input.medium[data-v-2acc57a0]{border-width:2px;border-color:orange !important}.form-type-password input.medium[data-v-2acc57a0]:focus{outline:none}.form-type-password input.strong[data-v-2acc57a0]{border-width:2px;border-color:green !important}.form-type-password input.strong[data-v-2acc57a0]:focus{outline:none}input[data-v-2acc57a0]{box-sizing:content-box;max-width:100%}label[data-v-2acc57a0],div.description[data-v-2acc57a0]{display:none}
.form-type-email[data-v-2acc57a0],
.form-type-password-confirm[data-v-2acc57a0] {
max-width: 30%;
margin: 0;
}
.form-type-password input.weak[data-v-2acc57a0] {
border-width: 2px;
border-color: red !important;
}
.form-type-password input.weak[data-v-2acc57a0]:focus {
outline: none;
}
.form-type-password input.medium[data-v-2acc57a0] {
border-width: 2px;
border-color: orange !important;
}
.form-type-password input.medium[data-v-2acc57a0]:focus {
outline: none;
}
.form-type-password input.strong[data-v-2acc57a0] {
border-width: 2px;
border-color: green !important;
}
.form-type-password input.strong[data-v-2acc57a0]:focus {
outline: none;
}
input[data-v-2acc57a0] {
box-sizing: content-box;
max-width: 100%;
}
label[data-v-2acc57a0],
div.description[data-v-2acc57a0] {
display: none;
}
fieldset[data-v-340aa566]{padding:0;margin:0;border:none}
fieldset[data-v-340aa566] {
padding: 0;
margin: 0;
border: none;
}
Binary file not shown.
File diff suppressed because one or more lines are too long
@@ -1239,37 +1239,22 @@ article.node--type-frontpage{
.field--name-computed-products-reference{
display: flex;
flex-flow: row nowrap;
@include col-mediaquery-max(3){
@include col-mediaquery-max(5){
flex-flow: column;
justify-content: flex-start;
}
>.field__item{
flex:0 0 50%;
flex:0 0 33%;
text-align: center;
padding: 2em 0;
a.btn{
@include btn;
background-color: #fff;
}
&:nth-child(1){
background-color: $color-base;
a.btn{
color: $color-base;
}
}
&:nth-child(2){
background-color: $color-webshowroom;
a.btn{
color: $color-webshowroom;
}
}
color: #fff;
color: #fff;
position: relative;
height:18em;
height:23em;
>article{
position: absolute;
top:50%; left:50%;
transform: translate(-50%, -50%);
width:80%;
}
.field--name-title{
@extend %front-col-field__label;
@@ -1286,8 +1271,77 @@ article.node--type-frontpage{
margin: 0;
}
}
.field--name-variations{
.field__item{
>div{
display: flex;
flex-direction: row;
justify-content: center;
align-items: baseline;
.form-actions,p{
margin:0;
}
.field--name-field-description{
margin-right: 0.5em;
p{
font-size: 1.512em;
font-weight: 800;
color: #fff;
white-space: nowrap;
text-align: right;
}
}
input.button--add-to-cart{
@include btn;
}
}
}
}
a.btn{
@include btn;
background-color: #fff;
}
&:nth-child(1){
background-color: $color-base;
a.btn{
color: $color-base;
}
.field--name-variations{
.field__item{
>div{
input.button--add-to-cart{
color: $color-base;
}
}
}
}
}
&:nth-child(2){
background-color: $color-webshowroom;
a.btn{
color: $color-webshowroom;
}
.field--name-variations{
.field__item{
>div{
input.button--add-to-cart{
color: $color-webshowroom;
}
}
}
}
}
&:nth-child(3){
background-color: $color-showrooms;
a.btn{
color: $color-showrooms;
}
>article{
max-width: 345px;
}
}
@include col-mediaquery-max(3){
@include col-mediaquery-max(5){
flex: 0 0 auto;
padding:0;
// height: auto;
@@ -2176,7 +2230,7 @@ article.card{
article.product,
.views-row{
flex:0 0 50%;
flex:0 0 33%;
text-align: center;
padding: 2em 0;
>header{
@@ -2233,6 +2287,12 @@ article.card{
aside .variation button{
color: $color-webshowroom;
}
}
&:nth-child(3){
background-color: $color-showrooms;
aside .variation button{
color: $color-showrooms;
}
}
}
@include col-mediaquery-max(3){
@@ -2247,99 +2307,128 @@ article.card{
.modal{
position: relative;
}
#pricing-modal-login-register{
position: relative;
width: 100%;
text-align: left;
h2{
margin: 0.4em 0 1.1em;
padding-right: 4em;
font-size: 1.2em;
font-weight: 300;
}
// #pricing-modal-login-register{
// position: relative;
// width: 100%;
// text-align: left;
//
// .vm--modale-loginregister{
// }
#login-register{
width: 100%;
display: flex;
flex-flow: row nowrap;
>section{
flex:0 0 250px;
form{
.form-item, .form-actions {
margin: 0.5em 0;
max-width: none;
}
.form-type-email,
.form-type-password,
.form-actions{
display:block;
}
input[type="email"],
input[type="password"]{
max-width: 11em;
}
&#user-login-form #edit-pass--description,
#edit-pass-pass1--description{
display: block;
max-width: 16em;
font-size: 0.693em;
}
span.login-message,
span.register-message{
color: red;
font-size: 0.693em;
line-height: 1.2;
display: block;
padding: 0.8em 0 0 0;
}
span.login-message[v-if="loginMessage"],
span.register-message[v-if="registerMessage"]{
display: none;
}
}
}
section.login{
form{
>div{
// display: block;
}
}
}
section.register{
}
}
@include col-mediaquery-max(3){
height:100%;
overflow-y: auto;
#login-register{
flex-flow: column;
padding: 1em;
box-sizing: content-box;
width: 100%;
h2{
margin: 0.4em 0 1.1em;
padding-right: 4em;
font-size: 1.2em;
font-weight: 300;
}
>div.wrapper{
display: flex;
flex-flow: row nowrap;
>section{
flex:0 0 auto;
form{
input[type="email"],
flex:0 0 50%;
form{
.form-item, .form-actions {
margin: 0.5em 0;
max-width: none;
}
.form-type-email,
.form-type-password,
.form-actions{
display:block;
}
input[type="email"],
input[type="password"]{
max-width: 90%;
width: 90%;
max-width: 11em;
}
&#user-login-form #edit-pass--description,
#edit-pass-pass1--description{
max-width: 90%;
width: 90%;
display: block;
max-width: 16em;
font-size: 0.693em;
}
}
&.login{
padding-bottom: 0.5em;
span.login-message,
span.register-message{
color: red;
font-size: 0.693em;
line-height: 1.2;
display: block;
padding: 0.8em 0 0 0;
}
span.login-message[v-if="loginMessage"],
span.register-message[v-if="registerMessage"]{
display: none;
}
}
}
section.login{
form{
>div{
// display: block;
}
}
}
section.register{
}
@include col-mediaquery-max(3){
flex-flow: column;
>section{
flex:0 0 auto;
form{
input[type="email"],
input[type="password"]{
max-width: 90%;
width: 90%;
}
&#user-login-form #edit-pass--description,
#edit-pass-pass1--description{
max-width: 90%;
width: 90%;
}
}
&.login{
padding-bottom: 0.5em;
}
}
}
}
}
@include col-mediaquery-max(4, landscape){
h2{
margin: 0 0 0.5em;
}
}
}
// @include col-mediaquery-max(3){
// height:100%;
// overflow-y: auto;
// #login-register{
// flex-flow: column;
// >section{
// flex:0 0 auto;
// form{
// input[type="email"],
// input[type="password"]{
// max-width: 90%;
// width: 90%;
// }
// &#user-login-form #edit-pass--description,
// #edit-pass-pass1--description{
// max-width: 90%;
// width: 90%;
// }
// }
// &.login{
// padding-bottom: 0.5em;
// }
// }
// }
// }
// @include col-mediaquery-max(4, landscape){
// h2{
// margin: 0 0 0.5em;
// }
// }
// }
#pricing{
@include col-mediaquery-max(3){
.overlay > .modal{