admin/shahikitchen-prod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace entire repo content with updated code from /root/shahikitchen-website/

Browse Source
This commit is contained in:
root
2026-06-30 12:19:55 +00:00
parent 50e3a34895
commit c8b7dc95e4
26 changed files with 1153 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/Navbar.tsx
+16 -12
View File
@@ -28,7 +28,7 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
const [scrolled, setScrolled] = useState(false);
const { totalItems, openCart } = useCart();
const { totalItems: wishlistCount, openWishlist } = useWishlist();
const { language } = useLanguage();
const { language, isRtl } = useLanguage();
const t = getTranslation(language);
const pathname = usePathname();
@@ -91,7 +91,7 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
</Link>
{/* Desktop Navigation - Premium Mesmerizing Design */}
<div className="hidden md:block flex-shrink-0">
<div className="hidden lg:block flex-shrink-0 min-w-0">
<div className="flex items-center rounded-full border border-[#c99a2e]/20 bg-white/60 px-2 py-1.5 backdrop-blur-3xl shadow-sm">
<div className="relative flex items-center gap-1 text-sm font-medium text-[#101724]">
{navLinks.map((link, index) => {
@@ -127,7 +127,7 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
</div>
{/* Desktop Actions — Stunning Mesmerizing Buttons */}
<div className="hidden md:flex items-center gap-3">
<div className="hidden lg:flex items-center gap-3 shrink-0">
{/* Wishlist Button */}
<button
onClick={openWishlist}
@@ -168,11 +168,11 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
</div>
{/* Mobile Hamburger + Wishlist + Cart (compact, high touch target) */}
<div className="md:hidden flex items-center gap-2">
<div className="lg:hidden flex items-center gap-1.5 shrink-0">
{/* MOBILE WISHLIST ICON */}
<button
onClick={openWishlist}
className="relative flex items-center justify-center w-10 h-10 rounded-full hover:bg-[#F5F1E9] active:bg-[#EDE6D9] transition-colors"
className="relative flex items-center justify-center w-11 h-11 rounded-full hover:bg-[#F5F1E9] active:bg-[#EDE6D9] transition-colors"
aria-label={t.wishlist}
>
<Heart className={`h-5 w-5 ${wishlistCount > 0 ? 'text-[#c99a2e] fill-[#c99a2e]/30' : 'text-[#101724]'}`} />
@@ -186,7 +186,7 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
{/* MOBILE CART ICON (always visible) */}
<button
onClick={openCart}
className="relative flex items-center justify-center w-10 h-10 rounded-full hover:bg-[#F5F1E9] active:bg-[#EDE6D9] transition-colors"
className="relative flex items-center justify-center w-11 h-11 rounded-full hover:bg-[#F5F1E9] active:bg-[#EDE6D9] transition-colors"
aria-label="Open cart"
>
<ShoppingBag className="h-5 w-5 text-[#101724]" />
@@ -199,7 +199,7 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
<button
onClick={() => setIsOpen(!isOpen)}
className="text-[#B38B4D] p-2 -mr-1 active:text-[#8C6B3A] transition-colors"
className="flex items-center justify-center w-11 h-11 text-[#B38B4D] -me-1 active:text-[#8C6B3A] transition-colors"
aria-label="Toggle menu"
aria-expanded={isOpen}
>
@@ -219,7 +219,7 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
{/* Modern Mobile Menu Drawer (slide-in, animated, high-contrast, touch-friendly) - high z to always appear in front of hero banner video etc. */}
<AnimatePresence>
{isOpen && (
<div className="md:hidden fixed inset-0 z-[9999]">
<div className="lg:hidden fixed inset-0 z-[9999]">
{/* Backdrop */}
<motion.div
className="absolute inset-0 bg-[#101724]/70 backdrop-blur-md"
@@ -232,10 +232,14 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
{/* Sliding Panel - modern, full-bleed on small phones, elegant on larger */}
<motion.div
className="absolute right-0 top-0 bottom-0 w-[82%] max-w-[340px] bg-[#fbf7ef] shadow-2xl border-l border-[#c99a2e]/10 flex flex-col overflow-y-auto z-[10000]"
initial={{ x: '100%' }}
className={`absolute top-0 bottom-0 w-[82%] max-w-[340px] bg-[#fbf7ef] shadow-2xl flex flex-col overflow-y-auto z-[10000] ${
isRtl
? 'left-0 border-r border-[#c99a2e]/10'
: 'right-0 border-l border-[#c99a2e]/10'
}`}
initial={{ x: isRtl ? '-100%' : '100%' }}
animate={{ x: 0 }}
exit={{ x: '100%' }}
exit={{ x: isRtl ? '-100%' : '100%' }}
transition={{ type: 'spring', stiffness: 320, damping: 32 }}
>
{/* Header */}
@@ -294,7 +298,7 @@ export default function Navbar({ variant = "default" }: NavbarProps) {
</div>
{/* Secondary actions */}
<div className="mt-auto px-5 pb-8 pt-4 border-t border-[#EDE6D9] bg-white/40 space-y-3">
<div className="mt-auto px-5 pt-4 pb-[max(2rem,env(safe-area-inset-bottom))] border-t border-[#EDE6D9] bg-white/40 space-y-3">
<Link
href="/reserve"
onClick={closeMenu}