cleanup

resources/js/views/Workshops.vue

@@ -1,7 +1,6 @@
 <template>
-    <SMPage class="sm-page-workshop-list">
-        <template #container>
-            <h1>Workshops</h1>
+    <SMMastHead title="Workshops" />
+    <SMContainer>
         <SMToolbar>
             <SMInput
                 v-model="filterKeywords"
@@ -18,6 +17,11 @@
                 :feedback-invalid="dateRangeError"
                 @change="handleFilter" />
         </SMToolbar>
+        <SMPagination
+            v-if="postsTotal > 0"
+            v-model="postsPage"
+            :total="postsTotal"
+            :per-page="postsPerPage" />
         <SMMessage
             v-if="formMessage"
             icon="alert-circle-outline"
@@ -48,12 +52,7 @@
                 :banner-type="item.bannerType"
                 :ages="computedAges(item.event)"></SMPanel>
         </SMPanelList>
-            <SMPagination
-                v-model="postsPage"
-                :total="postsTotal"
-                :per-page="postsPerPage" />
-        </template>
-    </SMPage>
+    </SMContainer>
 </template>
 
 <script setup lang="ts">
@@ -68,6 +67,8 @@ import { api } from "../helpers/api";
 import { Event, EventCollection } from "../helpers/api.types";
 import { SMDate } from "../helpers/datetime";
 import { mediaGetVariantUrl } from "../helpers/media";
+import SMMastHead from "../components/SMMastHead.vue";
+import SMContainer from "../components/SMContainer.vue";
 
 interface EventData {
     event: Event;