fix: tighten mobile bottom nav spacing

This commit is contained in:
TerryM
2026-05-30 21:30:08 +08:00
parent 5277943196
commit d531ba40f3
2 changed files with 3 additions and 3 deletions

View File

@@ -31,7 +31,7 @@ export function BackToTop() {
exit={{ opacity: 0, scale: 0.8, y: 8 }} exit={{ opacity: 0, scale: 0.8, y: 8 }}
transition={{ type: "spring", stiffness: 380, damping: 26 }} transition={{ type: "spring", stiffness: 380, damping: 26 }}
onClick={() => window.scrollTo({ top: 0, behavior: "smooth" })} onClick={() => window.scrollTo({ top: 0, behavior: "smooth" })}
className="fixed bottom-[calc(94px+max(env(safe-area-inset-bottom),0px))] right-4 z-30 flex h-11 w-11 items-center justify-center rounded-full bg-ark-gold text-black shadow-lg shadow-black/40 outline-none transition hover:bg-ark-gold2 active:scale-95 focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg md:bottom-8 md:right-8" className="fixed bottom-[calc(84px+max(env(safe-area-inset-bottom),0px))] right-4 z-30 flex h-11 w-11 items-center justify-center rounded-full bg-ark-gold text-black shadow-lg shadow-black/40 outline-none transition hover:bg-ark-gold2 active:scale-95 focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg md:bottom-8 md:right-8"
aria-label={t("backToTop")} aria-label={t("backToTop")}
title={t("backToTop")} title={t("backToTop")}
> >

View File

@@ -694,7 +694,7 @@ export function PublicLayout() {
) : null} ) : null}
<main <main
className={`mx-auto w-full max-w-[1280px] max-md:pb-[calc(78px+max(env(safe-area-inset-bottom),0px)+1.5rem)] ${ className={`mx-auto w-full max-w-[1280px] max-md:pb-[calc(68px+max(env(safe-area-inset-bottom),0px)+1rem)] ${
isHome isHome
? "flex-1 px-0 pb-6 pt-0 md:px-9 md:pb-10 md:pt-10 xl:px-0" ? "flex-1 px-0 pb-6 pt-0 md:px-9 md:pb-10 md:pt-10 xl:px-0"
: footerInContentFlow : footerInContentFlow
@@ -716,7 +716,7 @@ export function PublicLayout() {
</main> </main>
<nav className="fixed inset-x-0 bottom-0 z-40 select-none bg-[#0C0D0F]/95 pb-[max(env(safe-area-inset-bottom),0px)] backdrop-blur md:hidden"> <nav className="fixed inset-x-0 bottom-0 z-40 select-none bg-[#0C0D0F]/95 pb-[max(env(safe-area-inset-bottom),0px)] backdrop-blur md:hidden">
<div className="grid h-[78px] grid-cols-4 gap-3 px-5 py-4 text-center text-[11px] leading-[17.6px]"> <div className="grid h-[68px] grid-cols-4 gap-3 px-5 py-[10px] text-center text-[11px] leading-[17.6px]">
<BottomNavIcon <BottomNavIcon
to="/" to="/"
label={t("home")} label={t("home")}