Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project "robux" is envisioned as a web application that serves as a minimalist platform for managing and tracking Robux, the virtual currency used in the Roblox gaming platform. The main purpose is to provide users with an easy and intuitive interface to view their Robux balance, transaction history, and tips for earning more Robux.

## CORE FEATURES
1. **User Authentication**: Secure login and registration system allowing users to create accounts and manage their profiles.
2. **Robux Balance Tracker**: A dashboard displaying the current Robux balance, with options to refresh or sync the data.
3. **Transaction History**: A detailed list of past transactions, including purchases and earnings, with filters for easy navigation.
4. **Earning Tips**: A section dedicated to providing users with strategies and tips on how to earn more Robux within the Roblox ecosystem.
5. **Responsive Design**: A layout that adapts seamlessly across devices, ensuring optimal usability on both desktop and mobile.
6. **User Settings**: An area for users to adjust their profile settings and preferences, including notification settings.

## 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**: A structured layout with a top navigation bar, a main dashboard area for displaying the balance and transaction history, and a side panel for tips and user settings.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui for a consistent and modern UI experience.
- **State Management**: Redux Toolkit (if necessary for managing complex state).

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Authentication Module**: Implement user authentication using Firebase or another authentication service.
4. **Build Dashboard Component**: Create the main dashboard component to display the Robux balance and transaction history.
5. **Design Transaction History**: Develop a component to list and filter past transactions using a table format.
6. **Add Earning Tips Section**: Create a simple section for users to read tips on earning Robux.
7. **Implement User Settings**: Develop settings functionality that allows users to update their profiles and preferences.
8. **Responsive Design**: Ensure all components are responsive and optimized for mobile and desktop views.
9. **Testing and Deployment**: Conduct thorough testing, fix any issues, and deploy the application using a platform like Vercel or Netlify.

## USER EXPERIENCE
Users will start by logging into their accounts from a welcoming homepage. After authentication, they will be directed to their dashboard, where they can see their current Robux balance prominently displayed. Users can view their transaction history with easy navigation and filtering options. The tips section will provide valuable insights for earning more Robux, enhancing the overall user engagement and experience. The design will maintain simplicity and clarity, ensuring users can easily navigate through the application without confusion.