refactor: improve how cards look

ui/app/components/Simple.vue

@@ -205,7 +205,7 @@
                 <UCard
                   v-for="item in queueItems"
                   :key="`queue-${item._id}`"
-                  class="w-full min-w-0 max-w-full overflow-hidden border bg-default"
+                  class="w-full min-w-0 max-w-full overflow-hidden"
                   :ui="queueCardUi"
                 >
                   <template #header>
@@ -439,7 +439,7 @@
                 <UCard
                   v-for="item in historyEntries"
                   :key="`history-${historyPagination.page}-${item._id}`"
-                  class="w-full min-w-0 max-w-full overflow-hidden border bg-default"
+                  class="w-full min-w-0 max-w-full overflow-hidden"
                   :ui="queueCardUi"
                 >
                   <div class="flex min-w-0 flex-col gap-4 sm:flex-row">
@@ -756,14 +756,14 @@ const fieldUi = {
 };
 
 const formCardUi = {
-  root: 'w-full border bg-default',
+  root: 'w-full border border-default bg-default',
   container: 'w-full p-4 sm:p-5',
   wrapper: 'w-full items-stretch',
   body: 'w-full',
 };
 
 const queueCardUi = {
-  root: 'w-full',
+  root: 'w-full border border-default bg-default',
   header: 'p-4 pb-0',
   body: 'p-4',
 };

ui/app/pages/browser/[...slug].vue

@@ -323,8 +323,9 @@
       <UCard
         v-for="item in filteredItems"
         :key="item.path"
-        class="flex h-full flex-col border bg-default"
+        class="flex h-full flex-col"
         :ui="{
+          root: 'bg-default border border-default',
           header: 'p-4 pb-3',
           body: 'flex flex-1 flex-col gap-4 p-4 pt-0',
           footer: 'border-t border-default px-4 py-4',

ui/app/pages/conditions.vue

@@ -239,8 +239,9 @@
     <div v-else-if="filteredItems.length > 0" class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
       <div v-for="cond in filteredItems" :key="cond.id" class="min-w-0 w-full max-w-full">
         <UCard
-          class="flex h-full min-w-0 w-full max-w-full flex-col border bg-default"
+          class="flex h-full min-w-0 w-full max-w-full flex-col"
           :ui="{
+            root: 'bg-default border border-default',
             header: 'p-4 pb-3',
             body: 'flex flex-1 flex-col gap-4 p-4 pt-0',
             footer: 'border-t border-default px-4 py-4',

ui/app/pages/dl_fields.vue

@@ -238,8 +238,9 @@
     <div v-else-if="filteredItems.length > 0" class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
       <div v-for="field in filteredItems" :key="field.id" class="min-w-0 w-full max-w-full">
         <UCard
-          class="flex h-full min-w-0 w-full max-w-full flex-col border bg-default"
+          class="flex h-full min-w-0 w-full max-w-full flex-col"
           :ui="{
+            root: 'bg-default border border-default',
             header: 'p-4 pb-3',
             body: 'flex flex-1 flex-col gap-4 p-4 pt-0',
             footer: 'border-t border-default px-4 py-4',

ui/app/pages/history.vue

@@ -377,12 +377,12 @@
           class="min-h-0 min-w-0 w-full max-w-full"
         >
           <UCard
-            class="flex h-full min-w-0 w-full max-w-full flex-col overflow-hidden border"
+            class="flex h-full min-w-0 w-full max-w-full flex-col overflow-hidden"
             :ui="{
               body: 'flex flex-1 flex-col gap-4 p-4',
               footer: 'border-t border-default px-4 py-4',
               header: 'p-4 pb-3',
-              root: 'bg-default',
+              root: 'bg-default border border-default',
             }"
           >
             <template #header>

ui/app/pages/index.vue

@@ -399,12 +399,12 @@
             class="min-h-0 min-w-0 w-full max-w-full"
           >
             <UCard
-              class="flex h-full min-w-0 w-full max-w-full flex-col overflow-hidden border"
+              class="flex h-full min-w-0 w-full max-w-full flex-col overflow-hidden"
               :ui="{
                 body: 'flex flex-1 flex-col gap-4 p-4',
                 footer: 'border-t border-default px-4 py-4',
                 header: 'p-4 pb-3',
-                root: 'bg-default',
+                root: 'bg-default border border-default',
               }"
             >
               <template #header>

ui/app/pages/notifications.vue

@@ -276,8 +276,9 @@
     <div v-else-if="filteredTargets.length > 0" class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
       <div v-for="item in filteredTargets" :key="item.id" class="min-w-0 w-full max-w-full">
         <UCard
-          class="flex h-full min-w-0 w-full max-w-full flex-col border bg-default"
+          class="flex h-full min-w-0 w-full max-w-full flex-col"
           :ui="{
+            root: 'bg-default border border-default',
             header: 'p-4 pb-3',
             body: 'flex flex-1 flex-col gap-4 p-4 pt-0',
             footer: 'border-t border-default px-4 py-4',

ui/app/pages/presets.vue

@@ -237,8 +237,9 @@
     <div v-else-if="filteredPresets.length > 0" class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
       <div v-for="item in filteredPresets" :key="item.id" class="min-w-0 w-full max-w-full">
         <UCard
-          class="flex h-full min-w-0 w-full max-w-full flex-col border bg-default"
+          class="flex h-full min-w-0 w-full max-w-full flex-col"
           :ui="{
+            root: 'bg-default border border-default',
             header: 'p-4 pb-3',
             body: 'flex flex-1 flex-col gap-4 p-4 pt-0',
             footer: 'border-t border-default px-4 py-4',

ui/app/pages/task_definitions.vue

@@ -267,8 +267,9 @@
         class="min-w-0 w-full max-w-full"
       >
         <UCard
-          class="flex h-full min-w-0 w-full max-w-full flex-col border bg-default"
+          class="flex h-full min-w-0 w-full max-w-full flex-col"
           :ui="{
+            root: 'bg-default border border-default',
             header: 'p-4 pb-3',
             body: 'flex flex-1 flex-col gap-4 p-4 pt-0',
             footer: 'border-t border-default px-4 py-4',

ui/app/pages/tasks.vue

@@ -340,8 +340,9 @@
     >
       <div v-for="item in filteredTasks" :key="item.id" class="min-w-0 w-full max-w-full">
         <UCard
-          class="flex h-full min-w-0 w-full max-w-full flex-col border bg-default"
+          class="flex h-full min-w-0 w-full max-w-full flex-col"
           :ui="{
+            root: 'bg-default border border-default',
             header: 'p-4 pb-3',
             body: 'flex flex-1 flex-col gap-4 p-4 pt-0',
             footer: 'border-t border-default px-4 py-4',