Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to create a professional web application for a restaurant, incorporating essential functionalities found in well-designed restaurant websites. The application will focus on providing users with easy access to information about the restaurant, menu items, reservations, and contact details, all while maintaining a clean and minimalist design.

## CORE FEATURES
1. **Hero Section**: A visually appealing hero section featuring the restaurant's name, tagline, and a call-to-action button to view the menu or make a reservation.
2. **Menu Display**: An interactive menu showcasing various food and drink items, complete with descriptions, prices, and images.
3. **Reservation System**: A user-friendly reservation form allowing customers to book tables online, complete with date, time, and party size options.
4. **About Us Section**: Information about the restaurant's history, mission, and team, enhancing customer connection and trust.
5. **Contact Information**: Clear display of contact details including phone number, email, and social media links, with an integrated map for location.
6. **Testimonials**: A section for customer reviews and testimonials to build credibility and attract new visitors.

## 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 layout will be structured with a top navigation bar, followed by the hero section, menu display, reservation form, about us section, testimonials, and a footer for contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Zustand for state management

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui components, along with any necessary libraries for form handling and routing.
3. **Create Layout Components**: Develop reusable components for the header, footer, and main sections (hero, menu, reservation, about, testimonials).
4. **Implement Routing**: Set up React Router for navigation between different sections if needed.
5. **Build Menu Component**: Create a dynamic menu component that pulls data from a static JSON file or API.
6. **Develop Reservation Form**: Implement a form component with validations to handle user reservations.
7. **Design Responsive UI**: Ensure all components are responsive and adapt to various screen sizes using Tailwind CSS utilities.
8. **Test Functionality**: Perform thorough testing to ensure all features work as expected and fix any bugs.

## USER EXPERIENCE
Users will first encounter the hero section upon landing on the page, where they can easily navigate to the menu or make a reservation. The menu will provide an engaging overview of available dishes, while the reservation form will guide users through the booking process with clear prompts. The about us section will offer insights into the restaurant, enhancing user trust. Testimonials will showcase customer satisfaction, encouraging new visitors to dine at the restaurant. The overall experience will be intuitive, visually pleasing, and focused on facilitating user interactions with minimal distractions.