fixing bottom tabs spaces

This commit is contained in:
zmeyer44 2023-10-15 00:14:22 -04:00
parent 6e9b4c17fa
commit 63e193d079
2 changed files with 5 additions and 3 deletions

View File

@ -28,8 +28,8 @@ export default function BottomNav() {
},
];
return (
<footer className="z-header- flex h-[var(--bottom-nav-height)] w-full bg-background sm:hidden">
<div className="fixed inset-x-0 bottom-0 flex h-[var(--bottom-nav-height)] flex-1 items-center justify-between border-t bg-background px-4">
<footer className="z-header- flex h-[var(--bottom-nav-height)] w-full sm:hidden">
<div className="bottom-tabs fixed inset-x-0 bottom-0 flex h-[var(--bottom-nav-height)] flex-1 items-center justify-between border-t bg-background px-4">
{navigationItems.map((item) => (
<Link href={item.href} className="center group group flex-1">
<item.icon
@ -43,7 +43,6 @@ export default function BottomNav() {
/>
</Link>
))}
<div className="standalone:block hidden h-[20px] w-full"></div>
</div>
</footer>
);

View File

@ -62,6 +62,9 @@
.dark {
--bottom-nav-height: 76px;
}
.bottom-tabs {
padding-bottom: 20px;
}
}
}