Refactor Modal, SearchModal and ConfirmModal

diff --git a/client/components/ConfirmModal.vue b/client/components/ConfirmModal.vue
index 60adcfad676d48d174284d5e9ff1ca1eda004b92..ee4395927fa46acfcf72a62008235c065faff26a 100644 (file)
--- a/client/components/ConfirmModal.vue
+++ b/client/components/ConfirmModal.vue
@@ -4,7 +4,10 @@
     :title="title"
     :class="{ 'border border-l-4 border-l-theme-danger': isDanger }"
     :closeHandler="cancelHandler"
+    class="px-6 py-4"
   >
+    <!-- Title -->
+    <div v-if="title" class="mb-6 text-xl">{{ title }}</div>
     <!-- Message -->
     <div class="mb-6">{{ message }}</div>
     <!-- Buttons -->

diff --git a/client/components/Modal.vue b/client/components/Modal.vue
index c075e99f833e7b20518cf914b52129f703b81c0e..ebbe7a355edadfff80080eadbc08320047e54be4 100644 (file)
--- a/client/components/Modal.vue
+++ b/client/components/Modal.vue
@@ -7,7 +7,7 @@
   >
     <!-- Modal -->
     <div
-      class="relative max-w-[500px] grow rounded-lg border border-theme-border bg-theme-background px-6 py-4 shadow-lg"
+      class="relative max-w-[500px] grow rounded-lg border border-theme-border bg-theme-background shadow-lg"
       :class="$attrs.class"
       @keyup.esc="close"
     >
@@ -17,8 +17,6 @@
         @click="closeHandler"
         class="absolute right-1 top-1"
       />
-      <!-- Title -->
-      <div v-if="title" class="mb-6 text-xl">{{ title }}</div>
       <slot></slot>
     </div>
   </div>
@@ -34,7 +32,6 @@ defineOptions({
   inheritAttrs: false,
 });
 const props = defineProps({
-  title: { type: String },
   showClose: { type: Boolean },
   closeHandlerOverride: Function,
 });

diff --git a/client/partials/SearchInput.vue b/client/partials/SearchInput.vue
index e6e2910c3a7ff5e5422827d4ac11c9785bffc535..6541bd0ca62428704a53b2a18379a6e9cef62f6e 100644 (file)
--- a/client/partials/SearchInput.vue
+++ b/client/partials/SearchInput.vue
@@ -9,7 +9,7 @@
       v-model="searchTerm"
       v-focus
       class="w-full focus:outline-none"
-      placeholder="Search"
+      placeholder="Search..."
     />
   </form>
 </template>

diff --git a/client/partials/SearchModal.vue b/client/partials/SearchModal.vue
index c754a55bd824715ea28227dda2d1c9038da3ed5d..b8e017c3678d157232681a73b37abf95b9b18179 100644 (file)
--- a/client/partials/SearchModal.vue
+++ b/client/partials/SearchModal.vue
@@ -1,7 +1,7 @@
 <template>
-  <Modal v-model="isVisible" class="px-0 py-0 border-none">
+  <Modal v-model="isVisible">
     <SearchInput
-      class="px-5 py-4"
+      class="px-5 py-4 border-none"
       @search="toggleHandler"
       @keyup.esc="toggleHandler"
     />