fix: Mise a jour ui simple

- supp champs emplacement
- augmenter espace en label et input
sup btn compléter champs perso
This commit is contained in:
Matthieu
2025-09-29 15:36:14 +02:00
parent 43b615ac3e
commit c489f093ed
4 changed files with 158 additions and 305 deletions

View File

@@ -60,7 +60,7 @@
</NuxtLink>
</li>
<li
class="dropdown dropdown-hover"
class="dropdown"
:class="{ 'dropdown-open': openDropdown === 'pieces-mobile' }"
@mouseenter="setDropdown('pieces-mobile')"
@mouseleave="scheduleDropdownClose('pieces-mobile')"
@@ -71,6 +71,9 @@
tabindex="0"
role="button"
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
@click="toggleDropdown('pieces-mobile')"
@keydown.enter.prevent="toggleDropdown('pieces-mobile')"
@keydown.space.prevent="toggleDropdown('pieces-mobile')"
:class="
isActive('/pieces-catalog') || isActive('/piece-category')
? 'bg-primary text-primary-content font-semibold shadow-sm'
@@ -112,7 +115,7 @@
</ul>
</li>
<li
class="dropdown dropdown-hover"
class="dropdown"
:class="{ 'dropdown-open': openDropdown === 'component-mobile' }"
@mouseenter="setDropdown('component-mobile')"
@mouseleave="scheduleDropdownClose('component-mobile')"
@@ -123,6 +126,9 @@
tabindex="0"
role="button"
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
@click="toggleDropdown('component-mobile')"
@keydown.enter.prevent="toggleDropdown('component-mobile')"
@keydown.space.prevent="toggleDropdown('component-mobile')"
:class="
isActive('/component-catalog') ||
isActive('/component-category')
@@ -165,7 +171,7 @@
</ul>
</li>
<li
class="dropdown dropdown-hover"
class="dropdown"
:class="{ 'dropdown-open': openDropdown === 'resources-mobile' }"
@mouseenter="setDropdown('resources-mobile')"
@mouseleave="scheduleDropdownClose('resources-mobile')"
@@ -176,6 +182,9 @@
tabindex="0"
role="button"
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
@click="toggleDropdown('resources-mobile')"
@keydown.enter.prevent="toggleDropdown('resources-mobile')"
@keydown.space.prevent="toggleDropdown('resources-mobile')"
:class="
isActive('/sites') ||
isActive('/documents') ||
@@ -288,20 +297,23 @@
</NuxtLink>
</li>
<li
class="dropdown dropdown-hover"
class="dropdown"
:class="{ 'dropdown-open': openDropdown === 'pieces-desktop' }"
@mouseenter="setDropdown('pieces-desktop')"
@mouseleave="scheduleDropdownClose('pieces-desktop')"
@focusin="setDropdown('pieces-desktop')"
@focusout="scheduleDropdownClose('pieces-desktop')"
>
<div
tabindex="0"
role="button"
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
:class="
isActive('/pieces-catalog') || isActive('/piece-category')
? 'bg-primary text-primary-content font-semibold shadow-sm'
<div
tabindex="0"
role="button"
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
@click="toggleDropdown('pieces-desktop')"
@keydown.enter.prevent="toggleDropdown('pieces-desktop')"
@keydown.space.prevent="toggleDropdown('pieces-desktop')"
:class="
isActive('/pieces-catalog') || isActive('/piece-category')
? 'bg-primary text-primary-content font-semibold shadow-sm'
: 'text-base-content hover:bg-primary/10 hover:text-primary'
"
>
@@ -340,20 +352,23 @@
</ul>
</li>
<li
class="dropdown dropdown-hover"
class="dropdown"
:class="{ 'dropdown-open': openDropdown === 'component-desktop' }"
@mouseenter="setDropdown('component-desktop')"
@mouseleave="scheduleDropdownClose('component-desktop')"
@focusin="setDropdown('component-desktop')"
@focusout="scheduleDropdownClose('component-desktop')"
>
<div
tabindex="0"
role="button"
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
:class="
isActive('/component-category') ||
isActive('/component-catalog')
<div
tabindex="0"
role="button"
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
@click="toggleDropdown('component-desktop')"
@keydown.enter.prevent="toggleDropdown('component-desktop')"
@keydown.space.prevent="toggleDropdown('component-desktop')"
:class="
isActive('/component-category') ||
isActive('/component-catalog')
? 'bg-primary text-primary-content font-semibold shadow-sm'
: 'text-base-content hover:bg-primary/10 hover:text-primary'
"
@@ -393,20 +408,23 @@
</ul>
</li>
<li
class="dropdown dropdown-hover"
class="dropdown"
:class="{ 'dropdown-open': openDropdown === 'resources-desktop' }"
@mouseenter="setDropdown('resources-desktop')"
@mouseleave="scheduleDropdownClose('resources-desktop')"
@focusin="setDropdown('resources-desktop')"
@focusout="scheduleDropdownClose('resources-desktop')"
>
<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') ||
<div
tabindex="0"
role="button"
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
@click="toggleDropdown('resources-desktop')"
@keydown.enter.prevent="toggleDropdown('resources-desktop')"
@keydown.space.prevent="toggleDropdown('resources-desktop')"
: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'
@@ -620,6 +638,22 @@ const scheduleDropdownClose = (name) => {
}, 200);
};
const closeDropdownNow = () => {
if (dropdownCloseTimer) {
clearTimeout(dropdownCloseTimer);
dropdownCloseTimer = null;
}
openDropdown.value = null;
};
const toggleDropdown = (name) => {
if (openDropdown.value === name) {
closeDropdownNow();
return;
}
setDropdown(name);
};
const activeProfileLabel = computed(() => {
if (!activeProfile.value) {
return "Profil inconnu";