Merge pull request #1556 from Safelite/CSR-1731-fix-screenreader-reading-double-hamburger

CSR-1812 make it so cart toggle can be tabbed to.
This commit is contained in:
bmauger 2023-11-21 11:25:21 -05:00 committed by GitHub
commit 7f17912f29
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -5,10 +5,10 @@
class="row vin-toggle flex align-items-center pt-4" class="row vin-toggle flex align-items-center pt-4"
:class="[isExpanded ? 'expanded' : '']" :class="[isExpanded ? 'expanded' : '']"
@click="toggleIsExpanded()"> @click="toggleIsExpanded()">
<div class="col d-flex justify-content-between"> <a href="#!" class="col d-flex justify-content-between py-0">
<span class="label">{{ amountDueText }}</span <span class="label">{{ amountDueText }}</span>
><span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span> <span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span>
</div> </a>
</div> </div>
<div class="price-table"> <div class="price-table">
<div class="service-type"> <div class="service-type">
@ -789,6 +789,7 @@ export default {
color: $gray; color: $gray;
} }
.label { .label {
color: $black;
font-weight: 500; font-weight: 500;
} }
.amount-due { .amount-due {
@ -798,6 +799,7 @@ export default {
max-height: 0; max-height: 0;
transition: all 350ms ease-in; transition: all 350ms ease-in;
overflow: hidden; overflow: hidden;
visibility: hidden;
div { div {
display: flex; display: flex;
@ -901,6 +903,10 @@ export default {
transition: all 150ms ease-in; transition: all 150ms ease-in;
overflow: hidden; overflow: hidden;
padding-top: 1rem; padding-top: 1rem;
visibility: visible;
}
a {
text-decoration: none;
} }
} }
} }