From 88d0b466ceaf82de8af26e55ba0298f1ae1861e8 Mon Sep 17 00:00:00 2001
From: Felix Schneider <mail@fschneider.me>
Date: Sun, 20 Jul 2025 18:05:56 +0200
Subject: [PATCH] fix: style of recipe actions to be compliant with design
 schema (#5736)

---
 .../Domain/Recipe/RecipeContextMenu.vue       | 31 ++++++++-----------
 frontend/lib/icons/icons.ts                   |  2 ++
 frontend/pages/group/data/recipe-actions.vue  |  6 ++--
 3 files changed, 18 insertions(+), 21 deletions(-)

diff --git a/frontend/components/Domain/Recipe/RecipeContextMenu.vue b/frontend/components/Domain/Recipe/RecipeContextMenu.vue
index 95d45ffc3..6d86c3658 100644
--- a/frontend/components/Domain/Recipe/RecipeContextMenu.vue
+++ b/frontend/components/Domain/Recipe/RecipeContextMenu.vue
@@ -125,25 +125,20 @@
         </v-list-item>
         <div v-if="useItems.recipeActions && recipeActions && recipeActions.length">
           <v-divider />
-          <v-list-group @click.stop>
-            <template #activator="{ props }">
-              <v-list-item-title v-bind="props">
-                {{ $t("recipe.recipe-actions") }}
-              </v-list-item-title>
+          <v-list-item
+            v-for="(action, index) in recipeActions"
+            :key="index"
+            @click="executeRecipeAction(action)"
+          >
+            <template #prepend>
+              <v-icon color="undefined">
+                {{ $globals.icons.linkVariantPlus }}
+              </v-icon>
             </template>
-            <v-list density="compact" class="ma-0 pa-0">
-              <v-list-item
-                v-for="(action, index) in recipeActions"
-                :key="index"
-                class="pl-6"
-                @click="executeRecipeAction(action)"
-              >
-                <v-list-item-title>
-                  {{ action.title }}
-                </v-list-item-title>
-              </v-list-item>
-            </v-list>
-          </v-list-group>
+            <v-list-item-title>
+              {{ action.title }}
+            </v-list-item-title>
+          </v-list-item>
         </div>
       </v-list>
     </v-menu>
diff --git a/frontend/lib/icons/icons.ts b/frontend/lib/icons/icons.ts
index 0e11d71cb..6866adf04 100644
--- a/frontend/lib/icons/icons.ts
+++ b/frontend/lib/icons/icons.ts
@@ -151,6 +151,7 @@ import {
   mdiKnife,
   mdiCookie,
   mdiBellPlus,
+  mdiLinkVariantPlus,
 } from "@mdi/js";
 
 export const icons = {
@@ -236,6 +237,7 @@ export const icons = {
   informationOutline: mdiInformationOutline,
   informationVariant: mdiInformationVariant,
   link: mdiLink,
+  linkVariantPlus: mdiLinkVariantPlus,
   lock: mdiLock,
   logout: mdiLogout,
   menu: mdiMenu,
diff --git a/frontend/pages/group/data/recipe-actions.vue b/frontend/pages/group/data/recipe-actions.vue
index 6aa285c9d..bf518972f 100644
--- a/frontend/pages/group/data/recipe-actions.vue
+++ b/frontend/pages/group/data/recipe-actions.vue
@@ -4,7 +4,7 @@
     <BaseDialog
       v-model="state.createDialog"
       :title="$t('data-pages.recipe-actions.new-recipe-action')"
-      :icon="$globals.icons.primary"
+      :icon="$globals.icons.linkVariantPlus"
       can-submit
       @submit="createAction"
     >
@@ -34,7 +34,7 @@
     <!-- Edit Dialog -->
     <BaseDialog
       v-model="state.editDialog"
-      :icon="$globals.icons.primary"
+      :icon="$globals.icons.linkVariantPlus"
       :title="$t('data-pages.recipe-actions.edit-recipe-action')"
       :submit-text="$t('general.save')"
       can-submit
@@ -115,7 +115,7 @@
 
     <!-- Data Table -->
     <BaseCardSectionTitle
-      :icon="$globals.icons.primary"
+      :icon="$globals.icons.linkVariantPlus"
       section
       :title="$t('data-pages.recipe-actions.recipe-actions-data')"
     />