Multiple products settings refinements

- fixed dark mode product card color bug
- fixed no. of benefits counter on product card
- removed "Available in Portal" badge (all products are available)
This commit is contained in:
Peter Zimon 2021-06-30 11:09:18 +02:00
parent d5d9bb634d
commit 8b306bcca4
3 changed files with 9 additions and 11 deletions

View File

@ -12,12 +12,9 @@
<p class="gh-product-card-description">
{{product.description}}
</p>
{{#if (and (eq productIdx 0) (not (eq products.length 1)))}}
<span class="gh-badge gh-badge-green">Available in Portal</span>
{{/if}}
</div>
<div class="gh-product-card-block benefits-block">
<h4>Benefits <span class="counter">({{if product.benefits.length product.benefit.length "0"}})</span></h4>
<h4>Benefits <span class="counter">({{if product.benefits.length product.benefits.length "0"}})</span></h4>
{{#if product.benefits.length}}
<ul class="benefits">
{{#each product.benefits as |benefit|}}

View File

@ -83,6 +83,7 @@
--whitegrey: #1c1e21;
--blue: color-mod(#3eb0ef l(+5%) s(+5%));
--main-bg-color: #151719;
--dark-main-bg-color: #151719;
--hairline-color-1: #272a30;
--hairline-color-2: #626D79;
@ -289,15 +290,15 @@ input:focus,
/* ---------------------------------------------------------------------- */
.gh-expandable-header .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red),
.gh-expandable-content .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red),
.gh-main-section-content.grey .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red) {
.gh-expandable-header .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):not(.gh-btn-text):not(.gh-btn-link),
.gh-expandable-content .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):not(.gh-btn-text):not(.gh-btn-link),
.gh-main-section-content.grey .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):not(.gh-btn-text):not(.gh-btn-link) {
background: var(--lightgrey);
}
.gh-expandable-header .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):hover,
.gh-expandable-content .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):hover,
.gh-main-section-content.grey .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):hover {
.gh-expandable-header .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):not(.gh-btn-text):not(.gh-btn-link):hover,
.gh-expandable-content .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):not(.gh-btn-text):not(.gh-btn-link):hover,
.gh-main-section-content.grey .gh-btn:not(.gh-btn-white):not(.gh-btn-green):not(.gh-btn-blue):not(.gh-btn-red):not(.gh-btn-text):not(.gh-btn-link):hover {
background: var(--lightgrey-l1);
}

View File

@ -22,7 +22,7 @@
justify-content: space-between;
border-radius: 3px;
padding: 24px;
background: white;
background: var(--main-bg-color);
margin-bottom: 12px;
box-shadow: 0 1px 4px -1px rgba(0,0,0,0.1);
}