README.md

🛍️ Uomo — E-Commerce Fashion Store

A modern, fully responsive e-commerce fashion store built with React and Tailwind CSS, inspired by the Uomo Figma theme.

🌐 Live Demo: Vercel · Netlify

---

✨ Features

🏠 Home Page

• Hero Banner / Slider — Full-width dynamic banner with call-to-action
• Category Section — Stylish product categories with card layout
• Trendy Products — Curated trending product grid
• Limited Products — Limited edition product showcase
• Spring Collection — Seasonal collection highlight section
• Starting Category — Entry-level category navigation
• Uomo Gallery — Visual brand gallery
• Trust Badges — Shipping, returns, and support highlights

🛒 Shop Page

• Shop Banner — Dedicated shop page hero
• Product Listing — All products with grid/list view
• Sort & View — Filter and sorting options

🧭 Navigation

• Responsive Header — Clean navbar with logo and icons
• Mega Menu — Hover-activated mega menus for Shop, Blog, and Pages
• Mobile Navigation — Fully functional mobile drawer menu
• Breadcrumb — Page location indicator

🎯 UI & UX

• Newsletter Popup — Timed modal (appears after 3s) with email subscription
• Cookie Consent Banner — GDPR-friendly cookie notice
• Scroll To Top — Smooth scroll-to-top button
• Footer — Full-featured site footer

---

🛠️ Tech Stack

Technology	Purpose
React	UI component library
Vite	Build tool & dev server
Tailwind CSS	Utility-first styling
React Router	Client-side routing
Font Awesome	Icon library

---

📁 Project Structure

src/
├── api/
├── assets/
├── Components/
│   ├── common/
│   │   ├── Breadcrumb.jsx
│   │   ├── CookieConsent.jsx
│   │   ├── Image.jsx
│   │   ├── Listitem.jsx
│   │   ├── NewsLetter.jsx
│   │   └── Product.jsx
│   ├── Home/
│   │   ├── category/
│   │   │   ├── Card.jsx
│   │   │   └── Category.jsx
│   │   ├── Banner.jsx
│   │   ├── LimitedProduct.jsx
│   │   ├── SpringCollection.jsx
│   │   ├── StartingCategory.jsx
│   │   ├── TrendyProducts.jsx
│   │   ├── TrustBadges.jsx
│   │   └── UomoGallery.jsx
│   ├── layout/
│   │   ├── Header/
│   │   │   ├── HoverEffect/
│   │   │   │   ├── BlogMegaMenu.jsx
│   │   │   │   ├── PagesMegaMenu.jsx
│   │   │   │   └── ShopMegaMenu.jsx
│   │   │   ├── Header.jsx
│   │   │   ├── MobileNab.jsx
│   │   │   └── MobileNavigation.jsx
│   │   ├── Footer.jsx
│   │   ├── RootLayout.jsx
│   │   └── ScrollToTop.jsx
│   ├── shop/
│   │   ├── AllProducts.jsx
│   │   ├── ShopBanner.jsx
│   │   └── SortAndView.jsx
│   └── ui/
│       └── Container.jsx
└── pages/
    ├── About.jsx
    ├── Home.jsx
    └── Shop.jsx

---

📄 Pages

Page	Route	Status
Home	/	✅ Done
Shop	/shop	✅ Done
About	/about	✅ Done

---

🎨 Design Reference

Built from the Uomo Figma Theme — a premium e-commerce UI kit featuring 12+ home page variants, shop pages, blog pages, and mobile layouts.

---

📝 License

This project is for educational and portfolio purposes only.

---

Made with ❤️ by Saiful Islam