added product vairations buttons on frontpage

This commit is contained in:
Bachir Soussi Chiadmi 2021-01-04 14:31:29 +01:00
parent 8a58ef9f47
commit dfe6a21021
3 changed files with 52 additions and 1 deletions

View File

@ -1731,10 +1731,24 @@ article.node--type-frontpage .node__content > section.home-pricing .field--name-
color: #fff;
position: relative;
height: 18em; }
article.node--type-frontpage .node__content > section.home-pricing .field--name-computed-products-reference > .field__item a.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;
background-color: #fff; }
article.node--type-frontpage .node__content > section.home-pricing .field--name-computed-products-reference > .field__item:nth-child(1) {
background-color: #69cdcf; }
article.node--type-frontpage .node__content > section.home-pricing .field--name-computed-products-reference > .field__item:nth-child(1) a.btn {
color: #69cdcf; }
article.node--type-frontpage .node__content > section.home-pricing .field--name-computed-products-reference > .field__item:nth-child(2) {
background-color: #ff9f50; }
article.node--type-frontpage .node__content > section.home-pricing .field--name-computed-products-reference > .field__item:nth-child(2) a.btn {
color: #ff9f50; }
article.node--type-frontpage .node__content > section.home-pricing .field--name-computed-products-reference > .field__item > div {
position: absolute;
top: 50%;

View File

@ -849,11 +849,21 @@ article.node--type-frontpage{
flex:0 0 50%;
text-align: center;
padding: 2em 0;
a.btn{
@include btn;
background-color: #fff;
}
&:nth-child(1){
background-color: $color-base
background-color: $color-base;
a.btn{
color: $color-base;
}
}
&:nth-child(2){
background-color: $color-webshowroom;
a.btn{
color: $color-webshowroom;
}
}
color: #fff;
position: relative;

View File

@ -0,0 +1,27 @@
{#
/**
* @file
*
* Default template for product variations.
*
* Available variables:
* - attributes: HTML attributes for the wrapper.
* - product_variation: The rendered product variation fields.
* Use 'product_variation' to print them all, or print a subset such as
* 'product_variation.title'. Use the following code to exclude the
* printing of a given field:
* @code
* {{ product_variation|without('title') }}
* @endcode
* - product_variation_entity: The product variation entity.
* - product_url: The product URL.
*
* @ingroup themeable
*/
#}
<div{{ attributes }}>
{{- product_variation -}}
<a href="/pricing" @click.prevent="onClickLink" class="btn">
{% trans %}View Option Details{% endtrans %}
</a>
</div>