CASH-1403: Parity updates

This commit is contained in:
Chris Redelinghuys 2025-08-28 11:05:44 -04:00
parent c7ac0848a5
commit 7036c5e5f9
2 changed files with 38 additions and 18 deletions

View file

@ -3,7 +3,9 @@
<div class="px-0" v-if="isCartReadyToLoad">
<div
class="row vin-toggle flex align-items-center pt-4"
:class="[isExpanded ? 'expanded' : '']"
:class="[
isCollapsible ? (isExpanded ? 'expanded' : '') : 'expanded non-collapsible',
]"
@click="toggleIsExpanded()">
<a
aria-label="expand cart"
@ -208,6 +210,7 @@ export default {
isItac: Boolean,
isNoComp: Boolean,
isExpandedOnLoad: Boolean,
isCollapsible: { type: Boolean, default: true },
isMSRFeeApplicable: Boolean,
donationCartItem: Object,
},
@ -1182,6 +1185,11 @@ export default {
font-weight: 500;
line-height: 1.625;
}
.non-collapsible {
.amount-due {
display: none;
}
}
.amount-due {
color: $green;
@ -1283,23 +1291,26 @@ export default {
margin-top: 0.5rem;
}
.vin-toggle {
&:after {
content: "";
transition: all 0.5s ease;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230070D1' d='M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24Zm6.113 11.28-5.52 5.52a.84.84 0 0 1-1.186 0l-5.52-5.52a.843.843 0 1 1 1.186-1.2L12 15.012l4.927-4.932a.843.843 0 1 1 1.186 1.2Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right center;
width: 24px;
height: 24px;
display: inline-flex;
position: relative;
right: 0.75rem;
margin: 0.5rem 0 0.5rem 1rem;
cursor: pointer;
}
&.expanded:after {
transform: rotate(180deg);
&:not(.non-collapsible) {
&:after {
content: "";
transition: all 0.5s ease;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230070D1' d='M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24Zm6.113 11.28-5.52 5.52a.84.84 0 0 1-1.186 0l-5.52-5.52a.843.843 0 1 1 1.186-1.2L12 15.012l4.927-4.932a.843.843 0 1 1 1.186 1.2Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right center;
width: 24px;
height: 24px;
display: inline-flex;
position: relative;
right: 0.75rem;
margin: 0.5rem 0 0.5rem 1rem;
cursor: pointer;
}
&.expanded:after {
transform: rotate(180deg);
}
}
&.expanded + .cart-panel {
max-height: 650px;
transition: all 150ms ease-in;
@ -1307,6 +1318,13 @@ export default {
padding: 1rem 0 0.5rem;
visibility: visible;
}
&.non-collapsible {
& > a {
cursor: default;
}
}
a {
font-family: UrbanistSemibold;
text-decoration: none;

View file

@ -53,7 +53,7 @@
:showInsuranceCoverageAs="showInsuranceCoverageAs"
:isItac="isItac"
:isNoComp="isNoComp"
:isExpandedOnLoad="true" />
:isCollapsible="false" />
<button
v-if="showSwitchPaymentMethod"
@ -936,6 +936,7 @@ export default {
}
& > #cart-container {
flex-basis: 36%;
margin-top: 2rem;
}
@include media-breakpoint-down(lg) {
@ -946,6 +947,7 @@ export default {
}
& > #cart-container {
flex-basis: 100%;
margin: 0 0.5rem;
& > button#submit-payment {
display: none;