Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web app designed for tracking and managing menstrual cycles. It allows users to log various health-related metrics and provides an intuitive interface for monitoring patterns over time. The app is tailored for personal use, enabling users to gather insights about their cycles and health in a clean, user-friendly environment.

## CORE FEATURES
1. **Menstrual Tracking**: Users can log bleeding details, including quantity and color, as well as methods of collection.
2. **Health Log**: Track various health metrics such as skin condition, mood, physical state, and energy levels, with options for predefined entries and custom additions.
3. **Calendar View**: A comprehensive calendar for users to consult the historical data of their cycles, allowing for easy navigation through past entries.
4. **Data Visualization**: A circular graph that displays the current cycle, which opens a detailed entry window upon click for easy data input.
5. **Profile Customization**: A dedicated screen for users to adjust their profiles and personalize their tracking experience.
6. **Pattern Recognition**: A feature that allows users to document and analyze patterns over time, enhancing their understanding of their health trends.

## 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 top navigation bar for easy access to different sections, a central dashboard with a calendar and graph, and side panels for quick entry and profile settings.

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

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Core Components**: Develop components for the calendar, graph, and data entry forms.
3. **Implement Routing**: Set up routing using React Router for navigating between main sections.
4. **Build State Management**: Integrate Redux or Context API to manage user data and preferences.
5. **Design User Interface**: Apply Tailwind CSS styles to ensure the minimalist aesthetic, following the specified design guidelines.
6. **Test Functionality**: Conduct thorough testing of all features to ensure smooth user interactions and data logging.
7. **Deploy Locally**: Set up the application to run on a local server for private use.

## USER EXPERIENCE
The user experience will focus on intuitive navigation, allowing users to effortlessly log their health metrics and view their cycle history. Users will interact primarily through the calendar and the graph, making entries simple with a prominent "Add" button. The design will emphasize clarity and accessibility, ensuring that all features are easy to find and use, ultimately promoting a seamless tracking experience.