CASH-556: waitlist adjustments

src/layouts/schedule/time-slot-question/time-slot-question.vue

@@ -22,6 +22,10 @@
             v-model="selectedRouteCode"
             isRequired
             validationRules="time-slot-required" />
+        <div
+            class="supplemental-information"
+            v-if="supplementalInformationBlock"
+            v-html="supplementalInformationBlock" />
         <div
             v-if="hasWaitListExperiment && displayWaitListFeature"
             class="mt-5 bg-light rounded waitlist">
@@ -38,21 +42,17 @@
         </div>
         <div
             v-if="waitListRequested"
-            class="mt-5 rounded waitlist-success"
+            class="rounded waitlist-success"
             ref="waitlistSuccessMessage">
             <img :src="waitListSuccessImage" class="success-image" />
             <span v-html="waitListSuccessText" class="success-text"></span>
         </div>
-        <div
-            class="mt-5 mb-2 supplemental-information"
-            v-if="supplementalInformationBlock"
-            v-html="supplementalInformationBlock" />
         <textBlock
             v-show="disclaimerTextBlockCopy"
             :customText="disclaimerTextBlockCopy"
             justifyText="left"
             typeStyle="caption"
-            class="mb-2" />
+            class="disclaimer" />
     </div>
 </template>
 
@@ -574,6 +574,7 @@ export default {
         line-height: 1.5rem;
         font-size: 0.875rem;
         text-align: left;
+        margin: 1.25rem 0 1.5rem;
         li strong {
             font-weight: bold;
         }
@@ -586,6 +587,7 @@ export default {
         border-radius: 8px;
         font-size: 1rem;
         padding: 16px;
+        text-align: left;
 
         .ui-checkbox {
             padding-left: 0px;
@@ -599,6 +601,7 @@ export default {
         }
     }
     .waitlist-success {
+        margin: 1rem 0 0;
         background-color: #ecf5e9;
         display: flex;
         align-items: flex-start;
@@ -606,9 +609,11 @@ export default {
         border-radius: 5px;
         font-size: 1.125rem;
         padding: 0.75rem 1rem;
-        margin-bottom: -0.5rem;
         .success-text {
             margin-left: 0.5rem;
+            p {
+                margin-bottom: 0;
+            }
         }
         .success-image {
             margin-top: 4.5px;
@@ -617,5 +622,9 @@ export default {
             color: #0c7e47;
         }
     }
+    .disclaimer {
+        text-align: left;
+        margin: 1.5rem 0 0;
+    }
 }
 </style>