Skip to content

Latest commit

 

History

History
88 lines (58 loc) · 3.28 KB

README.md

File metadata and controls

88 lines (58 loc) · 3.28 KB

Odin recipes


👩‍🍳 Odin Recipes

Odin Recipes provides information on my top  5️⃣  best realisable dishes from each region in Genshin Impact.

Live demo: https://mistervaliant.github.io/odin-recipes/

Generic badge


✒️ General Information

Ever wanted to have a taste of Mondstadt's , Liyue's or Inazuma's cuisine? 🤔

Odin Recipes provides my top  5️⃣  Genshin Impact recipes for each region that can be realised in real-life.

Experience the culinary arts of each region in the ambience of Genshin Impact with theme music, sound effects and sceneries.

🛈 About Genshin Impact:

Genshin Impact is an open-world action RPG. Set off on an adventure across Teyvat, a fantasy realm, to recover your missing sibling. You can wander seven different nations, interact with diverse characters with unique personalities and abilities, and engage in battle with them against formidable adversaries.


❤️ Motivation

The aim of this project is to revisit the basics of HTML, CSS and Javascript, and further understand the dos and don'ts of Fullstack Web Development using The Odin Project's (TOP) curriculum. Additionally, I always wanted to re-create Genshin Impacts' character selection page from their website.


👨‍💻 Technologies Used

HTML5 logo CSS logo javaScript logo

📌 Features

  • Day-Night Cycle
  • Theme music and sound effects
  • Regions' background
  • Genshin Impact's recipes in-game and IRL

📷 Screenshots

Website showcase


🗺️ Room for Improvement

Issues:

  • Sound effects takes time to play when first opened (or after 10 minutes [Github's cache])
  • Sliders are created programmatically in Javascript (Not a proper approach).
  • Performance issues for mobile devices

🔗 Acknowledgements

This project was inspired by Genshin Impact's Character Selection Page

Sound Effects:

  • Minecraft's Click
  • Discord's mute
  • Legend of Zelda BOTW's teleport

Other References:


Contact

Created by @MisterValiant - feel free to contact me! 📧

Project Status: Completed