jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #280 from Safelite/BRM-footer-update

Browse source 
Footer adjustments to better accommodate varying width button and li…
This commit is contained in:
bmauger 2022-03-08 14:55:38 -05:00 committed by GitHub
commit 7b9600d140
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/common-components/funnel-footer/funnel-footer.vue
View file

@ -16,7 +16,7 @@
</div> </div>
<div class="container-fluid fixed-bottom g-4 bg-light py-4" id="infoBox"> <div class="container-fluid fixed-bottom g-4 bg-light py-4" id="infoBox">
<div class="row d-flex flex-row-reverse align-items-center"> <div class="row d-flex flex-row-reverse align-items-center">
<div class="col-12 button-col d-flex justify-content-end" id="stacked"> <div class="col button-col d-flex" id="stacked">
<buttonMain <buttonMain
isPrimary isPrimary
:buttonText="buttonText" :buttonText="buttonText"
@ -27,7 +27,7 @@
@click-event="buttonClick" @click-event="buttonClick"
/> />
</div> </div>
<div class="col-12 link-col py-1"> <div class="col-auto link-col py-1 text-break">
<textLink <textLink
linkType="navigation" linkType="navigation"
:text="backLink" :text="backLink"
@ -91,19 +91,21 @@ export default {
.footer { .footer {
display: flex; display: flex;
margin-top: auto; margin-top: auto;
.button-col,
.link-col,
.btn-primary {
width: 100%;
}
a { a {
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.col,
.col-auto,
.col button {
width: 100%;
}
@media only screen and (min-width: 340px) { @media only screen and (min-width: 340px) {
.button-col, .col,
.link-col { .col-auto,
width: 50% !important; .col button {
width: auto;
justify-content: flex-end;
} }
.btn-primary { .btn-primary {
width: auto; width: auto;