A mobile-responsive landing page for a demo Paleteria & Snacks store, built with Next.js. This project showcases a bilingual landing experience (English/Spanish), interactive menu, and a playful design optimized for both desktop and mobile.
⸻
• Mobile-first, responsive design with TailwindCSS.
• Sticky desktop navigation bar for quick access to sections.
• Hero section with a full-bleed looping video placeholder.
• Food menu using Swiper.js for smooth mobile navigation.
• Category icons to jump directly to menu sections.
• Flip card animation for food items (front: image + name, back: price + details).
• Language toggle (English/Spanish) powered by Zustand for global state.
• Hours & location section with embedded Google Maps and dummy contact info.
⸻
• Next.js 15 – React framework
• React 18 – UI library
• TailwindCSS – Styling
• Sass – Additional styling flexibility
• Swiper.js – Mobile food menu slider
• Zustand – State management
• classnames – Conditional class handling
⸻
Clone the repo and install dependencies:
git clone https://github.com/missatrox44/kds-paleteria.git
cd kds-paleteria
npm install
⸻
Start the development server:
npm run dev
Build for production:
npm run build
npm start
Run linting:
npm run lint
Then open: http://localhost:3000