YannAhlgrim
43 lines
933 B
Markdown
43 lines
933 B
Markdown
# Frontend Setup Instructions
|
|
|
|
## Installation
|
|
|
|
To install the dependencies and set up Tailwind CSS:
|
|
|
|
```bash
|
|
cd frontend
|
|
npm install
|
|
```
|
|
|
|
This will install all the required dependencies including:
|
|
- Tailwind CSS
|
|
- PostCSS
|
|
- Autoprefixer
|
|
|
|
## Development
|
|
|
|
To start the development server:
|
|
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
The application will be available at `http://localhost:3000`
|
|
|
|
## Features
|
|
|
|
The new UI includes:
|
|
- Modern gradient background with purple/slate theme
|
|
- Animated recording button with visual feedback
|
|
- Status indicators for recording and processing states
|
|
- Audio visualizer for playback
|
|
- Responsive design that works on desktop and mobile
|
|
- User-friendly error notifications
|
|
- Step-by-step usage instructions
|
|
- Glassmorphism design elements
|
|
|
|
## Customization
|
|
|
|
You can customize the colors and animations by editing:
|
|
- `tailwind.config.js` - Theme configuration
|
|
- `styles/globals.css` - Custom CSS classes and animations |