layout & date fixes

pages/index.vue

@@ -26,7 +26,7 @@
             </ClientOnly>
           </div>
           <ClientOnly fallback-tag="div">
-            <div v-if="isAuthenticated" class="flex flex-wrap items-center justify-center gap-2">
+            <div v-if="isAuthenticated" class="flex items-center justify-center gap-2">
               <NuxtLink 
                 v-if="isAdmin"
                 to="/admin" 
@@ -215,28 +215,34 @@ const todaysSermon = computed(() => {
   const today = new Date()
   today.setHours(0, 0, 0, 0)
   
-  return activeSermons.value.find((s: any) => {
+  for (const s of activeSermons.value) {
     // Check primary date
     const sermonDate = new Date(s.date + 'T00:00:00')
     sermonDate.setHours(0, 0, 0, 0)
-    if (sermonDate.getTime() === today.getTime()) return true
+    if (sermonDate.getTime() === today.getTime()) {
+      return { ...s, displayDate: s.date }
+    }
     
     // Check additional dates if they exist
     if (s.dates) {
       try {
         const additionalDates = JSON.parse(s.dates)
-        return additionalDates.some((dateStr: string) => {
+        const matchingDate = additionalDates.find((dateStr: string) => {
           const additionalDate = new Date(dateStr + 'T00:00:00')
           additionalDate.setHours(0, 0, 0, 0)
           return additionalDate.getTime() === today.getTime()
         })
+        
+        if (matchingDate) {
+          return { ...s, displayDate: matchingDate }
+        }
       } catch {
-        return false
+        // Continue to next sermon if parsing fails
       }
     }
-    
+  }
-    return false
+  
-  }) || null
+  return null
 })
 
 // Get upcoming sermons (future dates)