tusharshinde2006 commited on
Commit
4c9d1be
·
verified ·
1 Parent(s): 9f2725e

make a fully functional CRM tool for my team of 10 people - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +6 -4
  2. index.html +455 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Crm
3
- emoji: 🦀
4
  colorFrom: yellow
5
- colorTo: yellow
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: crm
3
+ emoji: 🐳
4
  colorFrom: yellow
5
+ colorTo: green
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,455 @@
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>Team CRM | Customer Relationship Management</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
+ /* Custom scrollbar */
11
+ ::-webkit-scrollbar {
12
+ width: 8px;
13
+ }
14
+ ::-webkit-scrollbar-track {
15
+ background: #f1f1f1;
16
+ }
17
+ ::-webkit-scrollbar-thumb {
18
+ background: #888;
19
+ border-radius: 4px;
20
+ }
21
+ ::-webkit-scrollbar-thumb:hover {
22
+ background: #555;
23
+ }
24
+
25
+ /* Animation for notifications */
26
+ @keyframes slideIn {
27
+ from { transform: translateX(100%); }
28
+ to { transform: translateX(0); }
29
+ }
30
+
31
+ .notification {
32
+ animation: slideIn 0.3s ease-out;
33
+ }
34
+
35
+ /* Custom checkbox */
36
+ .custom-checkbox {
37
+ appearance: none;
38
+ -webkit-appearance: none;
39
+ width: 20px;
40
+ height: 20px;
41
+ border: 2px solid #d1d5db;
42
+ border-radius: 4px;
43
+ cursor: pointer;
44
+ display: flex;
45
+ align-items: center;
46
+ justify-content: center;
47
+ }
48
+
49
+ .custom-checkbox:checked {
50
+ background-color: #3b82f6;
51
+ border-color: #3b82f6;
52
+ }
53
+
54
+ .custom-checkbox:checked::after {
55
+ content: "✓";
56
+ color: white;
57
+ font-size: 12px;
58
+ }
59
+
60
+ /* Transition effects */
61
+ .transition-all {
62
+ transition: all 0.3s ease;
63
+ }
64
+
65
+ /* Tooltip */
66
+ .tooltip {
67
+ position: relative;
68
+ }
69
+
70
+ .tooltip .tooltip-text {
71
+ visibility: hidden;
72
+ width: 120px;
73
+ background-color: #333;
74
+ color: #fff;
75
+ text-align: center;
76
+ border-radius: 6px;
77
+ padding: 5px;
78
+ position: absolute;
79
+ z-index: 1;
80
+ bottom: 125%;
81
+ left: 50%;
82
+ transform: translateX(-50%);
83
+ opacity: 0;
84
+ transition: opacity 0.3s;
85
+ }
86
+
87
+ .tooltip:hover .tooltip-text {
88
+ visibility: visible;
89
+ opacity: 1;
90
+ }
91
+ </style>
92
+ </head>
93
+ <body class="bg-gray-100 font-sans">
94
+ <!-- Main Container -->
95
+ <div class="flex h-screen overflow-hidden">
96
+ <!-- Sidebar -->
97
+ <div class="hidden md:flex md:flex-shrink-0">
98
+ <div class="flex flex-col w-64 bg-indigo-700 text-white">
99
+ <div class="flex items-center justify-center h-16 px-4 border-b border-indigo-600">
100
+ <div class="flex items-center">
101
+ <i class="fas fa-users-cog text-2xl mr-2"></i>
102
+ <span class="text-xl font-semibold">Team CRM</span>
103
+ </div>
104
+ </div>
105
+ <div class="flex flex-col flex-grow px-4 py-4 overflow-y-auto">
106
+ <div class="space-y-1">
107
+ <a href="#" class="flex items-center px-2 py-3 text-sm font-medium rounded-md bg-indigo-800 text-white group">
108
+ <i class="fas fa-tachometer-alt mr-3"></i>
109
+ Dashboard
110
+ </a>
111
+ <a href="#" class="flex items-center px-2 py-3 text-sm font-medium rounded-md hover:bg-indigo-600 hover:text-white group">
112
+ <i class="fas fa-user-friends mr-3"></i>
113
+ Contacts
114
+ </a>
115
+ <a href="#" class="flex items-center px-2 py-3 text-sm font-medium rounded-md hover:bg-indigo-600 hover:text-white group">
116
+ <i class="fas fa-briefcase mr-3"></i>
117
+ Companies
118
+ </a>
119
+ <a href="#" class="flex items-center px-2 py-3 text-sm font-medium rounded-md hover:bg-indigo-600 hover:text-white group">
120
+ <i class="fas fa-handshake mr-3"></i>
121
+ Deals
122
+ </a>
123
+ <a href="#" class="flex items-center px-2 py-3 text-sm font-medium rounded-md hover:bg-indigo-600 hover:text-white group">
124
+ <i class="fas fa-tasks mr-3"></i>
125
+ Tasks
126
+ </a>
127
+ <a href="#" class="flex items-center px-2 py-3 text-sm font-medium rounded-md hover:bg-indigo-600 hover:text-white group">
128
+ <i class="fas fa-calendar-alt mr-3"></i>
129
+ Calendar
130
+ </a>
131
+ <a href="#" class="flex items-center px-2 py-3 text-sm font-medium rounded-md hover:bg-indigo-600 hover:text-white group">
132
+ <i class="fas fa-chart-line mr-3"></i>
133
+ Reports
134
+ </a>
135
+ </div>
136
+ <div class="mt-auto mb-4">
137
+ <div class="px-2 py-3 text-sm font-medium text-indigo-200">
138
+ Team Members
139
+ </div>
140
+ <div class="space-y-1">
141
+ <div class="flex items-center px-2 py-2 text-sm rounded-md hover:bg-indigo-600 group">
142
+ <img class="w-6 h-6 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/44.jpg" alt="Sarah">
143
+ <span>Sarah Johnson</span>
144
+ </div>
145
+ <div class="flex items-center px-2 py-2 text-sm rounded-md hover:bg-indigo-600 group">
146
+ <img class="w-6 h-6 rounded-full mr-3" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Michael">
147
+ <span>Michael Chen</span>
148
+ </div>
149
+ <div class="flex items-center px-2 py-2 text-sm rounded-md hover:bg-indigo-600 group">
150
+ <img class="w-6 h-6 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Emma">
151
+ <span>Emma Rodriguez</span>
152
+ </div>
153
+ <div class="flex items-center px-2 py-2 text-sm rounded-md hover:bg-indigo-600 group">
154
+ <img class="w-6 h-6 rounded-full mr-3" src="https://randomuser.me/api/portraits/men/75.jpg" alt="David">
155
+ <span>David Wilson</span>
156
+ </div>
157
+ <div class="flex items-center px-2 py-2 text-sm rounded-md hover:bg-indigo-600 group">
158
+ <img class="w-6 h-6 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/90.jpg" alt="Lisa">
159
+ <span>Lisa Brown</span>
160
+ </div>
161
+ </div>
162
+ </div>
163
+ </div>
164
+ </div>
165
+ </div>
166
+
167
+ <!-- Main Content -->
168
+ <div class="flex flex-col flex-1 overflow-hidden">
169
+ <!-- Top Navigation -->
170
+ <div class="flex items-center justify-between h-16 bg-white border-b border-gray-200 px-4">
171
+ <!-- Mobile menu button -->
172
+ <button class="md:hidden text-gray-500 focus:outline-none" id="mobile-menu-button">
173
+ <i class="fas fa-bars"></i>
174
+ </button>
175
+
176
+ <!-- Search bar -->
177
+ <div class="flex-1 max-w-md mx-4">
178
+ <div class="relative">
179
+ <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
180
+ <i class="fas fa-search text-gray-400"></i>
181
+ </div>
182
+ <input class="block w-full pl-10 pr-3 py-2 border border-gray-300 rounded-md leading-5 bg-white placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" placeholder="Search..." type="search">
183
+ </div>
184
+ </div>
185
+
186
+ <!-- Right side icons -->
187
+ <div class="flex items-center space-x-4">
188
+ <button class="p-1 rounded-full text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500">
189
+ <i class="fas fa-bell"></i>
190
+ </button>
191
+ <button class="p-1 rounded-full text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500">
192
+ <i class="fas fa-envelope"></i>
193
+ </button>
194
+ <div class="relative">
195
+ <button class="flex items-center space-x-2 focus:outline-none" id="user-menu-button">
196
+ <img class="w-8 h-8 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User profile">
197
+ <span class="hidden md:inline text-sm font-medium text-gray-700">John Doe</span>
198
+ </button>
199
+ <!-- Dropdown menu -->
200
+ <div class="hidden absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1 z-10" id="user-menu">
201
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Your Profile</a>
202
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Settings</a>
203
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Sign out</a>
204
+ </div>
205
+ </div>
206
+ </div>
207
+ </div>
208
+
209
+ <!-- Main Content Area -->
210
+ <div class="flex-1 overflow-auto p-4">
211
+ <!-- Dashboard Header -->
212
+ <div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-6">
213
+ <div>
214
+ <h1 class="text-2xl font-bold text-gray-800">Dashboard</h1>
215
+ <p class="text-gray-600">Welcome back, John! Here's what's happening with your team today.</p>
216
+ </div>
217
+ <div class="mt-4 md:mt-0">
218
+ <button class="px-4 py-2 bg-indigo-600 text-white rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition-all">
219
+ <i class="fas fa-plus mr-2"></i> Add New Contact
220
+ </button>
221
+ </div>
222
+ </div>
223
+
224
+ <!-- Stats Cards -->
225
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
226
+ <div class="bg-white rounded-lg shadow p-4">
227
+ <div class="flex items-center">
228
+ <div class="p-3 rounded-full bg-indigo-100 text-indigo-600 mr-4">
229
+ <i class="fas fa-user-friends"></i>
230
+ </div>
231
+ <div>
232
+ <p class="text-sm font-medium text-gray-500">Total Contacts</p>
233
+ <p class="text-2xl font-semibold text-gray-800">1,248</p>
234
+ <p class="text-xs text-green-500">+12% from last month</p>
235
+ </div>
236
+ </div>
237
+ </div>
238
+ <div class="bg-white rounded-lg shadow p-4">
239
+ <div class="flex items-center">
240
+ <div class="p-3 rounded-full bg-blue-100 text-blue-600 mr-4">
241
+ <i class="fas fa-briefcase"></i>
242
+ </div>
243
+ <div>
244
+ <p class="text-sm font-medium text-gray-500">Active Deals</p>
245
+ <p class="text-2xl font-semibold text-gray-800">84</p>
246
+ <p class="text-xs text-green-500">+5 this week</p>
247
+ </div>
248
+ </div>
249
+ </div>
250
+ <div class="bg-white rounded-lg shadow p-4">
251
+ <div class="flex items-center">
252
+ <div class="p-3 rounded-full bg-green-100 text-green-600 mr-4">
253
+ <i class="fas fa-handshake"></i>
254
+ </div>
255
+ <div>
256
+ <p class="text-sm font-medium text-gray-500">Closed Deals</p>
257
+ <p class="text-2xl font-semibold text-gray-800">32</p>
258
+ <p class="text-xs text-green-500">+3 this month</p>
259
+ </div>
260
+ </div>
261
+ </div>
262
+ <div class="bg-white rounded-lg shadow p-4">
263
+ <div class="flex items-center">
264
+ <div class="p-3 rounded-full bg-yellow-100 text-yellow-600 mr-4">
265
+ <i class="fas fa-tasks"></i>
266
+ </div>
267
+ <div>
268
+ <p class="text-sm font-medium text-gray-500">Pending Tasks</p>
269
+ <p class="text-2xl font-semibold text-gray-800">18</p>
270
+ <p class="text-xs text-red-500">-2 from yesterday</p>
271
+ </div>
272
+ </div>
273
+ </div>
274
+ </div>
275
+
276
+ <!-- Main Content Grid -->
277
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
278
+ <!-- Recent Activities -->
279
+ <div class="lg:col-span-2">
280
+ <div class="bg-white rounded-lg shadow overflow-hidden">
281
+ <div class="px-4 py-5 border-b border-gray-200 sm:px-6">
282
+ <h3 class="text-lg font-medium leading-6 text-gray-900">Recent Activities</h3>
283
+ </div>
284
+ <div class="bg-white overflow-y-auto" style="max-height: 400px;">
285
+ <ul class="divide-y divide-gray-200">
286
+ <li class="px-4 py-4">
287
+ <div class="flex items-center space-x-4">
288
+ <div class="flex-shrink-0">
289
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/women/44.jpg" alt="Sarah">
290
+ </div>
291
+ <div class="flex-1 min-w-0">
292
+ <p class="text-sm font-medium text-gray-900 truncate">Sarah Johnson</p>
293
+ <p class="text-sm text-gray-500 truncate">Updated the deal with Acme Corp to "Negotiation" stage</p>
294
+ </div>
295
+ <div class="inline-flex items-center text-sm text-gray-500">
296
+ 2 hours ago
297
+ </div>
298
+ </div>
299
+ </li>
300
+ <li class="px-4 py-4">
301
+ <div class="flex items-center space-x-4">
302
+ <div class="flex-shrink-0">
303
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Michael">
304
+ </div>
305
+ <div class="flex-1 min-w-0">
306
+ <p class="text-sm font-medium text-gray-900 truncate">Michael Chen</p>
307
+ <p class="text-sm text-gray-500 truncate">Added 5 new contacts from the Tech Conference</p>
308
+ </div>
309
+ <div class="inline-flex items-center text-sm text-gray-500">
310
+ 4 hours ago
311
+ </div>
312
+ </div>
313
+ </li>
314
+ <li class="px-4 py-4">
315
+ <div class="flex items-center space-x-4">
316
+ <div class="flex-shrink-0">
317
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Emma">
318
+ </div>
319
+ <div class="flex-1 min-w-0">
320
+ <p class="text-sm font-medium text-gray-900 truncate">Emma Rodriguez</p>
321
+ <p class="text-sm text-gray-500 truncate">Closed deal with XYZ Solutions for $25,000</p>
322
+ </div>
323
+ <div class="inline-flex items-center text-sm text-gray-500">
324
+ 1 day ago
325
+ </div>
326
+ </div>
327
+ </li>
328
+ <li class="px-4 py-4">
329
+ <div class="flex items-center space-x-4">
330
+ <div class="flex-shrink-0">
331
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/men/75.jpg" alt="David">
332
+ </div>
333
+ <div class="flex-1 min-w-0">
334
+ <p class="text-sm font-medium text-gray-900 truncate">David Wilson</p>
335
+ <p class="text-sm text-gray-500 truncate">Scheduled follow-up call with TechStart Inc for tomorrow</p>
336
+ </div>
337
+ <div class="inline-flex items-center text-sm text-gray-500">
338
+ 1 day ago
339
+ </div>
340
+ </div>
341
+ </li>
342
+ <li class="px-4 py-4">
343
+ <div class="flex items-center space-x-4">
344
+ <div class="flex-shrink-0">
345
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/women/90.jpg" alt="Lisa">
346
+ </div>
347
+ <div class="flex-1 min-w-0">
348
+ <p class="text-sm font-medium text-gray-900 truncate">Lisa Brown</p>
349
+ <p class="text-sm text-gray-500 truncate">Created a new task: Prepare proposal for Global Tech</p>
350
+ </div>
351
+ <div class="inline-flex items-center text-sm text-gray-500">
352
+ 2 days ago
353
+ </div>
354
+ </div>
355
+ </li>
356
+ </ul>
357
+ </div>
358
+ </div>
359
+ </div>
360
+
361
+ <!-- Upcoming Tasks -->
362
+ <div>
363
+ <div class="bg-white rounded-lg shadow overflow-hidden">
364
+ <div class="px-4 py-5 border-b border-gray-200 sm:px-6">
365
+ <h3 class="text-lg font-medium leading-6 text-gray-900">Upcoming Tasks</h3>
366
+ </div>
367
+ <div class="bg-white overflow-y-auto" style="max-height: 400px;">
368
+ <ul class="divide-y divide-gray-200">
369
+ <li class="px-4 py-4">
370
+ <div class="flex items-start">
371
+ <input type="checkbox" class="custom-checkbox mt-1 mr-3">
372
+ <div class="flex-1 min-w-0">
373
+ <p class="text-sm font-medium text-gray-900">Follow up with Acme Corp</p>
374
+ <p class="text-xs text-gray-500">Due today at 2:00 PM</p>
375
+ <div class="mt-1 flex items-center text-xs text-gray-500">
376
+ <i class="fas fa-user mr-1"></i> Assigned to you
377
+ </div>
378
+ </div>
379
+ <div class="ml-2 flex-shrink-0 flex">
380
+ <button class="text-gray-400 hover:text-gray-500 focus:outline-none">
381
+ <i class="fas fa-ellipsis-v"></i>
382
+ </button>
383
+ </div>
384
+ </div>
385
+ </li>
386
+ <li class="px-4 py-4">
387
+ <div class="flex items-start">
388
+ <input type="checkbox" class="custom-checkbox mt-1 mr-3">
389
+ <div class="flex-1 min-w-0">
390
+ <p class="text-sm font-medium text-gray-900">Prepare quarterly report</p>
391
+ <p class="text-xs text-gray-500">Due tomorrow</p>
392
+ <div class="mt-1 flex items-center text-xs text-gray-500">
393
+ <i class="fas fa-user mr-1"></i> Assigned to you
394
+ </div>
395
+ </div>
396
+ <div class="ml-2 flex-shrink-0 flex">
397
+ <button class="text-gray-400 hover:text-gray-500 focus:outline-none">
398
+ <i class="fas fa-ellipsis-v"></i>
399
+ </button>
400
+ </div>
401
+ </div>
402
+ </li>
403
+ <li class="px-4 py-4">
404
+ <div class="flex items-start">
405
+ <input type="checkbox" class="custom-checkbox mt-1 mr-3">
406
+ <div class="flex-1 min-w-0">
407
+ <p class="text-sm font-medium text-gray-900">Send proposal to TechStart</p>
408
+ <p class="text-xs text-gray-500">Due in 2 days</p>
409
+ <div class="mt-1 flex items-center text-xs text-gray-500">
410
+ <i class="fas fa-user mr-1"></i> Assigned to Sarah
411
+ </div>
412
+ </div>
413
+ <div class="ml-2 flex-shrink-0 flex">
414
+ <button class="text-gray-400 hover:text-gray-500 focus:outline-none">
415
+ <i class="fas fa-ellipsis-v"></i>
416
+ </button>
417
+ </div>
418
+ </div>
419
+ </li>
420
+ <li class="px-4 py-4">
421
+ <div class="flex items-start">
422
+ <input type="checkbox" class="custom-checkbox mt-1 mr-3">
423
+ <div class="flex-1 min-w-0">
424
+ <p class="text-sm font-medium text-gray-900">Team meeting</p>
425
+ <p class="text-xs text-gray-500">Recurring every Monday at 10:00 AM</p>
426
+ <div class="mt-1 flex items-center text-xs text-gray-500">
427
+ <i class="fas fa-users mr-1"></i> Team event
428
+ </div>
429
+ </div>
430
+ <div class="ml-2 flex-shrink-0 flex">
431
+ <button class="text-gray-400 hover:text-gray-500 focus:outline-none">
432
+ <i class="fas fa-ellipsis-v"></i>
433
+ </button>
434
+ </div>
435
+ </div>
436
+ </li>
437
+ <li class="px-4 py-4">
438
+ <div class="flex items-start">
439
+ <input type="checkbox" class="custom-checkbox mt-1 mr-3">
440
+ <div class="flex-1 min-w-0">
441
+ <p class="text-sm font-medium text-gray-900">Review contract with XYZ</p>
442
+ <p class="text-xs text-gray-500">Due in 3 days</p>
443
+ <div class="mt-1 flex items-center text-xs text-gray-500">
444
+ <i class="fas fa-user mr-1"></i> Assigned to Michael
445
+ </div>
446
+ </div>
447
+ <div class="ml-2 flex-shrink-0 flex">
448
+ <button class="text-gray-400 hover:text-gray-500 focus:outline-none">
449
+ <i class="fas fa-ellipsis-v"></i>
450
+ </button>
451
+ </div>
452
+ </div>
453
+ </
454
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=tusharshinde2006/crm" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
455
+ </html>