fix(frontend): ajouter Bibliothèque dans le sidebar desktop App.vue
This commit is contained in:
@@ -1,16 +1,57 @@
|
||||
<template>
|
||||
<AppHeader @toggle-drawer="drawerOpen = !drawerOpen" />
|
||||
<!-- Mobile: header + drawer -->
|
||||
<AppHeader class="lg:hidden" @toggle-drawer="drawerOpen = !drawerOpen" />
|
||||
<AppDrawer :open="drawerOpen" @close="drawerOpen = false" />
|
||||
<main class="pt-14 min-h-screen">
|
||||
|
||||
<!-- Desktop: sidebar fixe + contenu -->
|
||||
<div class="lg:flex">
|
||||
<!-- Sidebar desktop -->
|
||||
<aside class="hidden lg:flex lg:flex-col lg:fixed lg:inset-y-0 lg:w-60 bg-bg-hard border-r border-bg-soft z-30">
|
||||
<div class="px-5 pt-6 pb-4 border-b border-bg-soft">
|
||||
<RouterLink to="/" class="text-green font-bold text-xl tracking-wide flex items-center gap-2">
|
||||
🌿 <span>Jardin</span>
|
||||
</RouterLink>
|
||||
</div>
|
||||
<nav class="flex-1 py-4 px-3 flex flex-col gap-0.5 overflow-y-auto">
|
||||
<RouterLink
|
||||
v-for="l in links" :key="l.to" :to="l.to"
|
||||
class="flex items-center gap-3 text-text-muted hover:text-text py-2 px-3 rounded-lg text-sm transition-colors group"
|
||||
active-class="bg-bg-soft text-green font-medium"
|
||||
>
|
||||
<span class="text-base leading-none">{{ l.icon }}</span>
|
||||
<span>{{ l.label }}</span>
|
||||
</RouterLink>
|
||||
</nav>
|
||||
<div class="px-4 py-4 border-t border-bg-soft text-text-muted text-xs">
|
||||
🌱 Jardin App
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- Main content -->
|
||||
<main class="pt-14 lg:pt-0 lg:pl-60 min-h-screen w-full">
|
||||
<RouterView />
|
||||
</main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { RouterView } from 'vue-router'
|
||||
import { RouterLink, RouterView } from 'vue-router'
|
||||
import AppHeader from '@/components/AppHeader.vue'
|
||||
import AppDrawer from '@/components/AppDrawer.vue'
|
||||
|
||||
const drawerOpen = ref(false)
|
||||
|
||||
const links = [
|
||||
{ to: '/', label: 'Dashboard', icon: '🏠' },
|
||||
{ to: '/jardins', label: 'Jardins', icon: '🪴' },
|
||||
{ to: '/plantes', label: 'Plantes', icon: '🌱' },
|
||||
{ to: '/bibliotheque', label: 'Bibliothèque', icon: '📷' },
|
||||
{ to: '/outils', label: 'Outils', icon: '🔧' },
|
||||
{ to: '/plantations', label: 'Plantations', icon: '🥕' },
|
||||
{ to: '/taches', label: 'Tâches', icon: '✅' },
|
||||
{ to: '/planning', label: 'Planning', icon: '📆' },
|
||||
{ to: '/calendrier', label: 'Calendrier', icon: '🌙' },
|
||||
{ to: '/reglages', label: 'Réglages', icon: '⚙️' },
|
||||
]
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user