From 7ae4baaa4d713e91a255a08d85554700befb4016 Mon Sep 17 00:00:00 2001
From: bmauger <mauger.bryan@gmail.com>
Date: Tue, 8 Mar 2022 14:43:01 -0500
Subject: [PATCH] Footer adjustments to better accommodate variable width
 button and link..

---
 .../funnel-footer/funnel-footer.vue           | 22 ++++++++++---------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/common-components/funnel-footer/funnel-footer.vue b/src/common-components/funnel-footer/funnel-footer.vue
index 062a3574a..44afa5364 100644
--- a/src/common-components/funnel-footer/funnel-footer.vue
+++ b/src/common-components/funnel-footer/funnel-footer.vue
@@ -16,7 +16,7 @@
     </div>
     <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="col-12 button-col d-flex justify-content-end" id="stacked">
+        <div class="col button-col d-flex" id="stacked">
           <buttonMain
             isPrimary
             :buttonText="buttonText"
@@ -27,7 +27,7 @@
             @click-event="buttonClick"
           />
         </div>
-        <div class="col-12 link-col py-1">
+        <div class="col-auto link-col py-1 text-break">
           <textLink
           linkType="navigation"
           :text="backLink"
@@ -91,19 +91,21 @@ export default {
 .footer {
   display: flex;
   margin-top: auto;
-  .button-col,
-  .link-col,
-  .btn-primary {
-    width: 100%;
-  }
   a {
     display: flex;
     justify-content: center;
   }
+  .col,
+  .col-auto,
+  .col button {
+    width: 100%;
+  }
   @media only screen and (min-width: 340px) {
-    .button-col,
-    .link-col {
-      width: 50% !important;
+    .col,
+    .col-auto,
+    .col button {
+      width: auto;
+      justify-content: flex-end;
     }
     .btn-primary {
       width: auto;