style(sidebar): supprimer Calendrier, corriger isActive, séparer toggle/nav, harmoniser hover

- Retrait de l'entrée "Calendrier" du menu et de sa route Vue Router
- isActive inclut désormais les sous-items (fix: groupe Mangas actif sur /import)
- Chevron déplacé dans un <button> séparé du RouterLink (plus de double toggle/nav)
- Hover harmonisé : hover:bg-gray-700 + hover:text-white sur parent et sous-items

assets/vue/app/router/index.js

@@ -82,12 +82,6 @@ const routes = [
                 name: 'convert',
                 component: ConversionPage
             },
-            {
-                path: '/calendar',
-                name: 'calendar',
-                component: PlaceholderComponent,
-                props: { title: 'Calendrier' }
-            },
             {
                 path: '/activity',
                 name: 'activity',

assets/vue/app/shared/components/layout/Sidebar.vue

@@ -27,7 +27,6 @@
     ArrowDownTrayIcon,
     ArrowsRightLeftIcon,
     BookOpenIcon,
-    CalendarIcon,
     ClockIcon,
     Cog6ToothIcon,
     ComputerDesktopIcon,
@@ -69,12 +68,6 @@ import MenuGroup from './sidebar/MenuGroup.vue';
             to: '/convert',
             id: 'convert'
         },
-        {
-            icon: CalendarIcon,
-            text: 'Calendrier',
-            to: '/calendar',
-            id: 'calendar'
-        },
         {
             icon: ClockIcon,
             text: 'Activité',

assets/vue/app/shared/components/layout/sidebar/MenuGroup.vue

@@ -3,24 +3,25 @@
         class="border-l-4"
         :class="{
             'border-green-600': isActive,
-            'hover:bg-gray-700 border-transparent': !isActive
+            'border-transparent': !isActive
         }">
-        <div class="flex w-full" @click="toggleExpanded">
+        <div class="flex w-full">
             <RouterLink
                 :to="to"
                 class="flex-grow px-4 py-2 flex items-center"
-                :class="{
+                :class="isActive
-                    'text-green-600 bg-gray-800': isActive
+                    ? 'text-green-600 bg-gray-800'
-                }">
+                    : 'hover:bg-gray-700 hover:text-white'">
-                <div class="flex items-center flex-grow">
+                <component :is="icon" class="w-5 h-5 mr-3" />
-                    <component :is="icon" class="w-5 h-5 mr-3" />
+                <span class="px-2">{{ text }}</span>
-                    <span class="px-2">{{ text }}</span>
-                </div>
-                <component
-                    v-if="subItems.length > 0"
-                    :is="expanded ? ChevronUpIcon : ChevronDownIcon"
-                    class="w-4 h-4" />
             </RouterLink>
+            <button
+                v-if="subItems.length > 0"
+                class="px-3 hover:bg-gray-700"
+                :class="isActive ? 'text-green-600 bg-gray-800' : 'hover:text-white'"
+                @click="toggleExpanded">
+                <component :is="expanded ? ChevronUpIcon : ChevronDownIcon" class="w-4 h-4" />
+            </button>
         </div>
 
         <ul v-if="subItems.length > 0" class="ml-8 mt-2 space-y-4" v-show="expanded">
@@ -71,14 +72,14 @@
     
     const isActive = computed(() => {
         if (!props.to) {
-            return props.subItems?.some(subItem => route.path === subItem.to) || false;
+            return props.subItems?.some(subItem => route.path.startsWith(subItem.to)) || false;
         }
 
         if (props.to === '/') {
-            return route.path === props.to || props.subItems.map(item => item.to).includes(route.path);
+            return route.path === props.to || props.subItems.some(item => route.path.startsWith(item.to));
         }
 
-        return route.path.startsWith(props.to);
+        return route.path.startsWith(props.to) || props.subItems.some(item => route.path.startsWith(item.to));
     });
 
     const isRouteMatching = path => {

assets/vue/app/shared/components/layout/sidebar/SubMenuItem.vue

@@ -1,9 +1,9 @@
 <template>
     <li>
-        <RouterLink v-if="to" :to="to" class="block hover:text-green-600" role="menuitem">
+        <RouterLink v-if="to" :to="to" class="block px-2 py-1 rounded hover:bg-gray-700 hover:text-white" role="menuitem">
             {{ text }}
         </RouterLink>
-        <button v-else @click="$emit('click')" class="w-full text-left hover:text-green-600" role="menuitem">
+        <button v-else @click="$emit('click')" class="w-full text-left px-2 py-1 rounded hover:bg-gray-700 hover:text-white" role="menuitem">
             {{ text }}
         </button>
     </li>