ui fixes in bottom nav

2026-05-31 11:23:55 +05:30
parent 3624c19d2d
commit 8c1f3a1b7b
1 changed files with 9 additions and 2 deletions
@@ -82,11 +82,18 @@ export function SiteBottomNav() {
        "pb-[env(safe-area-inset-bottom)]",
      )}
    >
-      <ul className="flex items-stretch py-2">
+      <ul className="flex items-stretch justify-around py-2">
        {items.map((item) => {
          const active = isActive(item);
          return (
-            <li key={item.label} className="flex-1">
+            <li
+              key={item.label}
+              // flex + items-center + justify-center so the fixed-size
+              // pill below sits centred inside its equal-width cell;
+              // without these the pill collapses to the left edge of
+              // each `flex-1` slot.
+              className="flex-1 flex items-center justify-center"
+            >
              <Link
                href={item.href}
                aria-label={item.label}