Refactor Schedules

src/pages/schedule/BoatReservationPage.vue

@@ -2,22 +2,21 @@
   <q-page>
     <q-list>
       <q-form @submit="onSubmit" @reset="onReset" class="q-gutter-sm">
-        <q-input
-          bottom-slots
-          v-model="bookingForm.name"
-          label="Creating reservation for"
-          readonly
-        >
-          <template v-slot:prepend>
-            <q-icon name="person" />
-          </template>
-        </q-input>
+        <q-item>
+          <q-item-section :avatar="true">
+            <q-icon name="person"
+          /></q-item-section>
+          <q-item-section>
+            <q-item-label> Name: {{ bookingForm.name }} </q-item-label>
+          </q-item-section>
+        </q-item>
         <q-expansion-item
           expand-separator
           v-model="resourceView"
           icon="calendar_month"
           label="Boat and Time"
           default-opened
+          class="q-mt-none"
           :caption="bookingSummary"
         >
           <q-separator />