From 8d5958e98ff1c5233ceb5820cb35dcf2ab95a5bf Mon Sep 17 00:00:00 2001
From: p0lycarpio <arsene.reymond@free.fr>
Date: Fri, 27 Jun 2025 16:03:52 +0000
Subject: [PATCH] visual improvements

---
 frontend/components/Domain/QueryFilterBuilder.vue         | 5 +++++
 .../components/Domain/Recipe/RecipeOrganizerSelector.vue  | 8 ++++++--
 frontend/components/Domain/User/UserInviteDialog.vue      | 2 +-
 frontend/components/global/BaseDialog.vue                 | 1 -
 frontend/lib/icons/icons.ts                               | 2 ++
 frontend/pages/g/[groupSlug]/recipes/timeline.vue         | 2 +-
 frontend/pages/group/migrations.vue                       | 5 +++--
 frontend/pages/household/notifiers.vue                    | 4 +++-
 8 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/frontend/components/Domain/QueryFilterBuilder.vue b/frontend/components/Domain/QueryFilterBuilder.vue
index 85a1672ba..721b540a8 100644
--- a/frontend/components/Domain/QueryFilterBuilder.vue
+++ b/frontend/components/Domain/QueryFilterBuilder.vue
@@ -189,6 +189,7 @@
                 :show-add="false"
                 :show-label="false"
                 :show-icon="false"
+                variant="underlined"
                 @update:model-value="setOrganizerValues(field, index, $event)"
               />
               <RecipeOrganizerSelector
@@ -198,6 +199,7 @@
                 :show-add="false"
                 :show-label="false"
                 :show-icon="false"
+                variant="underlined"
                 @update:model-value="setOrganizerValues(field, index, $event)"
               />
               <RecipeOrganizerSelector
@@ -207,6 +209,7 @@
                 :show-add="false"
                 :show-label="false"
                 :show-icon="false"
+                variant="underlined"
                 @update:model-value="setOrganizerValues(field, index, $event)"
               />
               <RecipeOrganizerSelector
@@ -216,6 +219,7 @@
                 :show-add="false"
                 :show-label="false"
                 :show-icon="false"
+                variant="underlined"
                 @update:model-value="setOrganizerValues(field, index, $event)"
               />
               <RecipeOrganizerSelector
@@ -225,6 +229,7 @@
                 :show-add="false"
                 :show-label="false"
                 :show-icon="false"
+                variant="underlined"
                 @update:model-value="setOrganizerValues(field, index, $event)"
               />
             </v-col>
diff --git a/frontend/components/Domain/Recipe/RecipeOrganizerSelector.vue b/frontend/components/Domain/Recipe/RecipeOrganizerSelector.vue
index 269f1060f..26ec7413a 100644
--- a/frontend/components/Domain/Recipe/RecipeOrganizerSelector.vue
+++ b/frontend/components/Domain/Recipe/RecipeOrganizerSelector.vue
@@ -9,9 +9,9 @@
     closable-chips
     item-title="name"
     multiple
-    variant="outlined"
+    :variant="variant"
     :prepend-inner-icon="icon"
-    :append-icon="$globals.icons.create"
+    :append-icon="showAdd ? $globals.icons.create : undefined"
     return-object
     auto-select-first
     class="pa-0"
@@ -93,6 +93,10 @@ export default defineNuxtComponent({
       type: Boolean,
       default: true,
     },
+    variant: {
+      type: String as () => "filled" | "underlined" | "outlined" | "plain" | "solo" | "solo-inverted" | "solo-filled",
+      default: "outlined",
+    },
   },
   emits: ["update:modelValue"],
 
diff --git a/frontend/components/Domain/User/UserInviteDialog.vue b/frontend/components/Domain/User/UserInviteDialog.vue
index cf3150db8..fc198ab52 100644
--- a/frontend/components/Domain/User/UserInviteDialog.vue
+++ b/frontend/components/Domain/User/UserInviteDialog.vue
@@ -32,11 +32,11 @@
         <v-row>
           <v-col cols="9">
             <v-text-field
+              v-model="generatedSignupLink"
               :label="$t('profile.invite-link')"
               type="text"
               readonly
               variant="filled"
-              :value="generatedSignupLink"
             />
           </v-col>
           <v-col
diff --git a/frontend/components/global/BaseDialog.vue b/frontend/components/global/BaseDialog.vue
index 76b39b5ae..2bf4ddf7e 100644
--- a/frontend/components/global/BaseDialog.vue
+++ b/frontend/components/global/BaseDialog.vue
@@ -29,7 +29,6 @@
           <v-toolbar-title class="headline">
             {{ title }}
           </v-toolbar-title>
-          <v-spacer />
         </v-toolbar>
         <v-progress-linear
           v-if="loading"
diff --git a/frontend/lib/icons/icons.ts b/frontend/lib/icons/icons.ts
index bbfea6b07..0e11d71cb 100644
--- a/frontend/lib/icons/icons.ts
+++ b/frontend/lib/icons/icons.ts
@@ -150,6 +150,7 @@ import {
   mdiCodeTags,
   mdiKnife,
   mdiCookie,
+  mdiBellPlus,
 } from "@mdi/js";
 
 export const icons = {
@@ -174,6 +175,7 @@ export const icons = {
   arrowUpDown: mdiDrag,
   backupRestore: mdiBackupRestore,
   bellAlert: mdiBellAlert,
+  bellPlus: mdiBellPlus,
   broom: mdiBroom,
   calendar: mdiCalendar,
   calendarMinus: mdiCalendarMinus,
diff --git a/frontend/pages/g/[groupSlug]/recipes/timeline.vue b/frontend/pages/g/[groupSlug]/recipes/timeline.vue
index 03359532a..8a7281269 100644
--- a/frontend/pages/g/[groupSlug]/recipes/timeline.vue
+++ b/frontend/pages/g/[groupSlug]/recipes/timeline.vue
@@ -2,7 +2,7 @@
   <div>
     <BasePageTitle
       v-if="groupName"
-      class="bg-grey-darken-4 mt-n4 pt-8"
+      class="mt-n4 pt-8"
     >
       <template #header>
         <v-img
diff --git a/frontend/pages/group/migrations.vue b/frontend/pages/group/migrations.vue
index 1991e892d..aeeed4801 100644
--- a/frontend/pages/group/migrations.vue
+++ b/frontend/pages/group/migrations.vue
@@ -15,11 +15,12 @@
       </template>
       {{ $t('migration.recipe-data-migrations-explanation') }}
     </BasePageTitle>
-    <v-container>
+    <v-container class="px-0">
       <BaseCardSectionTitle :title="$t('migration.new-migration')" />
       <v-card
         variant="outlined"
         :loading="loading"
+        style="border-color: lightgrey;"
       >
         <v-card-title> {{ $t('migration.choose-migration-type') }} </v-card-title>
         <v-card-text
@@ -83,7 +84,7 @@
         </v-card-actions>
       </v-card>
     </v-container>
-    <v-container>
+    <v-container class="px-0">
       <BaseCardSectionTitle :title="$t('migration.previous-migrations')" />
       <ReportTable
         :items="reports"
diff --git a/frontend/pages/household/notifiers.vue b/frontend/pages/household/notifiers.vue
index a09e8c2e1..de00aaa72 100644
--- a/frontend/pages/household/notifiers.vue
+++ b/frontend/pages/household/notifiers.vue
@@ -15,6 +15,7 @@
     <BaseDialog
       v-model="createDialog"
       :title="$t('events.new-notification')"
+      :icon="$globals.icons.bellPlus"
       can-submit
       @submit="createNewNotifier"
     >
@@ -95,7 +96,7 @@
       >
         <v-expansion-panel-title
           disable-icon-rotate
-          class="headline"
+          class="text-h6"
         >
           <div class="d-flex align-center">
             {{ notifier.name }}
@@ -103,6 +104,7 @@
           <template #actions>
             <v-btn
               icon
+              flat
               class="ml-2"
             >
               <v-icon>