From db4e1fd84ac7b8e120059630e1fba2e4447c9b26 Mon Sep 17 00:00:00 2001
From: timotheegoguely <timothee@goguely.com>
Date: Tue, 10 Sep 2024 15:40:43 +0200
Subject: [PATCH] Update Menu component: fix icons and active state

---
 src/components/Menu.vue | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index a231646..dd3c4fc 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -38,7 +38,7 @@
       <ul class="flex">
         <li
           v-for="mainItem in mainItems"
-          data-icon="calendar"
+          :data-icon="mainItem.icon"
           :key="mainItem.path"
           :class="{ active: isCurrent(mainItem) }"
         >
@@ -108,7 +108,7 @@ const mainItems = [
   {
     title: "Inspirations",
     path: "/inspirations",
-    icon: "inspirations",
+    icon: "inspiration",
     pill: "Nouveauté",
   },
 ];
@@ -246,11 +246,15 @@ button[aria-controls="menu"][aria-expanded="false"] {
   cursor: pointer;
 }
 
-#menu .active,
 #menu li:hover {
   background-color: var(--color-grey-50);
 }
 
+#menu .active {
+  background-color: var(--color-primary-10);
+}
+
+
 #menu details {
   font-family: var(--font-serif);
   background-size: 1px 21px;