Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed to serve as a file previewer for uploaded documents, allowing users to quickly see the contents of their files before finalizing their submissions. The application will feature a clean, minimalist design to ensure a seamless user experience, focusing on efficiency and simplicity.

## CORE FEATURES
1. **File Upload**: Users can easily upload files through a drag-and-drop interface or file selector.
2. **Preview Functionality**: The application generates a preview of the uploaded file, displaying relevant content clearly and concisely.
3. **Error Handling**: Users receive feedback if the file type is unsupported or if there are issues with the upload.
4. **Responsive Design**: The application is fully responsive, working well on both desktop and mobile devices.
5. **Clear Call-to-Action**: Users are guided to proceed with further actions after previewing their files.

## 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 feature a centered file upload area at the top, followed by the file preview section, and a clear call-to-action button at the bottom.

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

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui for styling.
2. **Create the File Upload Component**: Implement a file upload component that handles drag-and-drop functionality and file selection.
3. **Implement Preview Functionality**: Use a file reader to generate a preview of the uploaded file and display it in the preview section.
4. **Add Error Handling**: Implement logic to handle unsupported file types and provide user feedback.
5. **Design the Layout**: Structure the application using Tailwind CSS for a minimalist aesthetic, ensuring proper spacing and alignment.
6. **Test Responsiveness**: Ensure the application looks good on various screen sizes and make adjustments as necessary.
7. **Deploy the Application**: Once completed, deploy the application to a hosting platform for public access.

## USER EXPERIENCE
Users will begin by uploading their files through an intuitive interface. Upon upload, they will see a preview of the file content without any distractions. Clear call-to-action buttons will guide them on what to do next, ensuring a smooth and efficient interaction throughout the process. The application’s design will enhance usability, with responsive elements that adapt to different devices for a consistent experience.