fix(ui): improve mobile tabbar sizing, inventory actions, date picker proportions and stats lead time
This commit is contained in:
@@ -48,7 +48,7 @@ const ADMIN_INV_TABS: TabDef[] = [
|
||||
function TabBar({ tabs }: { tabs: TabDef[] }) {
|
||||
return (
|
||||
<nav
|
||||
className="fixed inset-x-0 bottom-0 z-40 border-t border-line bg-panel md:hidden"
|
||||
className="fixed inset-x-0 bottom-0 z-40 border-t border-line bg-panel/95 backdrop-blur-md md:hidden"
|
||||
style={{ paddingBottom: "env(safe-area-inset-bottom)" }}
|
||||
>
|
||||
<div className="grid grid-cols-4">
|
||||
@@ -59,13 +59,13 @@ function TabBar({ tabs }: { tabs: TabDef[] }) {
|
||||
end={t.end}
|
||||
className={({ isActive }) =>
|
||||
cn(
|
||||
"flex min-h-[56px] flex-col items-center justify-center gap-0.5 whitespace-nowrap px-1 text-[10.5px] font-medium transition-colors",
|
||||
isActive ? "text-accent" : "text-muted",
|
||||
"flex min-h-[66px] flex-col items-center justify-center gap-1.5 whitespace-nowrap px-1 py-1 transition-all active:scale-95",
|
||||
isActive ? "text-accent font-bold" : "text-muted hover:text-ink font-medium",
|
||||
)
|
||||
}
|
||||
>
|
||||
<t.icon className="h-5 w-5" strokeWidth={1.8} />
|
||||
<span>{t.label}</span>
|
||||
<t.icon className="h-6.5 w-6.5" strokeWidth={2.2} />
|
||||
<span className="text-[12px] leading-tight tracking-tight">{t.label}</span>
|
||||
</NavLink>
|
||||
))}
|
||||
</div>
|
||||
@@ -97,4 +97,4 @@ export function MobileTabBar() {
|
||||
pathname.startsWith("/suppliers");
|
||||
if (onOfficePage && isOffice) return <TabBar tabs={PROC_TABS} />;
|
||||
return null;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user