feat(frontend): harmoniser navigation et libellés
This commit is contained in:
Matthieu
290
app/app.vue
290
app/app.vue
@@ -32,7 +32,7 @@
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/machines') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Machines
|
||||
Parc Machines
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
@@ -41,62 +41,107 @@
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/types') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Types de Machines
|
||||
Schémas de machine
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/models"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/models') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Modèles
|
||||
</NuxtLink>
|
||||
<details class="group">
|
||||
<summary
|
||||
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
|
||||
:class="isActive('/models/pieces') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Pièces
|
||||
</summary>
|
||||
<ul class="menu menu-sm bg-base-100 rounded-box p-2 shadow space-y-1">
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/model-types"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/model-types') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catégorie de pièce
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/models/pieces"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/models/pieces') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catalogue de pièce
|
||||
</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/model-types"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/model-types') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Types de modèles
|
||||
</NuxtLink>
|
||||
<details class="group">
|
||||
<summary
|
||||
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
|
||||
:class="(isActive('/models/components') || isActive('/model-types')) ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Composant
|
||||
</summary>
|
||||
<ul class="menu menu-sm bg-base-100 rounded-box p-2 shadow space-y-1">
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/model-types"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/model-types') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catégorie de composant
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/models/components"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/models/components') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catalogue de composant
|
||||
</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/sites"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/sites') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Sites
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/generator"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/generator') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Générateur
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/documents"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/documents') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Documents
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/constructeurs"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/constructeurs') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Constructeurs
|
||||
</NuxtLink>
|
||||
<details class="group">
|
||||
<summary
|
||||
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
|
||||
:class="(isActive('/sites') || isActive('/documents') || isActive('/constructeurs')) ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Ressources liées
|
||||
</summary>
|
||||
<ul class="menu menu-sm bg-base-100 rounded-box p-2 shadow space-y-1">
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/sites"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/sites') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Sites
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/documents"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/documents') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Documents
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/constructeurs"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/constructeurs') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Constructeurs
|
||||
</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -126,7 +171,7 @@
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/machines') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Machines
|
||||
Parc Machines
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
@@ -135,62 +180,107 @@
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/types') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Types de Machines
|
||||
Schémas de machine
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/models"
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/models') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
<li class="dropdown dropdown-hover">
|
||||
<div
|
||||
tabindex="0"
|
||||
role="button"
|
||||
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
|
||||
:class="isActive('/models/pieces') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Modèles
|
||||
</NuxtLink>
|
||||
Pièces
|
||||
</div>
|
||||
<ul tabindex="0" class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-60">
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/model-types"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/model-types') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catégorie de pièce
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/models/pieces"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/models/pieces') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catalogue de pièce
|
||||
</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/model-types"
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/model-types') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
<li class="dropdown dropdown-hover">
|
||||
<div
|
||||
tabindex="0"
|
||||
role="button"
|
||||
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
|
||||
:class="(isActive('/model-types') || isActive('/models/components')) ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Types de modèles
|
||||
</NuxtLink>
|
||||
Composant
|
||||
</div>
|
||||
<ul tabindex="0" class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-64">
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/model-types"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/model-types') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catégorie de composant
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/models/components"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/models/components') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Catalogue de composant
|
||||
</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/sites"
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/sites') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
<li class="dropdown dropdown-hover">
|
||||
<div
|
||||
tabindex="0"
|
||||
role="button"
|
||||
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
|
||||
:class="(isActive('/sites') || isActive('/documents') || isActive('/constructeurs')) ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Sites
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/generator"
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/generator') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Générateur
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/documents"
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/documents') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Documents
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/constructeurs"
|
||||
class="transition-colors px-3 py-2 rounded-md"
|
||||
:class="isActive('/constructeurs') ? 'bg-primary text-primary-content font-semibold shadow-sm' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Constructeurs
|
||||
</NuxtLink>
|
||||
Ressources liées
|
||||
</div>
|
||||
<ul tabindex="0" class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-60">
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/sites"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/sites') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Sites
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/documents"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/documents') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Documents
|
||||
</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink
|
||||
to="/constructeurs"
|
||||
class="rounded-md px-2 py-1 transition-colors"
|
||||
:class="isActive('/constructeurs') ? 'bg-primary/10 text-primary font-semibold' : 'text-base-content hover:bg-primary/10 hover:text-primary'"
|
||||
>
|
||||
Constructeurs
|
||||
</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user