zen/core
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

style(admin): update dropdown menu layout and remove user info section

Browse Source
This commit is contained in:
Hyko
2026-04-22 12:50:20 -04:00
parent 7bd5aedb3b
commit c08c0a622f
1 changed files with 5 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/admin/components/AdminHeader.js
+5 -30
View File
@@ -139,32 +139,7 @@ const AdminHeader = ({ isMobileMenuOpen, setIsMobileMenuOpen, user, onLogout, ap
leaveFrom="opacity-100 translate-y-0"
leaveTo="opacity-0 translate-y-1"
>
<MenuItems className="absolute right-0 mt-4 w-56 sm:w-64 outline-none rounded-xl border border-black/8 dark:border-white/8 bg-neutral-50 dark:bg-black shadow-lg overflow-hidden z-50">
{/* User info */}
<div className="px-3 pt-3 pb-2 flex items-center gap-3">
{imageUrl ? (
<img
src={imageUrl}
alt={user?.name || 'User'}
className="w-9 h-9 rounded-lg object-cover shrink-0"
/>
) : (
<div className="w-9 h-9 rounded-lg bg-neutral-200 dark:bg-neutral-800 flex items-center justify-center shrink-0">
<span className="text-sm font-medium text-neutral-600 dark:text-neutral-300">{userInitials}</span>
</div>
)}
<div className="min-w-0">
<p className="text-sm font-medium text-neutral-900 dark:text-white truncate leading-tight">
{user?.name || user?.email || 'User'}
</p>
{user?.name && (
<p className="text-xs text-neutral-400 dark:text-neutral-500 truncate leading-tight mt-0.5">
{user.email}
</p>
)}
</div>
</div>
<MenuItems className="absolute right-0 mt-4 w-44 sm:w-64 outline-none rounded-xl border border-black/8 dark:border-white/8 bg-neutral-50 dark:bg-black shadow-lg overflow-hidden z-50">
<div className="p-1.5 flex flex-col gap-0.5">
{/* Quick links — mobile only */}
{quickLinks.length > 0 && (
@@ -190,9 +165,9 @@ const AdminHeader = ({ isMobileMenuOpen, setIsMobileMenuOpen, user, onLogout, ap
<MenuItem>
<a
href="/admin/profile"
className="flex items-center gap-3 px-3 py-2.5 rounded-lg text-sm text-neutral-500 dark:text-neutral-400 transition-colors duration-[120ms] ease-out data-focus:bg-neutral-100 dark:data-focus:bg-white/5 data-focus:text-neutral-900 dark:data-focus:text-white"
className="cursor-pointer w-full flex items-center gap-2 px-[7px] py-[10px] rounded-lg text-[13px] text-neutral-500 dark:text-neutral-400 transition-colors duration-[120ms] ease-out data-focus:bg-neutral-100 dark:data-focus:bg-white/5 data-focus:text-neutral-900 dark:data-focus:text-white"
>
<svg className="w-4 h-4 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<svg className="w-[12px] h--[12px] shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.75} d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
</svg>
Mon profil
@@ -202,7 +177,7 @@ const AdminHeader = ({ isMobileMenuOpen, setIsMobileMenuOpen, user, onLogout, ap
{/* Theme — pas de MenuItem pour ne pas fermer le menu au clic */}
<button
onClick={toggle}
className="cursor-pointer w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-sm text-neutral-500 dark:text-neutral-400 hover:bg-amber-50 dark:hover:bg-amber-500/10 hover:text-amber-500 dark:hover:text-amber-400 transition-colors duration-150"
className="cursor-pointer w-full flex items-center gap-2 px-[7px] py-[10px] rounded-lg text-[13px] text-neutral-500 dark:text-neutral-400 hover:bg-amber-50 dark:hover:bg-amber-500/10 hover:text-amber-500 dark:hover:text-amber-400 transition-colors duration-150"
>
<ThemeIcon className="w-4 h-4 shrink-0" />
{themeLabel}
@@ -214,7 +189,7 @@ const AdminHeader = ({ isMobileMenuOpen, setIsMobileMenuOpen, user, onLogout, ap
<MenuItem>
<button
onClick={handleLogout}
className="cursor-pointer w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-sm text-neutral-500 dark:text-neutral-400 transition-colors duration-150 text-left data-focus:bg-red-50 dark:data-focus:bg-red-500/10 data-focus:text-red-500 dark:data-focus:text-red-400"
className="cursor-pointer w-full flex items-center gap-2 px-[7px] py-[10px] rounded-lg text-[13px] text-neutral-500 dark:text-neutral-400 transition-colors duration-150 text-left data-focus:bg-red-50 dark:data-focus:bg-red-500/10 data-focus:text-red-500 dark:data-focus:text-red-400"
>
<svg className="w-4 h-4 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.75} d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1" />