- On mobile (<768px): posters shown while scrolling the menu.
- After user stops scrolling and lingers on a video item for ~2s: the animation (video) plays in place of the poster (replaces img opacity, plays video, hides gradient).
- On scroll/touchmove resume: immediately pause videos and show posters.
- Initial load on mobile: auto-plays the first focused video item after settle.
- Added isMobile state + resize listener, scroll/touch listeners with 2s debounce timeout.
- Helper functions: playMobileVideo(id), pauseAllMobileVideos(), findFocusedVideoItem() (visibility + center scoring).
- Data attributes data-id and data-has-video added to .menu-card for reliable targeting.
- Desktop hover logic untouched.
- Only affects items with .video in menu-data (e.g. Lahore Chana now works on mobile too).
- Cleanup on unmount/resize to desktop.
- Builds cleanly.
- Added complete Urdu translations for all menuDescriptions (and signatureMenuItems) in lib/translations.ts so descriptions localize properly when language=ur.
- Updated sidebar 'All Dishes' label to use translated t.menu.allDishes.
- Descriptions now correctly appear in Urdu (while dish names remain unchanged) on /menu page and homepage signature section.
- Builds cleanly.
- Make 'Signaturmeny' h2 responsive (smaller base font + break-words) so it doesn't overflow on mobile.
- Add signatureMenuItems and menuDescriptions to translations (en/sv + fallbacks for hi/ur).
- Update homepage signature cards and full menu page to use translated descriptions (while keeping dish names unchanged as requested).
- Swedish descriptions now active by default.
- Moved mobile drawer (and AnimatePresence) out of <nav> into sibling in React fragment so its z-index is evaluated at root stacking context (was previously confined inside nav's z context).
- Raised mobile menu container to z-[9999], sliding panel to z-[10000].
- Bumped LanguageSwitcher backdrop/dropdown to z-[9998]/z-[9999] for when opened from inside mobile menu.
- Lowered hero video to z-0 and gradient to z-5 (true background).
- Nav back to z-[50] (still above normal content).
- This ensures the full mobile menu (hamburger + drawer + language dropdown when clicked inside it) always stacks above the mobile_banner video and is fully visible.
- Set 'sv' as default in LanguageProvider + layout (users can switch to 'en')
- Completely revamped mobile drawer menu: slide animation (framer-motion), icons, active states with high-contrast text, large touch targets, better tap feedback
- Horizontal snap-scrolling category filters on mobile (homepage + /menu) for thumb-friendly UX
- Added active:scale / touch-manipulation + press states across cards, buttons, filters for better mobile tap visibility/feedback
- Updated translations for menu page, locations, footer, experience (Swedish-first)
- Made locations + footer language-aware
- Trimmed banner_mobile.mp4 (raw + re-optimized) from 6s to 4s for faster load on mobile
- Reordered languages so Svenska appears first in switcher
- .gitignore already protects developer_instructions.txt (previous commit)
- Add banner_mobile.mp4 (portrait source asset for phones/iPads)
- Generate optimized versions (banner_mobile-optimized.webm ~295KB + .mp4 ~224KB) for fast loading using VP9/H264 at 540x956
- Update hero <video> in app/page.tsx to use <source media='(max-width: 1024px)'> so mobile devices and iPads get the portrait banner for proper visualization (WebM first for size, MP4 fallback)
- Desktop/large screens continue using the existing landscape banner1.mp4
- Keeps existing responsive object-position framing and structure
This improves mobile hero experience above the signature menu.
- Royal cream + gold theme
- Playful animated hero with chef mascot
- Advanced menu with sidebar + video hover
- Multilingual support (EN, SV, HI, UR)
- Cart system with WhatsApp ordering
- Real restaurant photos integration
- Responsive design with proper navbar
Zeeshan Khan