Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Create a modern, professional landing page for "Chef Zuidhorn", a cafeteria aimed at attracting customers to order online or visit in person. The website will emphasize a reliable, clean, and professional aesthetic while showcasing menu items and promoting online orders.

## CORE FEATURES
1. **Header**: Includes the Chef Zuidhorn logo on the left and navigation links (Home, Menu, Contact) on the right.
2. **Hero Section**: A large, eye-catching image of food with a tagline "Lekker en snel eten in Zuidhorn" and prominent call-to-action buttons: "Bestel nu" and "Bekijk menu".
3. **About Us**: A brief description of Chef Zuidhorn, including the address and contact number, emphasizing quality and service.
4. **Popular Dishes**: A section highlighting popular menu items such as Broodje Beenham, Patat Shoarma, and Milkshakes.
5. **Reviews Section**: Displays customer ratings and feedback, reinforcing the cafeteria's commitment to improvement.
6. **Job Opportunities**: Information about working at Chef Zuidhorn, including a contact form for applicants to submit their details and CV.

## 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 features a top navigation bar, followed by a hero section, an about section, popular dishes, customer reviews, and job opportunities. Each section is clearly delineated with ample white space for easy navigation and readability.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specified, but consider using React's built-in state management for form handling.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create Components**: Develop reusable components for the header, hero section, about section, popular dishes, reviews, and job application form.
4. **Implement Routing**: Set up React Router for navigation between Home, Menu, and Contact pages.
5. **Design Layout**: Use Tailwind CSS to style components according to the design specifications, ensuring responsiveness across devices.
6. **Integrate Forms**: Implement form handling for job applications, ensuring validation and file upload for CVs.
7. **Add Animations**: Include subtle animations for button hover effects and transitions between sections to enhance user experience.
8. **Test and Deploy**: Conduct thorough testing on multiple devices before deploying the website.

## USER EXPERIENCE
The user experience should focus on seamless navigation and engagement. Users will land on the hero section, easily accessing the menu and order buttons. The design will prioritize quick loading times and mobile-friendliness, allowing users to quickly find information and complete orders. The job application form will be straightforward, guiding applicants through the submission process efficiently.