Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a web application designed to simulate a fake robux sending feature, allowing users to customize the amount of robux they wish to send. The application aims to replicate the appearance and functionality of a genuine robux transaction interface, providing an engaging user experience while adhering to a minimalist design aesthetic.

## CORE FEATURES
1. **User Authentication**: Secure login and registration system to manage user accounts and ensure personalized experiences.
2. **Robux Amount Customization**: Users can easily select and customize the amount of robux they wish to send, with input validation to ensure reasonable entries.
3. **Transaction History**: A dashboard feature that displays the history of all transactions made by the user, including amounts and timestamps.
4. **User Profile Management**: Users can manage their personal information and preferences within the application.
5. **Responsive Design**: Ensures the application is usable on various devices, maintaining a consistent user experience across mobile and desktop.

## 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 hero section on the landing page, followed by customizable robux amount input, transaction history display, and user profile management sections. The navigation will be simple and intuitive, with a top navigation bar.

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

## IMPLEMENTATION STEPS
1. **Set up the React environment**: Initialize a new React project with TypeScript and install Tailwind CSS for styling.
2. **Create the Authentication System**: Implement user registration and login functionality using Firebase or a similar service.
3. **Build the Main Components**:
   - Create a Navbar component for easy navigation.
   - Develop a Hero component with a brief description of the app's purpose.
   - Design a Robux input component allowing users to customize amounts.
   - Implement a Transaction History component to display previous transactions.
   - Set up a User Profile component for managing personal information.
4. **Style the Components**: Use Tailwind CSS to apply the minimalist design specifications, including typography and color settings.
5. **Integrate State Management**: Set up Context API or Redux to manage the authentication state and transaction history.
6. **Test Responsive Design**: Ensure the application is fully responsive and works seamlessly across different devices.

## USER EXPERIENCE
Users will first encounter a welcoming hero section that introduces the application. After logging in, they can customize the robux amount they wish to send using an intuitive input field. Upon submission, their transaction will be recorded in their history, visible in the dashboard. Users can also update their profile information, ensuring a personalized experience. The clean and minimalist design will guide users through the application effortlessly, emphasizing functionality and ease of use.