Welcome to Bit Bites — a retro pixel-themed recipe discovery website where you can search, explore, and save your favorite meals in style!
- 🎨 Retro Pixel UI — designed with 8-bit aesthetics and pixel fonts.
- 🔍 Recipe Search — search meals by name using TheMealDB API.
- ❤️ Save/Unsave Recipes — one-click save with local storage.
- 🍴 Categories — explore by Desserts, Fast Food, Healthy, or Seafood.
- 🌙 Dark Mode — toggle for comfy night-time browsing.
- 📱 Mobile Responsive — hamburger menu, clean layout, and one-card views on phones.
- 🎈 Floating Icons — retro food icons float across the hero section.
🔗 Click here to visit Bit Bites
- HTML5
- CSS3 (with custom pixel styling + media queries)
- JavaScript
- TheMealDB API - https://www.themealdb.com
- You search for a recipe → it fetches using TheMealDB API.
- Related recipes are suggested automatically.
- Clicking ❤️ Save stores the recipe in your browser’s local storage.
- Saved recipes appear in the Favourites tab and can be unsaved with one click.
- Mobile users see a compact layout.
bit-bites
│
├── index.html
├── favorites.html
├── about.html
├── category.html
├── style.css
├── script.js
├── /pictures
│ ├── chef.png
│ ├── burger.png
│ └── ... (floating food icons)
- 📝 Add recipe instructions in popups.
- 📤 Add "Share" buttons (copy link to clipboard).
- 🛍️ Add a shopping list planner.
- 📦 Convert into a PWA for offline recipe access.
- 🍽️ TheMealDB for the free meal API.
- 🎮 Pixel font: Press Start 2P
Made with ❤️ by [Manya Davesar]
- GitHub: (https://github.com/manyadavesar10)
- Linkedin: (https://www.linkedin.com/in/manya-davesar-73a44a348/)
💾 Don't forget to ⭐ star this repo if you like it!