Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project entails creating a comprehensive restaurant website that serves as a dynamic landing page. The website will feature a clean, minimalist design emphasizing user interaction and visual appeal, with a unique scrolling effect that transitions the content into a burger theme.

## CORE FEATURES
1. **Hero Section**: A visually striking introductory area that prominently displays the restaurant's branding, including the logo, a catchy tagline, and a call-to-action button to make reservations or view the menu.
2. **Menu Showcase**: An interactive section that highlights popular dishes with mouth-watering images and descriptions, encouraging visitors to explore food offerings.
3. **About Us**: A brief narrative about the restaurant's history, mission, and values, fostering a connection with potential customers.
4. **Testimonials**: A rotating carousel of customer reviews that builds trust and credibility for the restaurant.
5. **Contact Information**: A dedicated section with a contact form, phone number, and location map for easy customer reach-out.
6. **Scrolling Transition Effects**: Unique visual effects that transition the page content into engaging graphics as users scroll down, enhancing the overall experience.

## 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**: The main layout will follow a single-page structure with sections for the hero, menu, about, testimonials, and contact. Each section will be visually distinct yet cohesive, using ample whitespace and a straightforward flow to guide the user through the experience.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API (if needed for managing state across components)

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui for component styling.
2. **Create Main Components**: Build the primary components for each section of the website (Hero, Menu, About, Testimonials, Contact).
3. **Implement Scrolling Effects**: Use CSS animations and JavaScript to create the fade and transition effects as users scroll.
4. **Style Components**: Apply Tailwind CSS classes to each component, ensuring adherence to the design specifications, including typography and color scheme.
5. **Add Content**: Populate the sections with relevant text, images, and links, ensuring they align with the restaurant's branding.
6. **Test Responsiveness**: Ensure the website is fully responsive across different devices and screen sizes.

## USER EXPERIENCE
The user will be greeted with an eye-catching hero section that encourages them to scroll down. As they navigate through the website, a smooth transition effect will draw them into the menu, about, testimonials, and contact sections. Users can easily interact with the call-to-action buttons for reservations or inquiries, enhancing engagement and conversion opportunities. The minimalist design ensures that the user experience remains intuitive and enjoyable, guiding visitors seamlessly through the restaurant's offerings.