From 591405c66f7a2dbcdb4f2abacececbb8d716ef19 Mon Sep 17 00:00:00 2001
From: Joshua Ryder <ryderjj89@outlook.com>
Date: Wed, 1 Oct 2025 23:56:39 -0400
Subject: [PATCH] Fix mobile layout: Edit and Archive on first row, Delete on
 second row

---
 pages/admin.vue | 38 ++++++++++++++++++++------------------
 1 file changed, 20 insertions(+), 18 deletions(-)

diff --git a/pages/admin.vue b/pages/admin.vue
index 50cf3f4..9397bea 100644
--- a/pages/admin.vue
+++ b/pages/admin.vue
@@ -39,28 +39,30 @@
                 </option>
               </select>
             </div>
-            <div class="flex gap-4">
-              <button
-                type="button"
-                @click="handleEdit"
-                :disabled="!selectedSermonId"
-                class="flex-1 px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
-              >
-                Edit
-              </button>
-              <button
-                type="button"
-                @click="handleArchive"
-                :disabled="!selectedSermonId || archiving"
-                class="flex-1 px-6 py-2 bg-yellow-600 text-white rounded-md hover:bg-yellow-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-500 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
-              >
-                {{ archiving ? 'Archiving...' : 'Archive' }}
-              </button>
+            <div class="space-y-3">
+              <div class="flex gap-4">
+                <button
+                  type="button"
+                  @click="handleEdit"
+                  :disabled="!selectedSermonId"
+                  class="flex-1 px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
+                >
+                  Edit
+                </button>
+                <button
+                  type="button"
+                  @click="handleArchive"
+                  :disabled="!selectedSermonId || archiving"
+                  class="flex-1 px-6 py-2 bg-yellow-600 text-white rounded-md hover:bg-yellow-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-500 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
+                >
+                  {{ archiving ? 'Archiving...' : 'Archive' }}
+                </button>
+              </div>
               <button
                 type="button"
                 @click="handleDelete"
                 :disabled="!selectedSermonId || deleting"
-                class="flex-1 px-6 py-2 bg-red-600 text-white rounded-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
+                class="w-full px-6 py-2 bg-red-600 text-white rounded-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
               >
                 {{ deleting ? 'Deleting...' : 'Delete' }}
               </button>