Update index.html
Browse files- index.html +59 -59
index.html
CHANGED
|
@@ -7,73 +7,73 @@
|
|
| 7 |
<link rel="stylesheet" href="styles.css">
|
| 8 |
</head>
|
| 9 |
<body>
|
| 10 |
-
|
| 11 |
-
|
| 12 |
-
|
| 13 |
-
|
| 14 |
-
|
| 15 |
-
|
| 16 |
-
|
| 17 |
-
|
| 18 |
-
|
| 19 |
-
|
| 20 |
-
</div>
|
| 21 |
-
</div>
|
| 22 |
</div>
|
|
|
|
|
|
|
| 23 |
|
| 24 |
-
|
| 25 |
-
|
| 26 |
-
|
| 27 |
-
|
| 28 |
-
|
| 29 |
-
|
| 30 |
-
|
| 31 |
-
|
| 32 |
-
|
| 33 |
-
|
| 34 |
-
|
| 35 |
-
|
| 36 |
-
|
| 37 |
-
|
| 38 |
-
|
| 39 |
-
|
| 40 |
-
|
| 41 |
-
|
| 42 |
-
|
| 43 |
-
|
| 44 |
-
|
| 45 |
-
|
| 46 |
-
|
| 47 |
-
|
| 48 |
-
|
| 49 |
-
|
| 50 |
-
|
| 51 |
-
|
| 52 |
-
|
| 53 |
-
|
| 54 |
|
| 55 |
-
|
| 56 |
-
|
| 57 |
-
|
| 58 |
-
|
| 59 |
-
|
| 60 |
|
| 61 |
-
|
| 62 |
-
|
| 63 |
-
|
| 64 |
-
|
| 65 |
-
|
| 66 |
-
|
| 67 |
-
|
| 68 |
-
|
| 69 |
-
</div>
|
| 70 |
-
</div>
|
| 71 |
</div>
|
|
|
|
| 72 |
</div>
|
|
|
|
| 73 |
|
|
|
|
|
|
|
| 74 |
|
| 75 |
-
<script src="https://cdn.jsdelivr.net/npm/jwt-decode@3.1.2/build/jwt-decode.min.js"></script>
|
| 76 |
-
<script src="script.js"></script>
|
| 77 |
|
| 78 |
</body>
|
| 79 |
</html>
|
|
|
|
| 7 |
<link rel="stylesheet" href="styles.css">
|
| 8 |
</head>
|
| 9 |
<body>
|
| 10 |
+
<div class="chat-container">
|
| 11 |
+
<!-- Sidebar for history -->
|
| 12 |
+
<div class="history-panel">
|
| 13 |
+
<div class="menu-icon" onclick="toggleHistory()">☰</div>
|
| 14 |
+
<div class="chat-history-text">
|
| 15 |
+
<br>
|
| 16 |
+
<br>
|
| 17 |
+
<h4>Chat History</h4>
|
| 18 |
+
<div class="history-items">
|
| 19 |
+
<!-- Dynamically added history items -->
|
|
|
|
|
|
|
| 20 |
</div>
|
| 21 |
+
</div>
|
| 22 |
+
</div>
|
| 23 |
|
| 24 |
+
<!-- Chat area -->
|
| 25 |
+
<div class="chat-panel">
|
| 26 |
+
<!-- Chat header with login and new chat -->
|
| 27 |
+
<div class="chat-header">
|
| 28 |
+
<h1>VERA AI Bot</h1>
|
| 29 |
+
<div class="icons">
|
| 30 |
+
<img src="newchat.png" alt="New Chat" class="header-icon" title="New Chat" onclick="startNewChat()" />
|
| 31 |
+
|
| 32 |
+
<div id="user-info" style="display: none;">
|
| 33 |
+
<span id="user-name"></span>
|
| 34 |
+
<button id="logout-button" style="display: none;">Logout</button>
|
| 35 |
+
</div>
|
| 36 |
+
<div id="login-link" style="display: block;">
|
| 37 |
+
<a href="login.html" title="Login">
|
| 38 |
+
<img src="login.png" alt="Login" class="header-icon" />
|
| 39 |
+
</a>
|
| 40 |
+
</div>
|
| 41 |
+
</div>
|
| 42 |
+
|
| 43 |
+
<div class="three-dot-menu" onclick="toggleMenu()">
|
| 44 |
+
⋮
|
| 45 |
+
<div class="menu-options">
|
| 46 |
+
<ul>
|
| 47 |
+
<li>Settings</li>
|
| 48 |
+
<li>Help</li>
|
| 49 |
+
<li>Logout</li>
|
| 50 |
+
</ul>
|
| 51 |
+
</div>
|
| 52 |
+
</div>
|
| 53 |
+
</div>
|
| 54 |
|
| 55 |
+
<!-- Chat body -->
|
| 56 |
+
<div class="chat-body" id="chatBody">
|
| 57 |
+
<div class="welcome-message bot-message">Hello! How can I assist you today?</div>
|
| 58 |
+
<!-- User and bot messages dynamically added here -->
|
| 59 |
+
</div>
|
| 60 |
|
| 61 |
+
<!-- Chat footer with input and mic button -->
|
| 62 |
+
<div class="chat-footer">
|
| 63 |
+
<div class="input-container">
|
| 64 |
+
<input type="text" id="userInput" placeholder="Type your message..." />
|
| 65 |
+
<button id="sendButton" onclick="sendMessage()">➤</button>
|
| 66 |
+
<button id="micButton" onclick="activateVoice()">
|
| 67 |
+
<img src="mic.png" alt="Mic" class="mic-icon">
|
| 68 |
+
</button>
|
|
|
|
|
|
|
| 69 |
</div>
|
| 70 |
+
</div>
|
| 71 |
</div>
|
| 72 |
+
</div>
|
| 73 |
|
| 74 |
+
<script src="script.js"></script>
|
| 75 |
+
<script src="https://cdn.jsdelivr.net/npm/jwt-decode@3.1.2/build/jwt-decode.min.js"></script>
|
| 76 |
|
|
|
|
|
|
|
| 77 |
|
| 78 |
</body>
|
| 79 |
</html>
|