Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
60 changes: 60 additions & 0 deletions Domains/Frontend/MiniProjects/ExploreNashik/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
# 🌟 Explore Nashik - Static Website

**Contributor:** [Tanmay-Kad](https://github.com/Tanmay-Kad)

This project is a **simple, responsive, single-page static website** about Nashik District, famously known as the *"Wine Capital of India."*

---

## 📝 Description

The website provides an overview of Nashik, highlighting its importance, history, and key attractions. It is built as a **single-page application** with smooth scrolling navigation between sections.

---

## 🚀 Features

- **Header & Navigation:** A sticky navigation bar that highlights the active section on scroll.
- **Mobile Responsive:** A fully responsive design with a collapsible mobile menu.

### Sections:

1. **Home:** A full-screen hero section with a background image.
2. **About:** A brief introduction to Nashik's history, geography (Godavari River), and cultural importance (Kumbh Mela).
3. **Tourist Attractions:** A card-based layout showcasing 6 popular destinations (Trimbakeshwar, Sula Vineyards, Pandav Leni, etc.).
4. **Festivals & Culture:** Information on local festivals, food, and culture.
5. **Gallery:** A responsive image grid.
6. **Contact:** A simple, styled HTML contact form.
7. **Back to Top:** A JavaScript-powered "Back to Top" button that appears on scroll.

---

## 🛠️ Technologies Used

- **HTML5:** For the core structure and content.
- **Tailwind CSS (CDN):** For all styling and layout, ensuring a modern, utility-first, and responsive design.
- **JavaScript (ES6+):** For all interactivity, including:
- Mobile menu toggle
- "Back to Top" button visibility and smooth scroll
- Active navigation link highlighting based on scroll position (using `IntersectionObserver`)

---

## 💻 How to Use

### 1. Single-File Version

If you are using the single `index.html` file (where CSS and JS are embedded):

- Simply open the `index.html` file in any modern web browser.

### 2. Multi-File Version (index.html, style.css, script.js)

If you are using the split files:

1. Ensure all three files (`index.html`, `style.css`, and `script.js`) are in the same directory.
2. Open the `index.html` file in any modern web browser.

---


Loading
Loading