Hugging Face's logo

Spaces:
THEMONEYHOLLIC
/
minutes-pro
Running

App Files Community
THEMONEYHOLLIC commited on
Commit
4837837
·
verified ·
1 Parent(s): 8344136

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +1235 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Minutes Pro
3
- emoji: 😻
4
- colorFrom: green
5
- colorTo: blue
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: minutes-pro
3
+ emoji: 🐳
4
+ colorFrom: gray
5
+ colorTo: pink
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,1235 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Meeting Minutes Pro | Real-Time Collaboration</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .sidebar-collapsed {
11
+ width: 60px;
12
+ }
13
+ .sidebar-expanded {
14
+ width: 260px;
15
+ }
16
+ .transcription-active {
17
+ box-shadow: 0 0 0 2px #3b82f6;
18
+ }
19
+ .note-card:hover {
20
+ transform: translateY(-2px);
21
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
22
+ }
23
+ .waveform {
24
+ height: 30px;
25
+ background: linear-gradient(90deg, #3b82f6 0%, #3b82f6 var(--progress, 0%), #e5e7eb var(--progress, 0%), #e5e7eb 100%);
26
+ }
27
+ @keyframes pulse {
28
+ 0%, 100% { opacity: 1; }
29
+ 50% { opacity: 0.5; }
30
+ }
31
+ .pulse {
32
+ animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
33
+ }
34
+ .page {
35
+ display: none;
36
+ }
37
+ .page.active {
38
+ display: block;
39
+ }
40
+ </style>
41
+ </head>
42
+ <body class="bg-gray-50 text-gray-800 font-sans">
43
+ <div class="flex h-screen overflow-hidden">
44
+ <!-- Sidebar -->
45
+ <div id="sidebar" class="sidebar-expanded bg-white shadow-md flex flex-col transition-all duration-300 ease-in-out">
46
+ <div class="p-4 border-b border-gray-200 flex items-center justify-between">
47
+ <div class="flex items-center space-x-2">
48
+ <i class="fas fa-clock text-blue-500 text-xl"></i>
49
+ <span id="app-name" class="font-bold text-lg">Minutes Pro</span>
50
+ </div>
51
+ <button id="toggle-sidebar" class="text-gray-500 hover:text-gray-700">
52
+ <i class="fas fa-chevron-left"></i>
53
+ </button>
54
+ </div>
55
+
56
+ <div class="flex-1 overflow-y-auto">
57
+ <div class="p-4">
58
+ <button id="new-meeting-btn" class="w-full bg-blue-500 hover:bg-blue-600 text-white py-2 px-4 rounded-lg flex items-center justify-center space-x-2">
59
+ <i class="fas fa-plus"></i>
60
+ <span>New Meeting</span>
61
+ </button>
62
+ </div>
63
+
64
+ <div class="px-4 py-2">
65
+ <h3 class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Today</h3>
66
+ <ul class="mt-2 space-y-1">
67
+ <li>
68
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md" data-page="meeting">
69
+ <i class="fas fa-microphone mr-3 text-blue-500"></i>
70
+ <span>Team Standup</span>
71
+ </a>
72
+ </li>
73
+ <li>
74
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="meeting">
75
+ <i class="fas fa-check-circle mr-3 text-green-500"></i>
76
+ <span>Project Review</span>
77
+ </a>
78
+ </li>
79
+ </ul>
80
+ </div>
81
+
82
+ <div class="px-4 py-2 mt-4">
83
+ <h3 class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Upcoming</h3>
84
+ <ul class="mt-2 space-y-1">
85
+ <li>
86
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="meeting">
87
+ <i class="fas fa-calendar-alt mr-3 text-purple-500"></i>
88
+ <span>Client Demo (Tomorrow)</span>
89
+ </a>
90
+ </li>
91
+ <li>
92
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="meeting">
93
+ <i class="fas fa-calendar-alt mr-3 text-purple-500"></i>
94
+ <span>Sprint Planning (Fri)</span>
95
+ </a>
96
+ </li>
97
+ </ul>
98
+ </div>
99
+
100
+ <div class="px-4 py-2 mt-4">
101
+ <h3 class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Templates</h3>
102
+ <ul class="mt-2 space-y-1">
103
+ <li>
104
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="templates">
105
+ <i class="fas fa-file-alt mr-3 text-yellow-500"></i>
106
+ <span>Standup Meeting</span>
107
+ </a>
108
+ </li>
109
+ <li>
110
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="templates">
111
+ <i class="fas fa-file-alt mr-3 text-yellow-500"></i>
112
+ <span>Retrospective</span>
113
+ </a>
114
+ </li>
115
+ <li>
116
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="templates">
117
+ <i class="fas fa-file-alt mr-3 text-yellow-500"></i>
118
+ <span>Board Meeting</span>
119
+ </a>
120
+ </li>
121
+ </ul>
122
+ </div>
123
+
124
+ <div class="px-4 py-2 mt-4">
125
+ <h3 class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Settings</h3>
126
+ <ul class="mt-2 space-y-1">
127
+ <li>
128
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="settings">
129
+ <i class="fas fa-cog mr-3 text-gray-500"></i>
130
+ <span>Preferences</span>
131
+ </a>
132
+ </li>
133
+ <li>
134
+ <a href="#" class="nav-link flex items-center px-2 py-2 text-sm rounded-md hover:bg-gray-100" data-page="integrations">
135
+ <i class="fas fa-plug mr-3 text-blue-400"></i>
136
+ <span>Integrations</span>
137
+ </a>
138
+ </li>
139
+ </ul>
140
+ </div>
141
+ </div>
142
+
143
+ <div class="p-4 border-t border-gray-200">
144
+ <div class="flex items-center">
145
+ <div class="w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center text-white font-semibold">JD</div>
146
+ <div class="ml-3">
147
+ <p class="text-sm font-medium">John Doe</p>
148
+ <p class="text-xs text-gray-500">Free Plan</p>
149
+ </div>
150
+ <button class="ml-auto text-gray-500 hover:text-gray-700">
151
+ <i class="fas fa-cog"></i>
152
+ </button>
153
+ </div>
154
+ </div>
155
+ </div>
156
+
157
+ <!-- Main Content -->
158
+ <div class="flex-1 flex flex-col overflow-hidden">
159
+ <!-- Meeting Page -->
160
+ <div id="meeting-page" class="page active flex-1 flex flex-col overflow-hidden">
161
+ <!-- Top Bar -->
162
+ <header class="bg-white shadow-sm z-10">
163
+ <div class="px-6 py-3 flex items-center justify-between">
164
+ <div class="flex items-center space-x-4">
165
+ <h1 class="text-xl font-semibold">Team Standup Meeting</h1>
166
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full">Live</span>
167
+ </div>
168
+
169
+ <div class="flex items-center space-x-4">
170
+ <button class="flex items-center space-x-1 text-gray-600 hover:text-gray-900">
171
+ <i class="fas fa-calendar-alt"></i>
172
+ <span>Add to Calendar</span>
173
+ </button>
174
+ <button class="flex items-center space-x-1 text-gray-600 hover:text-gray-900">
175
+ <i class="fas fa-user-plus"></i>
176
+ <span>Invite</span>
177
+ </button>
178
+ <div class="relative">
179
+ <button id="export-menu-button" class="flex items-center space-x-1 bg-blue-500 text-white px-3 py-1 rounded-lg hover:bg-blue-600">
180
+ <i class="fas fa-file-export"></i>
181
+ <span>Export</span>
182
+ <i class="fas fa-chevron-down ml-1 text-xs"></i>
183
+ </button>
184
+ <div id="export-menu" class="hidden absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg z-20">
185
+ <div class="py-1">
186
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"><i class="fas fa-file-pdf mr-2 text-red-500"></i> PDF</a>
187
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"><i class="fas fa-file-word mr-2 text-blue-500"></i> Word</a>
188
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"><i class="fab fa-google-drive mr-2 text-blue-400"></i> Google Docs</a>
189
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"><i class="fas fa-file-alt mr-2 text-gray-500"></i> Text</a>
190
+ </div>
191
+ </div>
192
+ </div>
193
+ </div>
194
+ </div>
195
+ </header>
196
+
197
+ <!-- Main Content Area -->
198
+ <main class="flex-1 overflow-hidden flex">
199
+ <!-- Transcription Panel -->
200
+ <div class="w-2/5 border-r border-gray-200 bg-white flex flex-col">
201
+ <div class="p-4 border-b border-gray-200 flex items-center justify-between">
202
+ <h2 class="font-semibold">Live Transcription</h2>
203
+ <div class="flex items-center space-x-2">
204
+ <button id="transcription-control" class="bg-blue-500 text-white px-3 py-1 rounded-lg flex items-center space-x-1">
205
+ <i class="fas fa-microphone"></i>
206
+ <span>Start</span>
207
+ </button>
208
+ <button class="text-gray-500 hover:text-gray-700">
209
+ <i class="fas fa-cog"></i>
210
+ </button>
211
+ </div>
212
+ </div>
213
+
214
+ <div class="flex-1 overflow-y-auto p-4 space-y-4">
215
+ <div class="waveform rounded mb-2"></div>
216
+
217
+ <div class="transcription-entry bg-blue-50 p-3 rounded-lg">
218
+ <div class="flex items-start">
219
+ <div class="w-8 h-8 rounded-full bg-purple-500 flex items-center justify-center text-white font-semibold mr-3">SM</div>
220
+ <div class="flex-1">
221
+ <div class="flex items-center justify-between">
222
+ <span class="font-medium">Sarah Miller</span>
223
+ <span class="text-xs text-gray-500">10:02 AM</span>
224
+ </div>
225
+ <p class="mt-1">Good morning everyone. Let's start with updates from the design team.</p>
226
+ </div>
227
+ </div>
228
+ </div>
229
+
230
+ <div class="transcription-entry p-3 rounded-lg">
231
+ <div class="flex items-start">
232
+ <div class="w-8 h-8 rounded-full bg-green-500 flex items-center justify-center text-white font-semibold mr-3">AJ</div>
233
+ <div class="flex-1">
234
+ <div class="flex items-center justify-between">
235
+ <span class="font-medium">Alex Johnson</span>
236
+ <span class="text-xs text-gray-500">10:03 AM</span>
237
+ </div>
238
+ <p class="mt-1">We've completed the wireframes for the new dashboard. I'll share them in the channel after this meeting.</p>
239
+ </div>
240
+ </div>
241
+ </div>
242
+
243
+ <div class="transcription-entry p-3 rounded-lg">
244
+ <div class="flex items-start">
245
+ <div class="w-8 h-8 rounded-full bg-yellow-500 flex items-center justify-center text-white font-semibold mr-3">RK</div>
246
+ <div class="flex-1">
247
+ <div class="flex items-center justify-between">
248
+ <span class="font-medium">Raj Kumar</span>
249
+ <span class="text-xs text-gray-500">10:05 AM</span>
250
+ </div>
251
+ <p class="mt-1">The backend API is about 80% complete. We're just finishing up the authentication layer.</p>
252
+ </div>
253
+ </div>
254
+ </div>
255
+
256
+ <div class="transcription-entry bg-blue-50 p-3 rounded-lg">
257
+ <div class="flex items-start">
258
+ <div class="w-8 h-8 rounded-full bg-purple-500 flex items-center justify-center text-white font-semibold mr-3">SM</div>
259
+ <div class="flex-1">
260
+ <div class="flex items-center justify-between">
261
+ <span class="font-medium">Sarah Miller</span>
262
+ <span class="text-xs text-gray-500">10:07 AM</span>
263
+ </div>
264
+ <p class="mt-1">Great progress everyone. Let's aim to have a demo ready by Friday for the client review.</p>
265
+ </div>
266
+ </div>
267
+ </div>
268
+
269
+ <div class="transcription-entry p-3 rounded-lg">
270
+ <div class="flex items-start">
271
+ <div class="w-8 h-8 rounded-full bg-red-500 flex items-center justify-center text-white font-semibold mr-3">TP</div>
272
+ <div class="flex-1">
273
+ <div class="flex items-center justify-between">
274
+ <span class="font-medium">Taylor Park</span>
275
+ <span class="text-xs text-gray-500">10:08 AM</span>
276
+ </div>
277
+ <p class="mt-1">I'll coordinate with QA to make sure we have test cases ready for the new features.</p>
278
+ </div>
279
+ </div>
280
+ </div>
281
+
282
+ <div class="p-4 bg-gray-100 rounded-lg mt-4">
283
+ <div class="flex items-center">
284
+ <div class="w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center text-white font-semibold mr-3">AI</div>
285
+ <div>
286
+ <span class="font-medium">AI Summary</span>
287
+ <p class="mt-1 text-sm">Key points: Design team completed wireframes, backend at 80%, aiming for Friday demo, QA coordination needed.</p>
288
+ </div>
289
+ </div>
290
+ </div>
291
+ </div>
292
+
293
+ <div class="p-4 border-t border-gray-200">
294
+ <div class="flex items-center space-x-2">
295
+ <input type="text" placeholder="Add comment or action item..." class="flex-1 border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
296
+ <button class="bg-blue-500 text-white p-2 rounded-lg hover:bg-blue-600">
297
+ <i class="fas fa-paper-plane"></i>
298
+ </button>
299
+ </div>
300
+ </div>
301
+ </div>
302
+
303
+ <!-- Notes Panel -->
304
+ <div class="flex-1 flex flex-col bg-gray-50">
305
+ <div class="p-4 border-b border-gray-200 bg-white flex items-center justify-between">
306
+ <h2 class="font-semibold">Meeting Notes</h2>
307
+ <div class="flex items-center space-x-2">
308
+ <button class="text-gray-500 hover:text-gray-700">
309
+ <i class="fas fa-history"></i>
310
+ </button>
311
+ <button class="text-gray-500 hover:text-gray-700">
312
+ <i class="fas fa-ellipsis-v"></i>
313
+ </button>
314
+ </div>
315
+ </div>
316
+
317
+ <div class="flex-1 overflow-y-auto p-6">
318
+ <div class="max-w-3xl mx-auto">
319
+ <div class="mb-8">
320
+ <h1 class="text-2xl font-bold mb-2">Team Standup - June 10, 2023</h1>
321
+ <div class="flex items-center text-sm text-gray-500 space-x-4">
322
+ <div class="flex items-center">
323
+ <i class="fas fa-calendar-alt mr-1"></i>
324
+ <span>10:00 AM - 10:30 AM</span>
325
+ </div>
326
+ <div class="flex items-center">
327
+ <i class="fas fa-users mr-1"></i>
328
+ <span>5 participants</span>
329
+ </div>
330
+ </div>
331
+ </div>
332
+
333
+ <div class="mb-8">
334
+ <h2 class="text-lg font-semibold mb-3 flex items-center">
335
+ <i class="fas fa-check-circle mr-2 text-green-500"></i>
336
+ Action Items
337
+ </h2>
338
+ <div class="space-y-3">
339
+ <div class="note-card bg-white p-4 rounded-lg shadow-sm border border-gray-200 transition-all duration-200">
340
+ <div class="flex items-start">
341
+ <div class="flex items-center h-5">
342
+ <input type="checkbox" class="h-4 w-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
343
+ </div>
344
+ <div class="ml-3 flex-1">
345
+ <div class="flex items-center justify-between">
346
+ <span class="font-medium">Share wireframes in channel</span>
347
+ <span class="text-xs bg-blue-100 text-blue-800 px-2 py-1 rounded-full">Design</span>
348
+ </div>
349
+ <p class="text-sm text-gray-500 mt-1">Alex to share the completed dashboard wireframes with the team</p>
350
+ <div class="mt-2 flex items-center text-xs text-gray-500">
351
+ <i class="fas fa-user mr-1"></i>
352
+ <span class="mr-3">Alex Johnson</span>
353
+ <i class="fas fa-calendar mr-1"></i>
354
+ <span>Due: Today EOD</span>
355
+ </div>
356
+ </div>
357
+ </div>
358
+ </div>
359
+
360
+ <div class="note-card bg-white p-4 rounded-lg shadow-sm border border-gray-200 transition-all duration-200">
361
+ <div class="flex items-start">
362
+ <div class="flex items-center h-5">
363
+ <input type="checkbox" class="h-4 w-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
364
+ </div>
365
+ <div class="ml-3 flex-1">
366
+ <div class="flex items-center justify-between">
367
+ <span class="font-medium">Prepare test cases</span>
368
+ <span class="text-xs bg-purple-100 text-purple-800 px-2 py-1 rounded-full">QA</span>
369
+ </div>
370
+ <p class="text-sm text-gray-500 mt-1">Coordinate with QA team for new feature testing</p>
371
+ <div class="mt-2 flex items-center text-xs text-gray-500">
372
+ <i class="fas fa-user mr-1"></i>
373
+ <span class="mr-3">Taylor Park</span>
374
+ <i class="fas fa-calendar mr-1"></i>
375
+ <span>Due: Wed</span>
376
+ </div>
377
+ </div>
378
+ </div>
379
+ </div>
380
+
381
+ <div class="note-card bg-white p-4 rounded-lg shadow-sm border border-gray-200 transition-all duration-200">
382
+ <div class="flex items-start">
383
+ <div class="flex items-center h-5">
384
+ <input type="checkbox" class="h-4 w-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
385
+ </div>
386
+ <div class="ml-3 flex-1">
387
+ <div class="flex items-center justify-between">
388
+ <span class="font-medium">Complete auth layer</span>
389
+ <span class="text-xs bg-yellow-100 text-yellow-800 px-2 py-1 rounded-full">Backend</span>
390
+ </div>
391
+ <p class="text-sm text-gray-500 mt-1">Finish authentication implementation for API</p>
392
+ <div class="mt-2 flex items-center text-xs text-gray-500">
393
+ <i class="fas fa-user mr-1"></i>
394
+ <span class="mr-3">Raj Kumar</span>
395
+ <i class="fas fa-calendar mr-1"></i>
396
+ <span>Due: Thu</span>
397
+ </div>
398
+ </div>
399
+ </div>
400
+ </div>
401
+ </div>
402
+
403
+ <div class="mb-8">
404
+ <h2 class="text-lg font-semibold mb-3 flex items-center">
405
+ <i class="fas fa-sticky-note mr-2 text-blue-500"></i>
406
+ Notes
407
+ </h2>
408
+ <div class="space-y-4">
409
+ <div class="note-card bg-white p-4 rounded-lg shadow-sm border border-gray-200 transition-all duration-200">
410
+ <div class="flex items-center justify-between mb-2">
411
+ <span class="text-sm font-medium text-gray-700">Design Updates</span>
412
+ <div class="flex space-x-2">
413
+ <button class="text-gray-400 hover:text-gray-600">
414
+ <i class="fas fa-pencil-alt text-xs"></i>
415
+ </button>
416
+ <button class="text-gray-400 hover:text-gray-600">
417
+ <i class="fas fa-trash-alt text-xs"></i>
418
+ </button>
419
+ </div>
420
+ </div>
421
+ <p class="text-gray-600">Dashboard wireframes completed. Includes new analytics section and improved navigation. Need feedback from product team.</p>
422
+ <div class="mt-3 flex items-center text-xs text-gray-500">
423
+ <i class="fas fa-user mr-1"></i>
424
+ <span class="mr-3">Alex Johnson</span>
425
+ <i class="fas fa-clock mr-1"></i>
426
+ <span>10:03 AM</span>
427
+ </div>
428
+ </div>
429
+
430
+ <div class="note-card bg-white p-4 rounded-lg shadow-sm border border-gray-200 transition-all duration-200">
431
+ <div class="flex items-center justify-between mb-2">
432
+ <span class="text-sm font-medium text-gray-700">Backend Progress</span>
433
+ <div class="flex space-x-2">
434
+ <button class="text-gray-400 hover:text-gray-600">
435
+ <i class="fas fa-pencil-alt text-xs"></i>
436
+ </button>
437
+ <button class="text-gray-400 hover:text-gray-600">
438
+ <i class="fas fa-trash-alt text-xs"></i>
439
+ </button>
440
+ </div>
441
+ </div>
442
+ <p class="text-gray-600">API development at 80%. Authentication layer is the remaining major component. Expect completion by Thursday.</p>
443
+ <div class="mt-3 flex items-center text-xs text-gray-500">
444
+ <i class="fas fa-user mr-1"></i>
445
+ <span class="mr-3">Raj Kumar</span>
446
+ <i class="fas fa-clock mr-1"></i>
447
+ <span>10:05 AM</span>
448
+ </div>
449
+ </div>
450
+
451
+ <div class="note-card bg-white p-4 rounded-lg shadow-sm border border-gray-200 transition-all duration-200">
452
+ <div class="flex items-center justify-between mb-2">
453
+ <span class="text-sm font-medium text-gray-700">Demo Timeline</span>
454
+ <div class="flex space-x-2">
455
+ <button class="text-gray-400 hover:text-gray-600">
456
+ <i class="fas fa-pencil-alt text-xs"></i>
457
+ </button>
458
+ <button class="text-gray-400 hover:text-gray-600">
459
+ <i class="fas fa-trash-alt text-xs"></i>
460
+ </button>
461
+ </div>
462
+ </div>
463
+ <p class="text-gray-600">Target Friday for client demo. Need all components integrated by Thursday EOD for testing.</p>
464
+ <div class="mt-3 flex items-center text-xs text-gray-500">
465
+ <i class="fas fa-user mr-1"></i>
466
+ <span class="mr-3">Sarah Miller</span>
467
+ <i class="fas fa-clock mr-1"></i>
468
+ <span>10:07 AM</span>
469
+ </div>
470
+ </div>
471
+ </div>
472
+ </div>
473
+
474
+ <div class="mb-8">
475
+ <h2 class="text-lg font-semibold mb-3 flex items-center">
476
+ <i class="fas fa-lightbulb mr-2 text-yellow-500"></i>
477
+ AI-Generated Insights
478
+ </h2>
479
+ <div class="bg-yellow-50 border border-yellow-100 rounded-lg p-4">
480
+ <div class="flex items-start">
481
+ <div class="w-8 h-8 rounded-full bg-yellow-100 flex items-center justify-center text-yellow-600 mr-3">
482
+ <i class="fas fa-robot"></i>
483
+ </div>
484
+ <div>
485
+ <h3 class="font-medium mb-2">Key Discussion Points</h3>
486
+ <ul class="list-disc pl-5 space-y-1 text-sm">
487
+ <li>Design team has completed dashboard wireframes</li>
488
+ <li>Backend API progress at 80%, authentication pending</li>
489
+ <li>Client demo targeted for Friday</li>
490
+ <li>QA coordination needed for test cases</li>
491
+ </ul>
492
+ </div>
493
+ </div>
494
+ </div>
495
+ </div>
496
+
497
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-4">
498
+ <div class="flex items-center mb-2">
499
+ <i class="fas fa-plus-circle text-blue-500 mr-2"></i>
500
+ <span class="font-medium">Add New Note</span>
501
+ </div>
502
+ <textarea class="w-full border border-gray-300 rounded-lg p-3 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" rows="3" placeholder="Type your notes here..."></textarea>
503
+ <div class="mt-2 flex justify-between items-center">
504
+ <div class="flex space-x-2">
505
+ <button class="px-3 py-1 bg-gray-100 text-gray-700 rounded-lg text-sm hover:bg-gray-200">
506
+ <i class="fas fa-tag mr-1"></i> Add Tag
507
+ </button>
508
+ <button class="px-3 py-1 bg-gray-100 text-gray-700 rounded-lg text-sm hover:bg-gray-200">
509
+ <i class="fas fa-user-plus mr-1"></i> Assign
510
+ </button>
511
+ </div>
512
+ <button class="px-4 py-1 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
513
+ Save
514
+ </button>
515
+ </div>
516
+ </div>
517
+ </div>
518
+ </div>
519
+ </div>
520
+
521
+ <!-- Right Panel -->
522
+ <div class="w-80 border-l border-gray-200 bg-white flex flex-col">
523
+ <div class="p-4 border-b border-gray-200">
524
+ <h2 class="font-semibold">Meeting Details</h2>
525
+ </div>
526
+
527
+ <div class="flex-1 overflow-y-auto p-4">
528
+ <div class="space-y-6">
529
+ <div>
530
+ <h3 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">Participants</h3>
531
+ <div class="space-y-2">
532
+ <div class="flex items-center">
533
+ <div class="w-8 h-8 rounded-full bg-purple-500 flex items-center justify-center text-white font-semibold mr-3">SM</div>
534
+ <div>
535
+ <p class="text-sm font-medium">Sarah Miller</p>
536
+ <p class="text-xs text-gray-500">Host</p>
537
+ </div>
538
+ </div>
539
+ <div class="flex items-center">
540
+ <div class="w-8 h-8 rounded-full bg-green-500 flex items-center justify-center text-white font-semibold mr-3">AJ</div>
541
+ <div>
542
+ <p class="text-sm font-medium">Alex Johnson</p>
543
+ <p class="text-xs text-gray-500">Design Lead</p>
544
+ </div>
545
+ </div>
546
+ <div class="flex items-center">
547
+ <div class="w-8 h-8 rounded-full bg-yellow-500 flex items-center justify-center text-white font-semibold mr-3">RK</div>
548
+ <div>
549
+ <p class="text-sm font-medium">Raj Kumar</p>
550
+ <p class="text-xs text-gray-500">Backend Dev</p>
551
+ </div>
552
+ </div>
553
+ <div class="flex items-center">
554
+ <div class="w-8 h-8 rounded-full bg-red-500 flex items-center justify-center text-white font-semibold mr-3">TP</div>
555
+ <div>
556
+ <p class="text-sm font-medium">Taylor Park</p>
557
+ <p class="text-xs text-gray-500">QA Lead</p>
558
+ </div>
559
+ </div>
560
+ <div class="flex items-center">
561
+ <div class="w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center text-white font-semibold mr-3">JD</div>
562
+ <div>
563
+ <p class="text-sm font-medium">John Doe</p>
564
+ <p class="text-xs text-gray-500">Product Manager</p>
565
+ </div>
566
+ </div>
567
+ </div>
568
+ </div>
569
+
570
+ <div>
571
+ <h3 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">Meeting Info</h3>
572
+ <div class="space-y-2">
573
+ <div class="flex items-center text-sm">
574
+ <i class="fas fa-calendar-alt mr-2 text-gray-400"></i>
575
+ <span>June 10, 2023</span>
576
+ </div>
577
+ <div class="flex items-center text-sm">
578
+ <i class="fas fa-clock mr-2 text-gray-400"></i>
579
+ <span>10:00 AM - 10:30 AM (30 mins)</span>
580
+ </div>
581
+ <div class="flex items-center text-sm">
582
+ <i class="fas fa-link mr-2 text-gray-400"></i>
583
+ <a href="#" class="text-blue-500 hover:underline">meet.minutespro.com/standup</a>
584
+ </div>
585
+ </div>
586
+ </div>
587
+
588
+ <div>
589
+ <h3 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">Tags</h3>
590
+ <div class="flex flex-wrap gap-2">
591
+ <span class="px-2 py-1 bg-blue-100 text-blue-800 text-xs rounded-full">Standup</span>
592
+ <span class="px-2 py-1 bg-green-100 text-green-800 text-xs rounded-full">Design</span>
593
+ <span class="px-2 py-1 bg-yellow-100 text-yellow-800 text-xs rounded-full">Backend</span>
594
+ <span class="px-2 py-1 bg-purple-100 text-purple-800 text-xs rounded-full">QA</span>
595
+ <span class="px-2 py-1 bg-pink-100 text-pink-800 text-xs rounded-full">Demo</span>
596
+ </div>
597
+ </div>
598
+
599
+ <div>
600
+ <h3 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">Attachments</h3>
601
+ <div class="space-y-2">
602
+ <div class="flex items-center p-2 border border-gray-200 rounded-lg">
603
+ <i class="fas fa-file-image text-blue-500 mr-2"></i>
604
+ <div class="flex-1 truncate">
605
+ <p class="text-sm truncate">dashboard-wireframes.pdf</p>
606
+ <p class="text-xs text-gray-500">2.4 MB</p>
607
+ </div>
608
+ <button class="text-gray-400 hover:text-gray-600">
609
+ <i class="fas fa-download"></i>
610
+ </button>
611
+ </div>
612
+ <div class="flex items-center p-2 border border-gray-200 rounded-lg">
613
+ <i class="fas fa-file-code text-green-500 mr-2"></i>
614
+ <div class="flex-1 truncate">
615
+ <p class="text-sm truncate">api-specs.md</p>
616
+ <p class="text-xs text-gray-500">156 KB</p>
617
+ </div>
618
+ <button class="text-gray-400 hover:text-gray-600">
619
+ <i class="fas fa-download"></i>
620
+ </button>
621
+ </div>
622
+ </div>
623
+ </div>
624
+
625
+ <div>
626
+ <h3 class="text-sm font-medium text-gray-500 uppercase tracking-wider mb-2">Related Meetings</h3>
627
+ <div class="space-y-2">
628
+ <a href="#" class="block p-2 hover:bg-gray-50 rounded-lg">
629
+ <p class="text-sm font-medium">Sprint Planning</p>
630
+ <p class="text-xs text-gray-500">June 12, 10:00 AM</p>
631
+ </a>
632
+ <a href="#" class="block p-2 hover:bg-gray-50 rounded-lg">
633
+ <p class="text-sm font-medium">Client Demo</p>
634
+ <p class="text-xs text-gray-500">June 14, 2:00 PM</p>
635
+ </a>
636
+ </div>
637
+ </div>
638
+ </div>
639
+ </div>
640
+
641
+ <div class="p-4 border-t border-gray-200">
642
+ <button class="w-full bg-gray-100 hover:bg-gray-200 text-gray-800 py-2 px-4 rounded-lg flex items-center justify-center space-x-2">
643
+ <i class="fas fa-stop-circle text-red-500"></i>
644
+ <span>End Meeting</span>
645
+ </button>
646
+ </div>
647
+ </div>
648
+ </main>
649
+ </div>
650
+
651
+ <!-- Templates Page -->
652
+ <div id="templates-page" class="page flex-1 flex flex-col overflow-hidden">
653
+ <header class="bg-white shadow-sm z-10">
654
+ <div class="px-6 py-3 flex items-center justify-between">
655
+ <h1 class="text-xl font-semibold">Meeting Templates</h1>
656
+ <button class="bg-blue-500 text-white px-4 py-1 rounded-lg hover:bg-blue-600">
657
+ <i class="fas fa-plus mr-1"></i> New Template
658
+ </button>
659
+ </div>
660
+ </header>
661
+
662
+ <main class="flex-1 overflow-y-auto bg-gray-50 p-6">
663
+ <div class="max-w-6xl mx-auto">
664
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
665
+ <!-- Template Card -->
666
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden hover:shadow-md transition-shadow duration-200">
667
+ <div class="p-4 border-b border-gray-200 bg-blue-50">
668
+ <div class="flex items-center justify-between">
669
+ <h3 class="font-semibold text-blue-800">Standup Meeting</h3>
670
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full">Default</span>
671
+ </div>
672
+ <p class="text-sm text-gray-600 mt-1">Daily team standup structure</p>
673
+ </div>
674
+ <div class="p-4">
675
+ <div class="flex items-center text-sm text-gray-500 mb-3">
676
+ <i class="fas fa-calendar-alt mr-2"></i>
677
+ <span>Last used: Today</span>
678
+ </div>
679
+ <div class="flex space-x-2">
680
+ <button class="flex-1 bg-blue-500 text-white py-1 px-3 rounded text-sm hover:bg-blue-600">
681
+ <i class="fas fa-play mr-1"></i> Use
682
+ </button>
683
+ <button class="flex-1 bg-gray-100 text-gray-700 py-1 px-3 rounded text-sm hover:bg-gray-200">
684
+ <i class="fas fa-edit mr-1"></i> Edit
685
+ </button>
686
+ </div>
687
+ </div>
688
+ </div>
689
+
690
+ <!-- Template Card -->
691
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden hover:shadow-md transition-shadow duration-200">
692
+ <div class="p-4 border-b border-gray-200 bg-purple-50">
693
+ <div class="flex items-center justify-between">
694
+ <h3 class="font-semibold text-purple-800">Retrospective</h3>
695
+ <span class="bg-purple-100 text-purple-800 text-xs px-2 py-1 rounded-full">Team</span>
696
+ </div>
697
+ <p class="text-sm text-gray-600 mt-1">Sprint retrospective format</p>
698
+ </div>
699
+ <div class="p-4">
700
+ <div class="flex items-center text-sm text-gray-500 mb-3">
701
+ <i class="fas fa-calendar-alt mr-2"></i>
702
+ <span>Last used: 2 days ago</span>
703
+ </div>
704
+ <div class="flex space-x-2">
705
+ <button class="flex-1 bg-blue-500 text-white py-1 px-3 rounded text-sm hover:bg-blue-600">
706
+ <i class="fas fa-play mr-1"></i> Use
707
+ </button>
708
+ <button class="flex-1 bg-gray-100 text-gray-700 py-1 px-3 rounded text-sm hover:bg-gray-200">
709
+ <i class="fas fa-edit mr-1"></i> Edit
710
+ </button>
711
+ </div>
712
+ </div>
713
+ </div>
714
+
715
+ <!-- Template Card -->
716
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden hover:shadow-md transition-shadow duration-200">
717
+ <div class="p-4 border-b border-gray-200 bg-green-50">
718
+ <div class="flex items-center justify-between">
719
+ <h3 class="font-semibold text-green-800">Board Meeting</h3>
720
+ <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">Formal</span>
721
+ </div>
722
+ <p class="text-sm text-gray-600 mt-1">Formal board meeting structure</p>
723
+ </div>
724
+ <div class="p-4">
725
+ <div class="flex items-center text-sm text-gray-500 mb-3">
726
+ <i class="fas fa-calendar-alt mr-2"></i>
727
+ <span>Last used: 1 week ago</span>
728
+ </div>
729
+ <div class="flex space-x-2">
730
+ <button class="flex-1 bg-blue-500 text-white py-1 px-3 rounded text-sm hover:bg-blue-600">
731
+ <i class="fas fa-play mr-1"></i> Use
732
+ </button>
733
+ <button class="flex-1 bg-gray-100 text-gray-700 py-1 px-3 rounded text-sm hover:bg-gray-200">
734
+ <i class="fas fa-edit mr-1"></i> Edit
735
+ </button>
736
+ </div>
737
+ </div>
738
+ </div>
739
+
740
+ <!-- Template Card -->
741
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden hover:shadow-md transition-shadow duration-200">
742
+ <div class="p-4 border-b border-gray-200 bg-yellow-50">
743
+ <div class="flex items-center justify-between">
744
+ <h3 class="font-semibold text-yellow-800">Client Review</h3>
745
+ <span class="bg-yellow-100 text-yellow-800 text-xs px-2 py-1 rounded-full">External</span>
746
+ </div>
747
+ <p class="text-sm text-gray-600 mt-1">Client project review format</p>
748
+ </div>
749
+ <div class="p-4">
750
+ <div class="flex items-center text-sm text-gray-500 mb-3">
751
+ <i class="fas fa-calendar-alt mr-2"></i>
752
+ <span>Last used: 2 weeks ago</span>
753
+ </div>
754
+ <div class="flex space-x-2">
755
+ <button class="flex-1 bg-blue-500 text-white py-1 px-3 rounded text-sm hover:bg-blue-600">
756
+ <i class="fas fa-play mr-1"></i> Use
757
+ </button>
758
+ <button class="flex-1 bg-gray-100 text-gray-700 py-1 px-3 rounded text-sm hover:bg-gray-200">
759
+ <i class="fas fa-edit mr-1"></i> Edit
760
+ </button>
761
+ </div>
762
+ </div>
763
+ </div>
764
+
765
+ <!-- Template Card -->
766
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden hover:shadow-md transition-shadow duration-200">
767
+ <div class="p-4 border-b border-gray-200 bg-red-50">
768
+ <div class="flex items-center justify-between">
769
+ <h3 class="font-semibold text-red-800">Product Launch</h3>
770
+ <span class="bg-red-100 text-red-800 text-xs px-2 py-1 rounded-full">Planning</span>
771
+ </div>
772
+ <p class="text-sm text-gray-600 mt-1">Product launch planning meeting</p>
773
+ </div>
774
+ <div class="p-4">
775
+ <div class="flex items-center text-sm text-gray-500 mb-3">
776
+ <i class="fas fa-calendar-alt mr-2"></i>
777
+ <span>Last used: 3 weeks ago</span>
778
+ </div>
779
+ <div class="flex space-x-2">
780
+ <button class="flex-1 bg-blue-500 text-white py-1 px-3 rounded text-sm hover:bg-blue-600">
781
+ <i class="fas fa-play mr-1"></i> Use
782
+ </button>
783
+ <button class="flex-1 bg-gray-100 text-gray-700 py-1 px-3 rounded text-sm hover:bg-gray-200">
784
+ <i class="fas fa-edit mr-1"></i> Edit
785
+ </button>
786
+ </div>
787
+ </div>
788
+ </div>
789
+
790
+ <!-- Add Template Card -->
791
+ <div class="bg-white rounded-lg shadow-sm border-2 border-dashed border-gray-300 hover:border-blue-500 transition-colors duration-200 flex items-center justify-center">
792
+ <button class="p-6 text-center">
793
+ <div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center mx-auto mb-2">
794
+ <i class="fas fa-plus text-blue-500 text-xl"></i>
795
+ </div>
796
+ <span class="text-blue-500 font-medium">Create New Template</span>
797
+ </button>
798
+ </div>
799
+ </div>
800
+ </div>
801
+ </main>
802
+ </div>
803
+
804
+ <!-- Settings Page -->
805
+ <div id="settings-page" class="page flex-1 flex flex-col overflow-hidden">
806
+ <header class="bg-white shadow-sm z-10">
807
+ <div class="px-6 py-3">
808
+ <h1 class="text-xl font-semibold">Settings</h1>
809
+ </div>
810
+ </header>
811
+
812
+ <main class="flex-1 overflow-y-auto bg-gray-50">
813
+ <div class="max-w-4xl mx-auto p-6">
814
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 mb-6">
815
+ <div class="p-4 border-b border-gray-200">
816
+ <h2 class="font-semibold">Account Settings</h2>
817
+ </div>
818
+ <div class="p-4">
819
+ <div class="mb-4">
820
+ <label class="block text-sm font-medium text-gray-700 mb-1">Name</label>
821
+ <input type="text" value="John Doe" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
822
+ </div>
823
+ <div class="mb-4">
824
+ <label class="block text-sm font-medium text-gray-700 mb-1">Email</label>
825
+ <input type="email" value="john.doe@example.com" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
826
+ </div>
827
+ <div class="mb-4">
828
+ <label class="block text-sm font-medium text-gray-700 mb-1">Timezone</label>
829
+ <select class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
830
+ <option>(UTC-05:00) Eastern Time (US & Canada)</option>
831
+ <option>(UTC-08:00) Pacific Time (US & Canada)</option>
832
+ <option>(UTC+00:00) London</option>
833
+ <option>(UTC+01:00) Berlin</option>
834
+ <option>(UTC+05:30) India</option>
835
+ </select>
836
+ </div>
837
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600">
838
+ Save Changes
839
+ </button>
840
+ </div>
841
+ </div>
842
+
843
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 mb-6">
844
+ <div class="p-4 border-b border-gray-200">
845
+ <h2 class="font-semibold">Notification Preferences</h2>
846
+ </div>
847
+ <div class="p-4">
848
+ <div class="flex items-center justify-between mb-4">
849
+ <div>
850
+ <h3 class="font-medium">Email Notifications</h3>
851
+ <p class="text-sm text-gray-500">Receive email notifications for meeting reminders and updates</p>
852
+ </div>
853
+ <label class="relative inline-flex items-center cursor-pointer">
854
+ <input type="checkbox" value="" class="sr-only peer" checked>
855
+ <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-500"></div>
856
+ </label>
857
+ </div>
858
+ <div class="flex items-center justify-between mb-4">
859
+ <div>
860
+ <h3 class="font-medium">Push Notifications</h3>
861
+ <p class="text-sm text-gray-500">Receive push notifications on your devices</p>
862
+ </div>
863
+ <label class="relative inline-flex items-center cursor-pointer">
864
+ <input type="checkbox" value="" class="sr-only peer" checked>
865
+ <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-500"></div>
866
+ </label>
867
+ </div>
868
+ <div class="flex items-center justify-between">
869
+ <div>
870
+ <h3 class="font-medium">Sound Alerts</h3>
871
+ <p class="text-sm text-gray-500">Play sounds for meeting alerts and reminders</p>
872
+ </div>
873
+ <label class="relative inline-flex items-center cursor-pointer">
874
+ <input type="checkbox" value="" class="sr-only peer">
875
+ <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-500"></div>
876
+ </label>
877
+ </div>
878
+ </div>
879
+ </div>
880
+
881
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 mb-6">
882
+ <div class="p-4 border-b border-gray-200">
883
+ <h2 class="font-semibold">Security</h2>
884
+ </div>
885
+ <div class="p-4">
886
+ <div class="mb-4">
887
+ <label class="block text-sm font-medium text-gray-700 mb-1">Password</label>
888
+ <div class="flex space-x-2">
889
+ <input type="password" placeholder="Current password" class="flex-1 border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
890
+ </div>
891
+ </div>
892
+ <div class="mb-4">
893
+ <div class="flex space-x-2">
894
+ <input type="password" placeholder="New password" class="flex-1 border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
895
+ <input type="password" placeholder="Confirm new password" class="flex-1 border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
896
+ </div>
897
+ </div>
898
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600">
899
+ Update Password
900
+ </button>
901
+ </div>
902
+ </div>
903
+
904
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200">
905
+ <div class="p-4 border-b border-gray-200">
906
+ <h2 class="font-semibold">Data & Privacy</h2>
907
+ </div>
908
+ <div class="p-4">
909
+ <div class="mb-4">
910
+ <h3 class="font-medium mb-2">Data Retention</h3>
911
+ <p class="text-sm text-gray-500 mb-3">Choose how long we keep your meeting data</p>
912
+ <div class="flex space-x-2">
913
+ <button class="px-3 py-1 bg-blue-500 text-white rounded-lg text-sm hover:bg-blue-600">
914
+ 30 days
915
+ </button>
916
+ <button class="px-3 py-1 bg-gray-100 text-gray-700 rounded-lg text-sm hover:bg-gray-200">
917
+ 6 months
918
+ </button>
919
+ <button class="px-3 py-1 bg-gray-100 text-gray-700 rounded-lg text-sm hover:bg-gray-200">
920
+ 1 year
921
+ </button>
922
+ <button class="px-3 py-1 bg-gray-100 text-gray-700 rounded-lg text-sm hover:bg-gray-200">
923
+ Forever
924
+ </button>
925
+ </div>
926
+ </div>
927
+ <div class="mb-4">
928
+ <h3 class="font-medium mb-2">Export Data</h3>
929
+ <p class="text-sm text-gray-500 mb-3">Download all your meeting data for backup</p>
930
+ <button class="px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200">
931
+ <i class="fas fa-download mr-2"></i> Export All Data
932
+ </button>
933
+ </div>
934
+ <div>
935
+ <h3 class="font-medium mb-2">Delete Account</h3>
936
+ <p class="text-sm text-gray-500 mb-3">Permanently delete your account and all associated data</p>
937
+ <button class="px-4 py-2 bg-red-500 text-white rounded-lg hover:bg-red-600">
938
+ <i class="fas fa-trash-alt mr-2"></i> Delete Account
939
+ </button>
940
+ </div>
941
+ </div>
942
+ </div>
943
+ </div>
944
+ </main>
945
+ </div>
946
+
947
+ <!-- Integrations Page -->
948
+ <div id="integrations-page" class="page flex-1 flex flex-col overflow-hidden">
949
+ <header class="bg-white shadow-sm z-10">
950
+ <div class="px-6 py-3">
951
+ <h1 class="text-xl font-semibold">Integrations</h1>
952
+ </div>
953
+ </header>
954
+
955
+ <main class="flex-1 overflow-y-auto bg-gray-50">
956
+ <div class="max-w-4xl mx-auto p-6">
957
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 mb-6">
958
+ <div class="p-4 border-b border-gray-200">
959
+ <h2 class="font-semibold">Calendar Services</h2>
960
+ <p class="text-sm text-gray-500">Connect your calendar to schedule and join meetings</p>
961
+ </div>
962
+ <div class="p-4">
963
+ <div class="flex items-center justify-between mb-4 p-3 border border-gray-200 rounded-lg">
964
+ <div class="flex items-center">
965
+ <div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center mr-3">
966
+ <i class="fab fa-google text-blue-500"></i>
967
+ </div>
968
+ <div>
969
+ <h3 class="font-medium">Google Calendar</h3>
970
+ <p class="text-sm text-gray-500">Connected as john.doe@example.com</p>
971
+ </div>
972
+ </div>
973
+ <button class="px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200">
974
+ Disconnect
975
+ </button>
976
+ </div>
977
+ <div class="flex items-center justify-between p-3 border border-gray-200 rounded-lg">
978
+ <div class="flex items-center">
979
+ <div class="w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center mr-3">
980
+ <i class="fab fa-microsoft text-blue-600"></i>
981
+ </div>
982
+ <div>
983
+ <h3 class="font-medium">Microsoft Outlook</h3>
984
+ <p class="text-sm text-gray-500">Connect your Outlook calendar</p>
985
+ </div>
986
+ </div>
987
+ <button class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
988
+ Connect
989
+ </button>
990
+ </div>
991
+ </div>
992
+ </div>
993
+
994
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 mb-6">
995
+ <div class="p-4 border-b border-gray-200">
996
+ <h2 class="font-semibold">AI Services</h2>
997
+ <p class="text-sm text-gray-500">Enhance your meetings with AI-powered features</p>
998
+ </div>
999
+ <div class="p-4">
1000
+ <div class="flex items-center justify-between mb-4 p-3 border border-gray-200 rounded-lg">
1001
+ <div class="flex items-center">
1002
+ <div class="w-10 h-10 rounded-full bg-green-100 flex items-center justify-center mr-3">
1003
+ <i class="fas fa-robot text-green-500"></i>
1004
+ </div>
1005
+ <div>
1006
+ <h3 class="font-medium">OpenAI API</h3>
1007
+ <p class="text-sm text-gray-500">Enable AI summaries and insights</p>
1008
+ </div>
1009
+ </div>
1010
+ <label class="relative inline-flex items-center cursor-pointer">
1011
+ <input type="checkbox" value="" class="sr-only peer" checked>
1012
+ <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-500"></div>
1013
+ </label>
1014
+ </div>
1015
+ <div class="p-3 border border-gray-200 rounded-lg">
1016
+ <div class="flex items-center mb-3">
1017
+ <div class="w-10 h-10 rounded-full bg-purple-100 flex items-center justify-center mr-3">
1018
+ <i class="fab fa-google text-purple-500"></i>
1019
+ </div>
1020
+ <div>
1021
+ <h3 class="font-medium">Google Meet</h3>
1022
+ <p class="text-sm text-gray-500">Join meetings directly from Google Meet</p>
1023
+ </div>
1024
+ </div>
1025
+ <div class="flex items-center justify-between">
1026
+ <span class="text-sm text-gray-500">Status: Not connected</span>
1027
+ <button class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
1028
+ Connect
1029
+ </button>
1030
+ </div>
1031
+ </div>
1032
+ </div>
1033
+ </div>
1034
+
1035
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 mb-6">
1036
+ <div class="p-4 border-b border-gray-200">
1037
+ <h2 class="font-semibold">Storage Services</h2>
1038
+ <p class="text-sm text-gray-500">Save meeting notes and recordings to your cloud storage</p>
1039
+ </div>
1040
+ <div class="p-4">
1041
+ <div class="flex items-center justify-between mb-4 p-3 border border-gray-200 rounded-lg">
1042
+ <div class="flex items-center">
1043
+ <div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center mr-3">
1044
+ <i class="fab fa-dropbox text-blue-500"></i>
1045
+ </div>
1046
+ <div>
1047
+ <h3 class="font-medium">Dropbox</h3>
1048
+ <p class="text-sm text-gray-500">Save meeting files to Dropbox</p>
1049
+ </div>
1050
+ </div>
1051
+ <button class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
1052
+ Connect
1053
+ </button>
1054
+ </div>
1055
+ <div class="flex items-center justify-between p-3 border border-gray-200 rounded-lg">
1056
+ <div class="flex items-center">
1057
+ <div class="w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center mr-3">
1058
+ <i class="fab fa-google-drive text-blue-400"></i>
1059
+ </div>
1060
+ <div>
1061
+ <h3 class="font-medium">Google Drive</h3>
1062
+ <p class="text-sm text-gray-500">Save meeting files to Google Drive</p>
1063
+ </div>
1064
+ </div>
1065
+ <button class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
1066
+ Connect
1067
+ </button>
1068
+ </div>
1069
+ </div>
1070
+ </div>
1071
+
1072
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200">
1073
+ <div class="p-4 border-b border-gray-200">
1074
+ <h2 class="font-semibold">Developer API</h2>
1075
+ <p class="text-sm text-gray-500">Access our API to build custom integrations</p>
1076
+ </div>
1077
+ <div class="p-4">
1078
+ <div class="mb-4">
1079
+ <h3 class="font-medium mb-2">API Key</h3>
1080
+ <div class="flex items-center">
1081
+ <input type="text" value="mp_1234567890abcdef" readonly class="flex-1 border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent bg-gray-100">
1082
+ <button class="ml-2 px-3 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200">
1083
+ <i class="fas fa-copy"></i>
1084
+ </button>
1085
+ </div>
1086
+ <p class="text-xs text-gray-500 mt-1">Keep this key secret. Do not share it in client-side code.</p>
1087
+ </div>
1088
+ <div>
1089
+ <h3 class="font-medium mb-2">Documentation</h3>
1090
+ <p class="text-sm text-gray-500 mb-3">Learn how to use our API to build custom integrations</p>
1091
+ <button class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
1092
+ <i class="fas fa-book mr-2"></i> View API Docs
1093
+ </button>
1094
+ </div>
1095
+ </div>
1096
+ </div>
1097
+ </div>
1098
+ </main>
1099
+ </div>
1100
+
1101
+ <!-- New Meeting Page -->
1102
+ <div id="new-meeting-page" class="page flex-1 flex flex-col overflow-hidden">
1103
+ <header class="bg-white shadow-sm z-10">
1104
+ <div class="px-6 py-3 flex items-center justify-between">
1105
+ <h1 class="text-xl font-semibold">Schedule New Meeting</h1>
1106
+ <button class="text-gray-500 hover:text-gray-700">
1107
+ <i class="fas fa-times"></i>
1108
+ </button>
1109
+ </div>
1110
+ </header>
1111
+
1112
+ <main class="flex-1 overflow-y-auto bg-gray-50">
1113
+ <div class="max-w-3xl mx-auto p-6">
1114
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6 mb-6">
1115
+ <h2 class="font-semibold mb-4">Meeting Details</h2>
1116
+ <div class="space-y-4">
1117
+ <div>
1118
+ <label class="block text-sm font-medium text-gray-700 mb-1">Title</label>
1119
+ <input type="text" placeholder="Team standup" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
1120
+ </div>
1121
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
1122
+ <div>
1123
+ <label class="block text-sm font-medium text-gray-700 mb-1">Date</label>
1124
+ <input type="date" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
1125
+ </div>
1126
+ <div>
1127
+ <label class="block text-sm font-medium text-gray-700 mb-1">Time</label>
1128
+ <input type="time" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
1129
+ </div>
1130
+ </div>
1131
+ <div>
1132
+ <label class="block text-sm font-medium text-gray-700 mb-1">Duration</label>
1133
+ <select class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
1134
+ <option>15 minutes</option>
1135
+ <option>30 minutes</option>
1136
+ <option selected>45 minutes</option>
1137
+ <option>1 hour</option>
1138
+ <option>1.5 hours</option>
1139
+ <option>2 hours</option>
1140
+ </select>
1141
+ </div>
1142
+ <div>
1143
+ <label class="block text-sm font-medium text-gray-700 mb-1">Description</label>
1144
+ <textarea class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" rows="3" placeholder="Meeting purpose and agenda"></textarea>
1145
+ </div>
1146
+ </div>
1147
+ </div>
1148
+
1149
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6 mb-6">
1150
+ <h2 class="font-semibold mb-4">Participants</h2>
1151
+ <div class="space-y-4">
1152
+ <div>
1153
+ <label class="block text-sm font-medium text-gray-700 mb-1">Invite Team Members</label>
1154
+ <div class="flex">
1155
+ <input type="text" placeholder="Search team members" class="flex-1 border border-gray-300 rounded-l-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
1156
+ <button class="px-4 py-2 bg-blue-500 text-white rounded-r-lg hover:bg-blue-600">
1157
+ <i class="fas fa-plus"></i>
1158
+ </button>
1159
+ </div>
1160
+ </div>
1161
+ <div class="border border-gray-200 rounded-lg p-3">
1162
+ <div class="flex items-center justify-between mb-2">
1163
+ <div class="flex items-center">
1164
+ <div class="w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center text-white font-semibold mr-3">JD</div>
1165
+ <div>
1166
+ <p class="text-sm font-medium">John Doe</p>
1167
+ <p class="text-xs text-gray-500">Product Manager</p>
1168
+ </div>
1169
+ </div>
1170
+ <button class="text-gray-400 hover:text-gray-600">
1171
+ <i class="fas fa-times"></i>
1172
+ </button>
1173
+ </div>
1174
+ <div class="flex items-center justify-between">
1175
+ <div class="flex items-center">
1176
+ <div class="w-8 h-8 rounded-full bg-purple-500 flex items-center justify-center text-white font-semibold mr-3">SM</div>
1177
+ <div>
1178
+ <p class="text-sm font-medium">Sarah Miller</p>
1179
+ <p class="text-xs text-gray-500">Project Lead</p>
1180
+ </div>
1181
+ </div>
1182
+ <button class="text-gray-400 hover:text-gray-600">
1183
+ <i class="fas fa-times"></i>
1184
+ </button>
1185
+ </div>
1186
+ </div>
1187
+ <div>
1188
+ <label class="block text-sm font-medium text-gray-700 mb-1">External Participants</label>
1189
+ <div class="flex">
1190
+ <input type="email" placeholder="Enter email addresses" class="flex-1 border border-gray-300 rounded-l-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
1191
+ <button class="px-4 py-2 bg-blue-500 text-white rounded-r-lg hover:bg-blue-600">
1192
+ <i class="fas fa-plus"></i>
1193
+ </button>
1194
+ </div>
1195
+ </div>
1196
+ </div>
1197
+ </div>
1198
+
1199
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6 mb-6">
1200
+ <h2 class="font-semibold mb-4">Meeting Options</h2>
1201
+ <div class="space-y-4">
1202
+ <div class="flex items-center justify-between">
1203
+ <div>
1204
+ <h3 class="font-medium">Record Meeting</h3>
1205
+ <p class="text-sm text-gray-500">Automatically record audio and video</p>
1206
+ </div>
1207
+ <label class="relative inline-flex items-center cursor-pointer">
1208
+ <input type="checkbox" value="" class="sr-only peer">
1209
+ <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-500"></div>
1210
+ </label>
1211
+ </div>
1212
+ <div class="flex items-center justify-between">
1213
+ <div>
1214
+ <h3 class="font-medium">Transcription</h3>
1215
+ <p class="text-sm text-gray-500">Enable real-time transcription</p>
1216
+ </div>
1217
+ <label class="relative inline-flex items-center cursor-pointer">
1218
+ <input type="checkbox" value="" class="sr-only peer" checked>
1219
+ <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-500"></div>
1220
+ </label>
1221
+ </div>
1222
+ <div class="flex items-center justify-between">
1223
+ <div>
1224
+ <h3 class="font-medium">AI Assistant</h3>
1225
+ <p class="text-sm text-gray-500">Enable AI-generated summaries and action items</p>
1226
+ </div>
1227
+ <label class="relative inline-flex items-center cursor-pointer">
1228
+ <input type="checkbox" value="" class="sr-only peer" checked>
1229
+ <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-500"></div>
1230
+ </label>
1231
+ </div>
1232
+ <div>
1233
+ <label class="block text-sm font-medium text-gray-700 mb-1">Meeting Template</label>
1234
+ <select class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:outline
1235
+ </html>
prompts.txt ADDED
File without changes