LenScape

This React project to showcase LandScape photos which I click through my Lens (Mobile Phone 😂).

Features

• Smooth navigation using React Router.
• Gradient animated logo and modern glassmorphic navbar.
• Mobile-optimized hamburger menu with sliding side panel.
• Fully responsive layout for desktops, tablets, and smartphones.
• Easy-to-extend Gallery and About sections.

---

Tech Used

Category	Technology	Description
Frontend	[React]	JavaScript library for building user interfaces
	[React Router DOM]	For routing between pages like Landing, Gallery, About
Styling	CSS (vanilla)	Component-level styling and layout
	Media Queries	Responsive design for all screen sizes
UI/Animation	CSS Transitions & Transforms	Smooth mobile hamburger + side panel animation
Development	Create React App / Vite	Scaffolding and dev tooling
Icons & Fonts	Custom / System Fonts	Gradient animated logo, hamburger icon, responsive text

File Structure

LenScape/
├── public/
│ └── images/
│ └── LenScapeLogo.png
├── src/
│ ├── componets/
│ │ ├── About/
│ │ ├── Gallery/
│ │ ├── LandingCompo/
│ │ ├── NavBar/
│ │ └── SidePanel/
│ ├── App.jsx
│ ├── App.css
│ ├── index.css
│ └── main.jsx
├── .gitignore
├── README.md
├── package.json
├── vite.config.js
└── index.html

Preview

Lenscape highlights stunning photo categories like:

• Astro & Night Photography
• Nature & Macro Shots
• Creative Edits
• Community Collaboration

---

Setup Instructions

1. Clone the repo
2. Run npm install
3. Run npm run dev to start the app

To Do

• Add dynamic photo gallery content from API or CMS
• Dark/light theme toggle
• Accessibility improvements (keyboard nav, aria labels)-

Contributing

Feel free to fork this project, make enhancements, and open pull requests!

✨ Developed by Tanush Bhootra