Animated Offline ChatGPT Frontend

I'll create a unique animated frontend for your offline ChatGPT with all the requested features: hamburger menu with chat history, automatic topic titles, voice commands, and theme switching.

Features Implemented

1. Unique Animated Interface

   • Particle animation background that changes with theme
   • Typing animation for AI responses
   • Smooth transitions and motion effects

2. Hamburger Menu with Chat History

   • Slide-out menu with all chat sessions
   • Auto-generated titles based on conversation content
   • Timestamp and message count for each chat

3. Voice Command Functionality

   • Microphone button next to the chat input
   • Speech-to-text conversion using the Web Speech API
   • Visual indicator when voice recording is active

4. Light and Dark Mode Theme

   • Smooth theme transition with animated icon
   • Custom color scheme with purple and pink gradients
   • Theme-aware background animations

5. Responsive Design

   • Works on all screen sizes
   • Optimized layout for mobile and desktop

6. Additional Features

   • Animated message bubbles
   • Auto-scrolling to latest messages
   • New chat creation
   • Simulated AI responses (replace with your offline AI logic)

How to Use

1. Chat Interface: Type messages in the input box and press Enter or click the Send button.
2. Voice Commands: Click the microphone icon to start voice input, speak your message, and it will be transcribed.
3. Theme Toggle: Click the sun/moon icon in the top right to switch between light and dark mode.
4. Chat History: Click the hamburger menu icon to view your chat history, and click on any chat to load it.
5. New Chat: Create a new chat by clicking "New Chat" in the sidebar.

The interface uses a unique color scheme with purple and pink gradients, animated particles, and smooth transitions for a modern, engaging experience.

Let me provide a simpler version of the chat interface that should work properly. I'll focus on the core functionality without the complex animations that might be causing issues.

Simplified Offline ChatGPT Interface

I've created a simpler version of the chat interface that should work properly. This version includes all the core functionality but with less complex animations that might have been causing issues.

Key Features

1. Chat Interface with Purple Theme

   • Clean, modern design with purple accents
   • Gradient background that changes with theme
   • Simple message bubbles for user and AI

2. Hamburger Menu with Chat History

   • Slide-out menu with all your chat sessions
   • Auto-generated titles based on conversation content
   • Timestamp and message count for each chat

3. Voice Command Functionality

   • Microphone button next to the chat input
   • Speech-to-text conversion
   • Visual indicator when voice recording is active

4. Light and Dark Mode Theme

   • Toggle between light and dark themes
   • Animated sun/moon icon for theme switching
   • Theme-appropriate colors throughout the interface

5. Responsive Design

   • Works on all screen sizes
   • Optimized layout for mobile and desktop

How to Use

1. Start Chatting: Type your message in the input box at the bottom and press Enter or click the Send button.
2. Voice Input: Click the microphone icon to start voice input, speak your message, and it will be transcribed.
3. Switch Themes: Click the sun/moon icon in the top right to toggle between light and dark mode.
4. View Chat History: Click the hamburger menu icon in the top left to see your previous conversations.
5. Start New Chat: Click "New Chat" in the sidebar to begin a fresh conversation.

This simplified version should work properly while still providing all the functionality you requested.