feat(backoffice): amélioration navigation mobile et tablette

- Ajout d'un menu hamburger mobile (MobileNav) avec drawer animé via React Portal (évite le piège du backdrop-filter du header)
- Popin JobsIndicator adaptée mobile : positionnement fixed plein-écran sur petit écran, backdrop semi-transparent
- Navigation tablette (md→lg) : icônes seules avec tooltip natif, labels visibles uniquement sur lg+

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-09 22:44:33 +01:00
parent 4c75e08056
commit e8bb014874
3 changed files with 127 additions and 19 deletions

View File

@@ -146,15 +146,27 @@ export function JobsIndicator() {
/>
</button>
{/* Backdrop mobile */}
{isOpen && (
<div
className="fixed inset-0 z-40 sm:hidden bg-background/60 backdrop-blur-sm"
onClick={() => setIsOpen(false)}
aria-hidden="true"
/>
)}
{/* Popin/Dropdown with glassmorphism */}
{isOpen && (
<div className="
absolute right-0 top-full mt-2 w-96
fixed sm:absolute
inset-x-3 sm:inset-x-auto
top-[4.5rem] sm:top-full sm:mt-2
sm:w-96
bg-popover/95 backdrop-blur-md
rounded-xl
shadow-elevation-2
border border-border/60
overflow-hidden
rounded-xl
shadow-elevation-2
border border-border/60
overflow-hidden
z-50
animate-scale-in
">