Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for "El Fénix," a local bar and restaurant in Las Palmas de Gran Canaria. The primary purpose of the landing page is to showcase the establishment, highlight customer reviews, present the menu, and provide contact information, ultimately driving users to visit or order online.

## CORE FEATURES
1. **Hero Section**: A visually appealing introduction featuring the restaurant's name, rating (4.1), and a brief tagline about the homemade food and friendly service.
2. **Menu Highlights**: A dedicated section displaying popular dishes with images and descriptions to entice potential customers.
3. **Customer Reviews**: A dynamic area showcasing recent customer reviews to build trust and credibility, featuring both positive and critical feedback.
4. **Contact Information**: Clear and accessible contact details, including phone number, address, and links to social media.
5. **Call to Action (CTA)**: Prominent buttons for online ordering and making reservations to facilitate user engagement.
6. **Map Integration**: An embedded map showing the location of El Fénix for easy navigation.

## 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 have a full-width hero section, followed by grid or card-style displays for the menu and reviews, and a footer with contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not necessary for this landing page.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling.
3. **Create Components**: Build reusable components for the hero section, menu highlights, reviews, and contact information.
4. **Implement Layout**: Organize components within the main application layout, ensuring responsiveness for various screen sizes.
5. **Add Styles**: Apply Tailwind CSS classes to style components according to the design specifications.
6. **Integrate Map**: Use a mapping service (like Google Maps API) to display the restaurant's location.
7. **Test Functionality**: Ensure all links and buttons work correctly, and the layout adapts well to different devices.

## USER EXPERIENCE
Users will be greeted with a captivating hero image and tagline, followed by a visually organized menu and reviews that encourage them to explore the offerings. Clear CTAs will guide them to make reservations or order online, while the contact section and embedded map provide easy access to essential information. The minimalist design will ensure a smooth and enjoyable browsing experience, focusing on the restaurant’s appeal.