fix(ui): fix header sticky wrapper, increase footer bottom padding for buy bar, and balance mobile grid spacing

This commit is contained in:
parsa aghaei 2026-07-22 15:21:30 +03:30
parent 72a4073113
commit 0fa2b8c1d9
2 changed files with 9 additions and 7 deletions

View File

@ -29,7 +29,7 @@ export default function Footer({ onNavigate, onShopNavigate, onB2BOpen }: {
};
return (
<footer className="bg-medical-gray-900 text-white pt-24 pb-12 font-shabnam relative" dir="rtl">
<footer className="bg-medical-gray-900 text-white pt-24 pb-36 sm:pb-12 font-shabnam relative" dir="rtl">
{/* Floating Back-to-Top Button */}
{showScroll && (
<button

View File

@ -124,13 +124,14 @@ export default function Header({
<>
<AuthModal isOpen={isAuthModalOpen} onClose={() => setIsAuthModalOpen(false)} />
<div className="bg-canina-gold text-canina-dark text-xs font-black py-2.5 text-center font-vazir tracking-wider flex items-center justify-center gap-2">
<span>🚚</span>
<span>{getText('shipping_notice', "ارسال رایگان برای سفارش‌های بالای ۱۵۰ هزار تومان")}</span>
</div>
<div className="sticky top-0 z-50 w-full shadow-sm">
<div className="bg-canina-gold text-canina-dark text-xs font-black py-2 text-center font-vazir tracking-wider flex items-center justify-center gap-2">
<span>🚚</span>
<span>{getText('shipping_notice', "ارسال رایگان برای سفارش‌های بالای ۱۵۰ هزار تومان")}</span>
</div>
<header className="sticky top-0 z-50 bg-white/95 backdrop-blur-md border-b border-medical-gray-100 shadow-sm">
<div className="max-w-7xl mx-auto h-16 sm:h-20 md:h-24 flex items-center justify-between gap-1 sm:gap-4 px-2 sm:px-6 lg:px-8" dir="rtl">
<header className="bg-white/95 backdrop-blur-md border-b border-medical-gray-100">
<div className="max-w-7xl mx-auto h-16 sm:h-20 md:h-24 flex items-center justify-between gap-1 sm:gap-4 px-2 sm:px-6 lg:px-8" dir="rtl">
{/* Logo & Mobile Toggle Area */}
<div className="flex items-center gap-1.5 sm:gap-2 min-w-0">
{/* Mobile Menu Toggle */}
@ -510,6 +511,7 @@ export default function Header({
))}
</div>
</header>
</div>
{/* Mobile Drawer Menu */}
<AnimatePresence>