Lovable Prompt Creator - AI Prompt Generator

# ## # ## ### # ## APPLICATION OVERVIEW
This project will be a web application designed for selling clothes across various styles such as old money, streetwear, and archive. The site will feature a minimalist aesthetic with a dark theme, allowing users to easily browse through different clothing categories and styles. The goal is to create a visually appealing and user-friendly platform for fashion enthusiasts.

## CORE FEATURES
1. **Homepage with Hero Section**: A visually striking hero section showcasing featured clothing items and styles to grab the user's attention immediately.
2. **Category Sections**: Dedicated sections for different clothing styles (grunge, old money, streetwear, archive) that allow users to filter and explore items based on their preferences.
3. **Product Listings**: A clean layout displaying various clothing types such as t-shirts, shirts, sweaters, knitwear, jackets, hoodies, pants, shoes, and hats, with images and brief descriptions.
4. **Product Detail Pages**: Each item will have a detailed page with images, descriptions, pricing, and an option to add to cart.
5. **Shopping Cart Functionality**: Users can add items to their cart, view total prices, and proceed to checkout.
6. **Responsive Design**: The application will be fully responsive, ensuring usability on various devices, from desktops to mobile phones.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: A grid layout for product listings, with a clear navigation bar at the top for easy access to different clothing categories. The hero section will be prominently displayed at the top of the homepage.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux (or Context API) for managing the shopping cart and user session.

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project for styling and UI components.
3. **Create Folder Structure**: Organize components, pages, and styles into respective folders for maintainability.
4. **Design the Homepage**: Implement the hero section and category sections using the defined layout specifications.
5. **Build Product Listing Component**: Create a component to display various clothing items dynamically based on categories.
6. **Develop Product Detail Pages**: Implement routing to product detail pages and ensure all necessary details are displayed.
7. **Implement Shopping Cart Functionality**: Create a cart component and integrate it with state management to handle item addition and removal.
8. **Ensure Responsiveness**: Use Tailwind CSS responsive utilities to make sure the application looks great on all screen sizes.
9. **Test All Features**: Conduct thorough testing to ensure all functionalities work as expected and fix any bugs.

## USER EXPERIENCE
Users will start their journey on the homepage, greeted by visually appealing images and a clear navigation menu. They will be able to explore different clothing styles through dedicated sections, click on items for detailed views, and easily add products to their shopping cart. The checkout process will be streamlined, focusing on user convenience, making it easy for them to complete their purchases. The responsive design ensures a seamless experience across various devices, enhancing user engagement and satisfaction.