Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed for playing various types of media, including audio, video, and PDF files of all extensions. The application aims to provide users with a seamless experience for managing and playing their media files in a clean and minimalist interface.

## CORE FEATURES
1. **Media Playback**: Support for audio and video playback with controls for play, pause, skip, and volume adjustment.
2. **PDF Viewer**: Integrated PDF viewer allowing users to open and read PDF documents directly within the app.
3. **File Management**: Users can upload and manage their media files easily, with options for organizing files into folders.
4. **Search Functionality**: A robust search feature to quickly find specific media files based on file name or type.
5. **Responsive Design**: The application will be fully responsive, ensuring usability across devices, including desktops, tablets, and smartphones.
6. **User Accounts**: Option for users to create accounts for saving preferences and managing their media library.

## 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 consist of a header for navigation, a central media playback area, and a sidebar for file management. The footer will contain links for support and contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Context API as required for managing user state and media library.

## IMPLEMENTATION STEPS
1. **Set Up Environment**: Create a new React application using Create React App with TypeScript.
2. **Install Dependencies**: Install Tailwind CSS, shadcn/ui, and any necessary libraries for media playback and PDF viewing.
3. **Create Components**: Develop the main components including Header, MediaPlayer, PDFViewer, FileManager, and Footer.
4. **Implement Routing**: Set up routing for user account management and main application features.
5. **Design Layout**: Apply Tailwind CSS for styling according to the design specifications, ensuring responsiveness.
6. **Integrate Media Playback**: Implement audio and video playback functionality using appropriate libraries.
7. **Add PDF Viewer**: Integrate a PDF viewing library to allow for in-app PDF file viewing.
8. **Test Functionality**: Thoroughly test the application on different devices and screen sizes.
9. **Deploy Application**: Prepare the application for deployment on a web hosting platform.

## USER EXPERIENCE
Users will start with a welcoming homepage that showcases their media library. They can easily upload files and navigate through their collections using an intuitive interface. Playback controls will be prominent during media playback, enabling a smooth experience. The application will remember user settings, making it easy for them to return to their favorite media anytime. Responsive design ensures that the application works great on all devices, providing a consistent user experience.