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

style(admin): update layout font, max-width, and sidebar active item styles

Browse Source
This commit is contained in:
Hyko
2026-04-22 11:46:48 -04:00
parent 0111e4b548
commit d6506eab5a
2 changed files with 5 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/admin/components/AdminPagesLayout.js
+2 -2
View File
@@ -8,7 +8,7 @@ export default function AdminPagesLayout({ children, user, onLogout, appName, en
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
return ( return (
<div className="flex h-screen overflow-hidden bg-white dark:bg-black"> <div className="flex h-screen overflow-hidden bg-white dark:bg-black font-ibm-plex-sans">
<AdminSidebar <AdminSidebar
isMobileMenuOpen={isMobileMenuOpen} isMobileMenuOpen={isMobileMenuOpen}
setIsMobileMenuOpen={setIsMobileMenuOpen} setIsMobileMenuOpen={setIsMobileMenuOpen}
@@ -19,7 +19,7 @@ export default function AdminPagesLayout({ children, user, onLogout, appName, en
<div className="flex-1 flex flex-col min-w-0"> <div className="flex-1 flex flex-col min-w-0">
<AdminHeader isMobileMenuOpen={isMobileMenuOpen} setIsMobileMenuOpen={setIsMobileMenuOpen} user={user} onLogout={onLogout} appName={appName} navigationSections={navigationSections} /> <AdminHeader isMobileMenuOpen={isMobileMenuOpen} setIsMobileMenuOpen={setIsMobileMenuOpen} user={user} onLogout={onLogout} appName={appName} navigationSections={navigationSections} />
<main className="flex-1 overflow-y-auto bg-neutral-50 dark:bg-black"> <main className="flex-1 overflow-y-auto bg-neutral-50 dark:bg-black">
<div className="px-8 py-7 pb-32 max-w-[1400px] mx-auto"> <div className="px-8 py-7 pb-32 max-w-[1920px] mx-auto">
{children} {children}
</div> </div>
</main> </main>
src/features/admin/components/AdminSidebar.js
+3 -6
View File
@@ -89,8 +89,8 @@ const AdminSidebar = ({ isMobileMenuOpen, setIsMobileMenuOpen, appName, enabledM
})) }))
})); }));
const itemBase = 'w-full flex items-center justify-between px-[10px] py-[7px] rounded-lg text-[13px] transition-colors duration-[120ms] ease-out'; const itemBase = 'w-full flex items-center justify-between px-[10px] py-[7px] rounded-lg text-[13px] font-normal transition-colors duration-[120ms] ease-out';
const itemActive = 'bg-neutral-200 dark:bg-neutral-800 text-neutral-900 dark:text-white font-semibold'; const itemActive = 'bg-neutral-100 dark:bg-neutral-900 text-black dark:text-white';
const itemInactive = 'text-neutral-500 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-900 hover:text-neutral-900 dark:hover:text-white'; const itemInactive = 'text-neutral-500 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-900 hover:text-neutral-900 dark:hover:text-white';
const subItemBase = 'w-full flex items-center justify-between px-[10px] py-[7px] rounded-lg text-[12px] transition-colors duration-[120ms] ease-out'; const subItemBase = 'w-full flex items-center justify-between px-[10px] py-[7px] rounded-lg text-[12px] transition-colors duration-[120ms] ease-out';
@@ -200,10 +200,7 @@ const AdminSidebar = ({ isMobileMenuOpen, setIsMobileMenuOpen, appName, enabledM
`}> `}>
{/* Logo */} {/* Logo */}
<Link href="/admin" className="px-4 h-12 flex items-center justify-start gap-2 border-b border-neutral-200 dark:border-neutral-800/70"> <Link href="/admin" className="px-4 h-12 flex items-center justify-start gap-2 border-b border-neutral-200 dark:border-neutral-800/70">
<h1 className="text-neutral-900 dark:text-white font-semibold">{appName}</h1> <h1 className="text-neutral-900 dark:text-white font-semibold text-sm">{appName}</h1>
<span className="bg-red-700/10 border border-red-600/20 text-red-600 uppercase text-[10px] leading-none px-2 py-1 rounded font-semibold">
Admin
</span>
</Link> </Link>
{/* Navigation */} {/* Navigation */}