Skip to content

Latest commit

 

History

History
37 lines (30 loc) · 2.02 KB

File metadata and controls

37 lines (30 loc) · 2.02 KB

🥗 Health & Well-being Web Project

🎓 University Project: Developed as part of the Year 1 University curriculum to demonstrate core web development skills in HTML5, CSS3, and Vanilla JavaScript.

An interactive, multi-page website dedicated to promoting "Good Health and Well-being." This project showcases a blend of content delivery, user interactivity, and a functional e-commerce frontend.

🚀 Key Features

  • Interactive Shop: A fully functional frontend store with "Add to Cart" logic, dynamic cart count, and product sorting (A-Z/Default).
  • Responsive Design: Implemented custom @media queries to ensure a seamless experience across different screen sizes.
  • Dynamic Content: Interactive product descriptions and a smooth "Page Editor" interface.
  • Splash Screen: Engaging entry point for the website.
  • Modern UI Components: Custom-styled navigation bars, product cards, and footers.

🛠️ Technical Highlights

  • Vanilla JavaScript: All interactivity, including cart logic and DOM manipulation, is built without external libraries.
  • Advanced CSS: Use of Flexbox, Floats, and Responsive Breakpoints for complex layouts.
  • Modular Structure: Separated CSS and JS files for better maintainability.
  • Form Handling: Integrated feedback and user profile interactions.

📂 Project Structure

├── css/                 # External stylesheets (Header, Shop, Footer, etc.)
├── js/                  # Vanilla JavaScript logic (Shop functionality)
├── images-and-videos/   # Media assets
├── shop.html            # E-commerce interface
├── content-page.html    # Health & Well-being information
├── page-editor.html     # Interactive editor tool
└── splash.html          # Website entry screen

⚙️ How to View

  1. Clone the repository.
  2. Open splash.html or shop.html in any modern web browser.
  3. No build step or local server is required (Static Site).

Built with ❤️ by Kavintha Dilshan