This commit overhauls the chat page UI for a cleaner, more modern aesthetic inspired by popular messaging apps.
Key changes include:
- Redesigned the chat header to display the user's name and role.
- Replaced the message input area with a WhatsApp-style layout.
- Added user avatars to received messages and a person icon to sent messages for clearer identification.
- Swapped custom SVG icons with Bootstrap Icons for consistency and easier maintenance.
- Removed the floating circles background animation from both the chat and login pages to reduce visual clutter and improve focus.
This commit introduces a new, self-contained chat page, including the necessary HTML, CSS, and JavaScript files.
The page features a modern, responsive design with a glassmorphism effect on the main chat container, a gradient background with animated floating circles, and a clear layout for displaying sent and received messages.
- `index.html`: Defines the structure for the header, message area, and input form.
- `style.css`: Provides the visual styling, including the glass effect, message bubbles, and responsive adjustments.
- `script.js`: Contains the initial client-side logic for adding messages to the chat.
- Created login page with email/number toggle functionality
- Added input validation and phone number formatting
- Implemented background animation and responsive design
- Set up webhook integration for form submissions
