diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue index 7441ab422..610f8d4f8 100644 --- a/src/digital-components/button-question/button-question.vue +++ b/src/digital-components/button-question/button-question.vue @@ -72,9 +72,9 @@ https://safelite.atlassian.net/wiki/spaces/DC/pages/76644418/Button+Question+Com -
+
diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue index 8b2cdc9ce..6c6cd48a4 100644 --- a/src/digital-components/date-picker/date-picker.vue +++ b/src/digital-components/date-picker/date-picker.vue @@ -6,7 +6,7 @@ v-for="month in months" :key="`${month.monthLabel}-${month.yearNum?.toString()}`" :id="`${month.monthLabel}-${month.yearNum?.toString()}`" - class="calendar-grid-container position-relative" + class="calendar-grid-container" :class="[ hideSomeDaysForInitialView ? 'partial-month-initial-view' : '', month.monthClass, @@ -628,12 +628,16 @@ export default { .date-picker { overflow: hidden; position: relative; - height: 100%; + flex-grow: 1; + display: flex; + flex-direction: column; fieldset { overflow-y: auto; - height: 88%; + flex-grow: 1; position: relative; + padding-bottom: 6rem; // arbitrary amount to provide enough spacing for scroll animation + max-height: 21.25rem; // 340px... arbitrary amount to not push View More link out of view on iphones } .loader { position: absolute; @@ -648,6 +652,7 @@ export default { .calendar-grid-container { margin: 0 auto 2rem auto; max-width: 414px; + position: relative; transition: height ease 2s, opacity ease 2s; display: grid; grid-template-columns: repeat(7, 1fr); @@ -864,21 +869,17 @@ export default { opacity: 0; max-height: 0; margin-bottom: 0; + overflow: hidden; } &.last-available-month:not(&.month-hidden) { margin-bottom: 14rem; } } - #bottom-spacer { - height: 20rem; - background: lightblue; - } .btn-link { font-weight: 500; text-underline-offset: 4px; - position: absolute; - top: 90%; + flex-grow: 0; } .past { diff --git a/src/digital-components/textbox-question/textbox-question.vue b/src/digital-components/textbox-question/textbox-question.vue index 1c87a2ac5..5e9662c87 100644 --- a/src/digital-components/textbox-question/textbox-question.vue +++ b/src/digital-components/textbox-question/textbox-question.vue @@ -64,9 +64,9 @@
-
+
{{ errorMessage }}