fix(portal): remove unnecessary scrollbars on registration availability step
Vuetify VList defaults to overflow:auto; override to visible for the availability list. Coerce duration_hours to number when summing hours so API decimal strings do not string-concatenate. Made-with: Cursor
This commit is contained in:
@@ -142,9 +142,11 @@ const timeSlotsByDate = computed(() => {
|
||||
const totalSelectedHours = computed(() => {
|
||||
if (!registrationData.value?.time_slots) return 0
|
||||
|
||||
return registrationData.value.time_slots
|
||||
const total = registrationData.value.time_slots
|
||||
.filter(s => selectedTimeSlotIds.value.includes(s.id))
|
||||
.reduce((sum, s) => sum + s.duration_hours, 0)
|
||||
.reduce((sum, s) => sum + Number(s.duration_hours), 0)
|
||||
|
||||
return Math.round(total * 100) / 100
|
||||
})
|
||||
|
||||
const formattedDates = computed(() => {
|
||||
@@ -975,7 +977,10 @@ async function onSubmit() {
|
||||
<h4 class="text-subtitle-1 font-weight-bold mb-2 text-capitalize">
|
||||
{{ formatDate(date) }}
|
||||
</h4>
|
||||
<VList density="compact">
|
||||
<VList
|
||||
density="compact"
|
||||
class="registration-availability-list"
|
||||
>
|
||||
<VListItem
|
||||
v-for="slot in slots"
|
||||
:key="slot.id"
|
||||
@@ -1107,4 +1112,12 @@ async function onSubmit() {
|
||||
max-inline-size: 100%;
|
||||
min-inline-size: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
Vuetify’s .v-list uses overflow: auto, which shows scrollbars on this step when
|
||||
list rows are slightly wider than the card (e.g. checkbox + text + rating).
|
||||
*/
|
||||
.registration-availability-list {
|
||||
overflow: visible !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user