Evenly space admin portal tab navigation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Kyle 2026-03-11 02:59:23 +08:00
parent 84b3083987
commit 98ad83ae5f

View File

@ -19,7 +19,7 @@ export default function AdminPortal() {
{/* Portal header with tab navigation */}
<div className="shrink-0 border-b bg-card overflow-hidden">
<div className="px-3 md:px-6 h-14 md:h-16 flex items-center gap-2 md:gap-4">
<div className="flex items-center gap-2 mr-2 md:mr-6 shrink-0">
<div className="flex items-center gap-2 shrink-0">
<div className="p-1.5 rounded-md bg-red-500/10">
<ShieldCheck className="h-5 w-5 text-red-400" />
</div>
@ -27,7 +27,7 @@ export default function AdminPortal() {
</div>
{/* Horizontal tab navigation */}
<nav className="flex items-center gap-1 h-full min-w-0 overflow-x-auto">
<nav className="flex items-center justify-evenly flex-1 h-full min-w-0 overflow-x-auto">
{tabs.map(({ label, path, icon: Icon }) => {
const isActive = location.pathname.startsWith(path);
return (
@ -36,7 +36,7 @@ export default function AdminPortal() {
to={path}
title={label}
className={cn(
'flex items-center gap-1.5 px-2.5 md:px-4 h-full text-sm font-medium transition-colors duration-150 border-b-2 -mb-px whitespace-nowrap',
'flex items-center justify-center gap-1.5 px-2.5 md:px-4 h-full text-sm font-medium transition-colors duration-150 border-b-2 -mb-px whitespace-nowrap',
isActive
? 'text-accent border-accent'
: 'text-muted-foreground hover:text-foreground border-transparent'