Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a web application for a news platform, combining elements from established news outlets like NDTV and Particle. The application will feature a card-based structure to display articles and news updates, enhanced with AI functionalities to provide personalized content and recommendations. The focus will be on delivering an engaging user experience through a clean and minimalist design.

## CORE FEATURES
1. **News Feed**: A dynamic, card-based layout showcasing the latest news articles, categorized by topics and trending stories.
2. **AI-Powered Recommendations**: Utilizing AI algorithms to suggest articles based on user preferences and reading history.
3. **Search Functionality**: An intuitive search bar for users to quickly find specific news articles or topics of interest.
4. **User Authentication**: Secure login and signup options to allow users to save preferences and bookmark articles.
5. **Article Detail View**: A dedicated page for each article that includes text, images, and related articles, enhancing user engagement.
6. **Feedback System**: A feature that allows users to rate articles and provide feedback, which can help improve content delivery.

## 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 responsive grid layout for the news feed, featuring modular cards for each article. The header will include a search bar and navigation links, while the footer will have contact information and social media links.

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

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS for styling.
2. **Create Components**: Develop reusable components such as Card, Header, Footer, and Search Bar.
3. **Establish Routing**: Use React Router to manage navigation between the home page and article detail views.
4. **Integrate State Management**: Set up Redux or Context API to manage user authentication and saved articles.
5. **Implement AI Features**: Integrate APIs for AI recommendations based on user interactions and preferences.
6. **Design Layout**: Apply Tailwind CSS to style components according to the minimalist design specifications.
7. **Testing**: Conduct thorough testing for usability and responsiveness across different devices and screen sizes.

## USER EXPERIENCE
Users will be greeted with a clean homepage displaying the latest news articles in a card format. They can easily search for specific topics using the search bar at the top. Clicking on an article card will take them to a detailed view, where they can read the full article and see related content. Users can log in to save their favorite articles and receive personalized recommendations, enhancing their overall engagement with the platform. The application will maintain a consistent visual style, ensuring a pleasant browsing experience across all devices.