Hugging Face's logo

Spaces:
XXXMARK
/
dashcms
Running

App Files Community
XXXMARK commited on
Commit
1dc43bc
·
verified ·
1 Parent(s): f5ba63c

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +1193 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Dashcms
3
- emoji: 👀
4
- colorFrom: indigo
5
- colorTo: red
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: dashcms
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
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,1193 @@
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>TeamFlow CMS Dashboard</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
+ <script>
10
+ tailwind.config = {
11
+ theme: {
12
+ extend: {
13
+ colors: {
14
+ primary: {
15
+ dark: '#0F172A',
16
+ light: '#1E293B',
17
+ },
18
+ accent: '#FBBF24',
19
+ }
20
+ }
21
+ }
22
+ }
23
+ </script>
24
+ <style>
25
+ /* Custom scrollbar */
26
+ ::-webkit-scrollbar {
27
+ width: 8px;
28
+ }
29
+ ::-webkit-scrollbar-track {
30
+ background: #1E293B;
31
+ }
32
+ ::-webkit-scrollbar-thumb {
33
+ background: #FBBF24;
34
+ border-radius: 4px;
35
+ }
36
+ ::-webkit-scrollbar-thumb:hover {
37
+ background: #D97706;
38
+ }
39
+
40
+ /* Animation for notifications */
41
+ @keyframes slideIn {
42
+ from { transform: translateX(100%); }
43
+ to { transform: translateX(0); }
44
+ }
45
+
46
+ .notification {
47
+ animation: slideIn 0.3s ease-out;
48
+ }
49
+
50
+ /* Tab content transition */
51
+ .tab-content {
52
+ transition: opacity 0.3s ease;
53
+ }
54
+ </style>
55
+ </head>
56
+ <body class="bg-primary-dark text-white min-h-screen">
57
+ <!-- Notification System -->
58
+ <div id="notification-container" class="fixed top-4 right-4 z-50 space-y-2"></div>
59
+
60
+ <!-- Main Container -->
61
+ <div class="flex h-screen overflow-hidden">
62
+ <!-- Sidebar -->
63
+ <div class="hidden md:flex md:flex-shrink-0">
64
+ <div class="flex flex-col w-64 bg-primary-light border-r border-gray-700">
65
+ <!-- Logo -->
66
+ <div class="flex items-center justify-center h-16 px-4 border-b border-gray-700">
67
+ <div class="flex items-center">
68
+ <i class="fas fa-users-cog text-accent text-2xl mr-2"></i>
69
+ <span class="text-xl font-bold">Team<span class="text-accent">Flow</span></span>
70
+ </div>
71
+ </div>
72
+
73
+ <!-- User Profile -->
74
+ <div class="flex items-center px-4 py-6 border-b border-gray-700">
75
+ <img class="h-10 w-10 rounded-full object-cover" src="https://randomuser.me/api/portraits/men/32.jpg" alt="User profile">
76
+ <div class="ml-3">
77
+ <p class="text-sm font-medium">John Doe</p>
78
+ <p class="text-xs text-gray-400">Admin</p>
79
+ </div>
80
+ </div>
81
+
82
+ <!-- Navigation -->
83
+ <div class="flex-1 overflow-y-auto">
84
+ <nav class="px-2 space-y-1">
85
+ <!-- Dashboard -->
86
+ <a href="#" onclick="showTab('dashboard')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md bg-primary-dark text-white hover:bg-gray-700 hover:text-accent">
87
+ <i class="fas fa-tachometer-alt mr-3 text-accent"></i>
88
+ Dashboard
89
+ </a>
90
+
91
+ <!-- Teams -->
92
+ <a href="#" onclick="showTab('teams')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
93
+ <i class="fas fa-users mr-3"></i>
94
+ Teams
95
+ </a>
96
+
97
+ <!-- Tasks -->
98
+ <a href="#" onclick="showTab('tasks')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
99
+ <i class="fas fa-tasks mr-3"></i>
100
+ Tasks
101
+ </a>
102
+
103
+ <!-- Affiliates -->
104
+ <a href="#" onclick="showTab('affiliates')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
105
+ <i class="fas fa-handshake mr-3"></i>
106
+ Affiliates
107
+ </a>
108
+
109
+ <!-- Referrals -->
110
+ <a href="#" onclick="showTab('referrals')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
111
+ <i class="fas fa-user-plus mr-3"></i>
112
+ Referrals
113
+ </a>
114
+
115
+ <!-- Payouts -->
116
+ <a href="#" onclick="showTab('payouts')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
117
+ <i class="fas fa-money-bill-wave mr-3"></i>
118
+ Payouts
119
+ </a>
120
+
121
+ <!-- Challenges -->
122
+ <a href="#" onclick="showTab('challenges')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
123
+ <i class="fas fa-trophy mr-3"></i>
124
+ Challenges
125
+ </a>
126
+
127
+ <!-- Rewards -->
128
+ <a href="#" onclick="showTab('rewards')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
129
+ <i class="fas fa-award mr-3"></i>
130
+ Rewards
131
+ </a>
132
+
133
+ <!-- Points -->
134
+ <a href="#" onclick="showTab('points')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
135
+ <i class="fas fa-coins mr-3"></i>
136
+ Points
137
+ </a>
138
+
139
+ <!-- Newsletter -->
140
+ <a href="#" onclick="showTab('newsletter')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
141
+ <i class="fas fa-newspaper mr-3"></i>
142
+ Newsletter
143
+ </a>
144
+
145
+ <!-- Sign Up -->
146
+ <a href="#" onclick="showTab('signup')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
147
+ <i class="fas fa-user-plus mr-3"></i>
148
+ Sign Up
149
+ </a>
150
+
151
+ <!-- AI Assistance -->
152
+ <a href="#" onclick="showTab('ai-assistance')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
153
+ <i class="fas fa-robot mr-3"></i>
154
+ AI Assistance
155
+ </a>
156
+
157
+ <!-- AI Support Chat -->
158
+ <a href="#" onclick="showTab('ai-support')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
159
+ <i class="fas fa-comments mr-3"></i>
160
+ AI Support Chat
161
+ </a>
162
+
163
+ <!-- Marketplace -->
164
+ <a href="#" onclick="showTab('marketplace')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
165
+ <i class="fas fa-store mr-3"></i>
166
+ Marketplace
167
+ </a>
168
+
169
+ <!-- Profile -->
170
+ <a href="#" onclick="showTab('profile')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
171
+ <i class="fas fa-user-circle mr-3"></i>
172
+ Profile
173
+ </a>
174
+
175
+ <!-- Admin Panel -->
176
+ <a href="#" onclick="showTab('admin')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
177
+ <i class="fas fa-lock mr-3"></i>
178
+ Admin Panel
179
+ </a>
180
+
181
+ <!-- Settings -->
182
+ <a href="#" onclick="showTab('settings')" class="tab-link group flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:bg-gray-700 hover:text-accent">
183
+ <i class="fas fa-cog mr-3"></i>
184
+ Settings
185
+ </a>
186
+ </nav>
187
+ </div>
188
+ </div>
189
+ </div>
190
+
191
+ <!-- Main Content -->
192
+ <div class="flex-1 overflow-auto">
193
+ <!-- Top Navigation -->
194
+ <div class="flex items-center justify-between h-16 px-4 border-b border-gray-700 bg-primary-light">
195
+ <!-- Mobile menu button -->
196
+ <div class="md:hidden">
197
+ <button onclick="toggleMobileMenu()" class="text-gray-300 hover:text-white focus:outline-none">
198
+ <i class="fas fa-bars text-xl"></i>
199
+ </button>
200
+ </div>
201
+
202
+ <!-- Search bar -->
203
+ <div class="flex-1 max-w-md mx-4">
204
+ <div class="relative">
205
+ <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
206
+ <i class="fas fa-search text-gray-400"></i>
207
+ </div>
208
+ <input class="block w-full pl-10 pr-3 py-2 border border-gray-600 rounded-md bg-gray-700 text-white placeholder-gray-400 focus:outline-none focus:ring-1 focus:ring-accent focus:border-accent" placeholder="Search..." type="search">
209
+ </div>
210
+ </div>
211
+
212
+ <!-- Right side icons -->
213
+ <div class="flex items-center space-x-4">
214
+ <button class="text-gray-300 hover:text-white focus:outline-none">
215
+ <i class="fas fa-bell text-xl"></i>
216
+ </button>
217
+ <button class="text-gray-300 hover:text-white focus:outline-none">
218
+ <i class="fas fa-question-circle text-xl"></i>
219
+ </button>
220
+ <button onclick="toggleDarkMode()" class="text-gray-300 hover:text-white focus:outline-none">
221
+ <i class="fas fa-moon text-xl"></i>
222
+ </button>
223
+ </div>
224
+ </div>
225
+
226
+ <!-- Mobile Menu (hidden by default) -->
227
+ <div id="mobile-menu" class="hidden md:hidden bg-primary-light border-b border-gray-700">
228
+ <div class="px-2 pt-2 pb-3 space-y-1">
229
+ <a href="#" onclick="showTab('dashboard')" class="tab-link block px-3 py-2 rounded-md text-base font-medium text-white hover:bg-gray-700 hover:text-accent">
230
+ <i class="fas fa-tachometer-alt mr-2 text-accent"></i>
231
+ Dashboard
232
+ </a>
233
+ <a href="#" onclick="showTab('teams')" class="tab-link block px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:bg-gray-700 hover:text-accent">
234
+ <i class="fas fa-users mr-2"></i>
235
+ Teams
236
+ </a>
237
+ <a href="#" onclick="showTab('tasks')" class="tab-link block px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:bg-gray-700 hover:text-accent">
238
+ <i class="fas fa-tasks mr-2"></i>
239
+ Tasks
240
+ </a>
241
+ <!-- Add more mobile menu items as needed -->
242
+ </div>
243
+ </div>
244
+
245
+ <!-- Main Content Area -->
246
+ <main class="p-4">
247
+ <!-- Dashboard Tab Content -->
248
+ <div id="dashboard" class="tab-content">
249
+ <div class="flex justify-between items-center mb-6">
250
+ <h2 class="text-2xl font-bold">Dashboard Overview</h2>
251
+ <button class="bg-accent hover:bg-yellow-500 text-primary-dark font-bold py-2 px-4 rounded flex items-center">
252
+ <i class="fas fa-plus mr-2"></i> Quick Action
253
+ </button>
254
+ </div>
255
+
256
+ <!-- Stats Cards -->
257
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
258
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
259
+ <div class="flex items-center">
260
+ <div class="p-3 rounded-full bg-opacity-20 bg-yellow-500 text-accent mr-4">
261
+ <i class="fas fa-users text-xl"></i>
262
+ </div>
263
+ <div>
264
+ <p class="text-gray-400 text-sm">Active Teams</p>
265
+ <p class="text-xl font-bold">24</p>
266
+ </div>
267
+ </div>
268
+ </div>
269
+
270
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
271
+ <div class="flex items-center">
272
+ <div class="p-3 rounded-full bg-opacity-20 bg-green-500 text-green-400 mr-4">
273
+ <i class="fas fa-tasks text-xl"></i>
274
+ </div>
275
+ <div>
276
+ <p class="text-gray-400 text-sm">Completed Tasks</p>
277
+ <p class="text-xl font-bold">156</p>
278
+ </div>
279
+ </div>
280
+ </div>
281
+
282
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
283
+ <div class="flex items-center">
284
+ <div class="p-3 rounded-full bg-opacity-20 bg-blue-500 text-blue-400 mr-4">
285
+ <i class="fas fa-handshake text-xl"></i>
286
+ </div>
287
+ <div>
288
+ <p class="text-gray-400 text-sm">Affiliates</p>
289
+ <p class="text-xl font-bold">42</p>
290
+ </div>
291
+ </div>
292
+ </div>
293
+
294
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
295
+ <div class="flex items-center">
296
+ <div class="p-3 rounded-full bg-opacity-20 bg-purple-500 text-purple-400 mr-4">
297
+ <i class="fas fa-coins text-xl"></i>
298
+ </div>
299
+ <div>
300
+ <p class="text-gray-400 text-sm">Points Earned</p>
301
+ <p class="text-xl font-bold">1,240</p>
302
+ </div>
303
+ </div>
304
+ </div>
305
+ </div>
306
+
307
+ <!-- Recent Activity -->
308
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700 mb-6">
309
+ <div class="flex justify-between items-center mb-4">
310
+ <h3 class="text-lg font-semibold">Recent Activity</h3>
311
+ <button class="text-accent hover:text-yellow-500 text-sm">View All</button>
312
+ </div>
313
+ <div class="space-y-4">
314
+ <div class="flex items-start">
315
+ <img class="h-8 w-8 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/44.jpg" alt="User avatar">
316
+ <div class="flex-1">
317
+ <p class="text-sm"><span class="font-medium">Sarah Johnson</span> completed task <span class="text-accent">"Update marketing materials"</span></p>
318
+ <p class="text-xs text-gray-400">2 hours ago</p>
319
+ </div>
320
+ </div>
321
+ <div class="flex items-start">
322
+ <img class="h-8 w-8 rounded-full mr-3" src="https://randomuser.me/api/portraits/men/32.jpg" alt="User avatar">
323
+ <div class="flex-1">
324
+ <p class="text-sm"><span class="font-medium">John Doe</span> created a new team <span class="text-accent">"Content Creators"</span></p>
325
+ <p class="text-xs text-gray-400">5 hours ago</p>
326
+ </div>
327
+ </div>
328
+ <div class="flex items-start">
329
+ <img class="h-8 w-8 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/68.jpg" alt="User avatar">
330
+ <div class="flex-1">
331
+ <p class="text-sm"><span class="font-medium">Emily Chen</span> earned <span class="text-accent">150 points</span> for completing a challenge</p>
332
+ <p class="text-xs text-gray-400">1 day ago</p>
333
+ </div>
334
+ </div>
335
+ </div>
336
+ </div>
337
+
338
+ <!-- Quick Actions -->
339
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
340
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
341
+ <h3 class="text-lg font-semibold mb-4">Quick Actions</h3>
342
+ <div class="grid grid-cols-2 gap-3">
343
+ <button onclick="showTab('tasks')" class="flex flex-col items-center justify-center p-3 bg-gray-700 rounded-lg hover:bg-gray-600 transition">
344
+ <i class="fas fa-tasks text-accent text-xl mb-2"></i>
345
+ <span class="text-sm">Create Task</span>
346
+ </button>
347
+ <button onclick="showTab('teams')" class="flex flex-col items-center justify-center p-3 bg-gray-700 rounded-lg hover:bg-gray-600 transition">
348
+ <i class="fas fa-users text-accent text-xl mb-2"></i>
349
+ <span class="text-sm">Add Team</span>
350
+ </button>
351
+ <button onclick="showTab('challenges')" class="flex flex-col items-center justify-center p-3 bg-gray-700 rounded-lg hover:bg-gray-600 transition">
352
+ <i class="fas fa-trophy text-accent text-xl mb-2"></i>
353
+ <span class="text-sm">New Challenge</span>
354
+ </button>
355
+ <button onclick="showTab('newsletter')" class="flex flex-col items-center justify-center p-3 bg-gray-700 rounded-lg hover:bg-gray-600 transition">
356
+ <i class="fas fa-envelope text-accent text-xl mb-2"></i>
357
+ <span class="text-sm">Send Newsletter</span>
358
+ </button>
359
+ </div>
360
+ </div>
361
+
362
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
363
+ <h3 class="text-lg font-semibold mb-4">Upcoming Deadlines</h3>
364
+ <div class="space-y-3">
365
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
366
+ <div>
367
+ <p class="text-sm font-medium">Q2 Marketing Report</p>
368
+ <p class="text-xs text-gray-400">Due in 3 days</p>
369
+ </div>
370
+ <span class="text-xs px-2 py-1 bg-yellow-500 bg-opacity-20 text-accent rounded">Team Task</span>
371
+ </div>
372
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
373
+ <div>
374
+ <p class="text-sm font-medium">Affiliate Payouts</p>
375
+ <p class="text-xs text-gray-400">Due in 5 days</p>
376
+ </div>
377
+ <span class="text-xs px-2 py-1 bg-green-500 bg-opacity-20 text-green-400 rounded">Financial</span>
378
+ </div>
379
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
380
+ <div>
381
+ <p class="text-sm font-medium">Monthly Newsletter</p>
382
+ <p class="text-xs text-gray-400">Due in 2 days</p>
383
+ </div>
384
+ <span class="text-xs px-2 py-1 bg-blue-500 bg-opacity-20 text-blue-400 rounded">Communication</span>
385
+ </div>
386
+ </div>
387
+ </div>
388
+ </div>
389
+ </div>
390
+
391
+ <!-- Teams Tab Content -->
392
+ <div id="teams" class="tab-content hidden">
393
+ <div class="flex justify-between items-center mb-6">
394
+ <h2 class="text-2xl font-bold">Teams Management</h2>
395
+ <button onclick="openTeamModal()" class="bg-accent hover:bg-yellow-500 text-primary-dark font-bold py-2 px-4 rounded flex items-center">
396
+ <i class="fas fa-plus mr-2"></i> New Team
397
+ </button>
398
+ </div>
399
+
400
+ <!-- Team Filters -->
401
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700 mb-6">
402
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
403
+ <div>
404
+ <label class="block text-sm font-medium text-gray-300 mb-1">Search</label>
405
+ <input type="text" class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-white focus:outline-none focus:ring-1 focus:ring-accent">
406
+ </div>
407
+ <div>
408
+ <label class="block text-sm font-medium text-gray-300 mb-1">Department</label>
409
+ <select class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-white focus:outline-none focus:ring-1 focus:ring-accent">
410
+ <option>All Departments</option>
411
+ <option>Marketing</option>
412
+ <option>Development</option>
413
+ <option>Sales</option>
414
+ <option>Support</option>
415
+ </select>
416
+ </div>
417
+ <div>
418
+ <label class="block text-sm font-medium text-gray-300 mb-1">Status</label>
419
+ <select class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-white focus:outline-none focus:ring-1 focus:ring-accent">
420
+ <option>All Statuses</option>
421
+ <option>Active</option>
422
+ <option>Inactive</option>
423
+ <option>Archived</option>
424
+ </select>
425
+ </div>
426
+ <div class="flex items-end">
427
+ <button class="w-full bg-accent hover:bg-yellow-500 text-primary-dark font-bold py-2 px-4 rounded">
428
+ Apply Filters
429
+ </button>
430
+ </div>
431
+ </div>
432
+ </div>
433
+
434
+ <!-- Teams Table -->
435
+ <div class="bg-primary-light rounded-lg border border-gray-700 overflow-hidden">
436
+ <div class="overflow-x-auto">
437
+ <table class="min-w-full divide-y divide-gray-700">
438
+ <thead class="bg-gray-800">
439
+ <tr>
440
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Team Name</th>
441
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Department</th>
442
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Members</th>
443
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Status</th>
444
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Actions</th>
445
+ </tr>
446
+ </thead>
447
+ <tbody class="bg-primary-light divide-y divide-gray-700">
448
+ <tr>
449
+ <td class="px-6 py-4 whitespace-nowrap">
450
+ <div class="flex items-center">
451
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-yellow-500 bg-opacity-20 flex items-center justify-center text-accent">
452
+ <i class="fas fa-users"></i>
453
+ </div>
454
+ <div class="ml-4">
455
+ <div class="text-sm font-medium">Marketing Team</div>
456
+ <div class="text-sm text-gray-400">Created: 12/05/2023</div>
457
+ </div>
458
+ </div>
459
+ </td>
460
+ <td class="px-6 py-4 whitespace-nowrap">
461
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-500 bg-opacity-20 text-blue-400">Marketing</span>
462
+ </td>
463
+ <td class="px-6 py-4 whitespace-nowrap">
464
+ <div class="flex -space-x-2">
465
+ <img class="h-8 w-8 rounded-full border-2 border-primary-light" src="https://randomuser.me/api/portraits/women/44.jpg" alt="">
466
+ <img class="h-8 w-8 rounded-full border-2 border-primary-light" src="https://randomuser.me/api/portraits/men/32.jpg" alt="">
467
+ <img class="h-8 w-8 rounded-full border-2 border-primary-light" src="https://randomuser.me/api/portraits/women/68.jpg" alt="">
468
+ <div class="h-8 w-8 rounded-full border-2 border-primary-light bg-gray-700 flex items-center justify-center text-xs">+5</div>
469
+ </div>
470
+ </td>
471
+ <td class="px-6 py-4 whitespace-nowrap">
472
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-500 bg-opacity-20 text-green-400">Active</span>
473
+ </td>
474
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
475
+ <button class="text-accent hover:text-yellow-500 mr-3"><i class="fas fa-edit"></i></button>
476
+ <button class="text-blue-400 hover:text-blue-300 mr-3"><i class="fas fa-eye"></i></button>
477
+ <button class="text-red-400 hover:text-red-300"><i class="fas fa-trash"></i></button>
478
+ </td>
479
+ </tr>
480
+ <tr>
481
+ <td class="px-6 py-4 whitespace-nowrap">
482
+ <div class="flex items-center">
483
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-yellow-500 bg-opacity-20 flex items-center justify-center text-accent">
484
+ <i class="fas fa-users"></i>
485
+ </div>
486
+ <div class="ml-4">
487
+ <div class="text-sm font-medium">Development Team</div>
488
+ <div class="text-sm text-gray-400">Created: 05/03/2023</div>
489
+ </div>
490
+ </div>
491
+ </td>
492
+ <td class="px-6 py-4 whitespace-nowrap">
493
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-purple-500 bg-opacity-20 text-purple-400">Development</span>
494
+ </td>
495
+ <td class="px-6 py-4 whitespace-nowrap">
496
+ <div class="flex -space-x-2">
497
+ <img class="h-8 w-8 rounded-full border-2 border-primary-light" src="https://randomuser.me/api/portraits/men/75.jpg" alt="">
498
+ <img class="h-8 w-8 rounded-full border-2 border-primary-light" src="https://randomuser.me/api/portraits/women/12.jpg" alt="">
499
+ <div class="h-8 w-8 rounded-full border-2 border-primary-light bg-gray-700 flex items-center justify-center text-xs">+8</div>
500
+ </div>
501
+ </td>
502
+ <td class="px-6 py-4 whitespace-nowrap">
503
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-500 bg-opacity-20 text-green-400">Active</span>
504
+ </td>
505
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
506
+ <button class="text-accent hover:text-yellow-500 mr-3"><i class="fas fa-edit"></i></button>
507
+ <button class="text-blue-400 hover:text-blue-300 mr-3"><i class="fas fa-eye"></i></button>
508
+ <button class="text-red-400 hover:text-red-300"><i class="fas fa-trash"></i></button>
509
+ </td>
510
+ </tr>
511
+ <tr>
512
+ <td class="px-6 py-4 whitespace-nowrap">
513
+ <div class="flex items-center">
514
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-yellow-500 bg-opacity-20 flex items-center justify-center text-accent">
515
+ <i class="fas fa-users"></i>
516
+ </div>
517
+ <div class="ml-4">
518
+ <div class="text-sm font-medium">Content Creators</div>
519
+ <div class="text-sm text-gray-400">Created: 18/06/2023</div>
520
+ </div>
521
+ </div>
522
+ </td>
523
+ <td class="px-6 py-4 whitespace-nowrap">
524
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-pink-500 bg-opacity-20 text-pink-400">Content</span>
525
+ </td>
526
+ <td class="px-6 py-4 whitespace-nowrap">
527
+ <div class="flex -space-x-2">
528
+ <img class="h-8 w-8 rounded-full border-2 border-primary-light" src="https://randomuser.me/api/portraits/women/68.jpg" alt="">
529
+ <img class="h-8 w-8 rounded-full border-2 border-primary-light" src="https://randomuser.me/api/portraits/men/42.jpg" alt="">
530
+ <div class="h-8 w-8 rounded-full border-2 border-primary-light bg-gray-700 flex items-center justify-center text-xs">+3</div>
531
+ </div>
532
+ </td>
533
+ <td class="px-6 py-4 whitespace-nowrap">
534
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-500 bg-opacity-20 text-green-400">Active</span>
535
+ </td>
536
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
537
+ <button class="text-accent hover:text-yellow-500 mr-3"><i class="fas fa-edit"></i></button>
538
+ <button class="text-blue-400 hover:text-blue-300 mr-3"><i class="fas fa-eye"></i></button>
539
+ <button class="text-red-400 hover:text-red-300"><i class="fas fa-trash"></i></button>
540
+ </td>
541
+ </tr>
542
+ </tbody>
543
+ </table>
544
+ </div>
545
+ <div class="px-6 py-4 flex items-center justify-between border-t border-gray-700">
546
+ <div class="text-sm text-gray-400">Showing <span class="font-medium">1</span> to <span class="font-medium">3</span> of <span class="font-medium">24</span> teams</div>
547
+ <div class="flex space-x-2">
548
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">Previous</button>
549
+ <button class="px-3 py-1 rounded-md bg-accent text-primary-dark font-medium">1</button>
550
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">2</button>
551
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">3</button>
552
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">Next</button>
553
+ </div>
554
+ </div>
555
+ </div>
556
+ </div>
557
+
558
+ <!-- Tasks Tab Content -->
559
+ <div id="tasks" class="tab-content hidden">
560
+ <div class="flex justify-between items-center mb-6">
561
+ <h2 class="text-2xl font-bold">Task Management</h2>
562
+ <button onclick="openTaskModal()" class="bg-accent hover:bg-yellow-500 text-primary-dark font-bold py-2 px-4 rounded flex items-center">
563
+ <i class="fas fa-plus mr-2"></i> New Task
564
+ </button>
565
+ </div>
566
+
567
+ <!-- Task Board -->
568
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
569
+ <!-- To Do Column -->
570
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
571
+ <div class="flex justify-between items-center mb-4">
572
+ <h3 class="font-semibold">To Do</h3>
573
+ <span class="text-xs px-2 py-1 bg-gray-700 rounded-full">5 tasks</span>
574
+ </div>
575
+ <div class="space-y-3">
576
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-yellow-500">
577
+ <div class="flex justify-between items-start mb-2">
578
+ <h4 class="font-medium">Update website content</h4>
579
+ <div class="flex space-x-1">
580
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-edit text-xs"></i></button>
581
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-trash text-xs"></i></button>
582
+ </div>
583
+ </div>
584
+ <p class="text-xs text-gray-400 mb-2">Update homepage with new products and promotions</p>
585
+ <div class="flex justify-between items-center">
586
+ <span class="text-xs px-2 py-1 bg-gray-800 rounded-full">Marketing</span>
587
+ <span class="text-xs text-gray-400">Due: Tomorrow</span>
588
+ </div>
589
+ </div>
590
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-yellow-500">
591
+ <div class="flex justify-between items-start mb-2">
592
+ <h4 class="font-medium">Create Q2 report</h4>
593
+ <div class="flex space-x-1">
594
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-edit text-xs"></i></button>
595
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-trash text-xs"></i></button>
596
+ </div>
597
+ </div>
598
+ <p class="text-xs text-gray-400 mb-2">Compile all Q2 metrics and prepare presentation</p>
599
+ <div class="flex justify-between items-center">
600
+ <span class="text-xs px-2 py-1 bg-gray-800 rounded-full">Analytics</span>
601
+ <span class="text-xs text-gray-400">Due: Friday</span>
602
+ </div>
603
+ </div>
604
+ <button class="w-full text-gray-400 hover:text-gray-300 text-sm flex items-center justify-center py-2 border border-dashed border-gray-600 rounded-lg">
605
+ <i class="fas fa-plus mr-1"></i> Add Task
606
+ </button>
607
+ </div>
608
+ </div>
609
+
610
+ <!-- In Progress Column -->
611
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
612
+ <div class="flex justify-between items-center mb-4">
613
+ <h3 class="font-semibold">In Progress</h3>
614
+ <span class="text-xs px-2 py-1 bg-gray-700 rounded-full">3 tasks</span>
615
+ </div>
616
+ <div class="space-y-3">
617
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-blue-500">
618
+ <div class="flex justify-between items-start mb-2">
619
+ <h4 class="font-medium">Implement new API</h4>
620
+ <div class="flex space-x-1">
621
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-edit text-xs"></i></button>
622
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-trash text-xs"></i></button>
623
+ </div>
624
+ </div>
625
+ <p class="text-xs text-gray-400 mb-2">Integrate payment gateway with new API endpoints</p>
626
+ <div class="flex justify-between items-center">
627
+ <span class="text-xs px-2 py-1 bg-gray-800 rounded-full">Development</span>
628
+ <span class="text-xs text-gray-400">Due: 2 days</span>
629
+ </div>
630
+ </div>
631
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-blue-500">
632
+ <div class="flex justify-between items-start mb-2">
633
+ <h4 class="font-medium">Design landing page</h4>
634
+ <div class="flex space-x-1">
635
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-edit text-xs"></i></button>
636
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-trash text-xs"></i></button>
637
+ </div>
638
+ </div>
639
+ <p class="text-xs text-gray-400 mb-2">Create wireframes and mockups for new campaign</p>
640
+ <div class="flex justify-between items-center">
641
+ <span class="text-xs px-2 py-1 bg-gray-800 rounded-full">Design</span>
642
+ <span class="text-xs text-gray-400">Due: Monday</span>
643
+ </div>
644
+ </div>
645
+ <button class="w-full text-gray-400 hover:text-gray-300 text-sm flex items-center justify-center py-2 border border-dashed border-gray-600 rounded-lg">
646
+ <i class="fas fa-plus mr-1"></i> Add Task
647
+ </button>
648
+ </div>
649
+ </div>
650
+
651
+ <!-- Review Column -->
652
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
653
+ <div class="flex justify-between items-center mb-4">
654
+ <h3 class="font-semibold">In Review</h3>
655
+ <span class="text-xs px-2 py-1 bg-gray-700 rounded-full">2 tasks</span>
656
+ </div>
657
+ <div class="space-y-3">
658
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-purple-500">
659
+ <div class="flex justify-between items-start mb-2">
660
+ <h4 class="font-medium">Blog post draft</h4>
661
+ <div class="flex space-x-1">
662
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-edit text-xs"></i></button>
663
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-trash text-xs"></i></button>
664
+ </div>
665
+ </div>
666
+ <p class="text-xs text-gray-400 mb-2">Review and edit the new blog post about industry trends</p>
667
+ <div class="flex justify-between items-center">
668
+ <span class="text-xs px-2 py-1 bg-gray-800 rounded-full">Content</span>
669
+ <span class="text-xs text-gray-400">Due: Today</span>
670
+ </div>
671
+ </div>
672
+ <button class="w-full text-gray-400 hover:text-gray-300 text-sm flex items-center justify-center py-2 border border-dashed border-gray-600 rounded-lg">
673
+ <i class="fas fa-plus mr-1"></i> Add Task
674
+ </button>
675
+ </div>
676
+ </div>
677
+
678
+ <!-- Completed Column -->
679
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
680
+ <div class="flex justify-between items-center mb-4">
681
+ <h3 class="font-semibold">Completed</h3>
682
+ <span class="text-xs px-2 py-1 bg-gray-700 rounded-full">8 tasks</span>
683
+ </div>
684
+ <div class="space-y-3">
685
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-green-500 opacity-70">
686
+ <div class="flex justify-between items-start mb-2">
687
+ <h4 class="font-medium">Social media campaign</h4>
688
+ <div class="flex space-x-1">
689
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-edit text-xs"></i></button>
690
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-trash text-xs"></i></button>
691
+ </div>
692
+ </div>
693
+ <p class="text-xs text-gray-400 mb-2">Launch summer promotion across all platforms</p>
694
+ <div class="flex justify-between items-center">
695
+ <span class="text-xs px-2 py-1 bg-gray-800 rounded-full">Marketing</span>
696
+ <span class="text-xs text-green-400">Completed</span>
697
+ </div>
698
+ </div>
699
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-green-500 opacity-70">
700
+ <div class="flex justify-between items-start mb-2">
701
+ <h4 class="font-medium">Bug fixes</h4>
702
+ <div class="flex space-x-1">
703
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-edit text-xs"></i></button>
704
+ <button class="text-gray-400 hover:text-white"><i class="fas fa-trash text-xs"></i></button>
705
+ </div>
706
+ </div>
707
+ <p class="text-xs text-gray-400 mb-2">Resolve reported issues from user feedback</p>
708
+ <div class="flex justify-between items-center">
709
+ <span class="text-xs px-2 py-1 bg-gray-800 rounded-full">Development</span>
710
+ <span class="text-xs text-green-400">Completed</span>
711
+ </div>
712
+ </div>
713
+ <button class="w-full text-gray-400 hover:text-gray-300 text-sm flex items-center justify-center py-2 border border-dashed border-gray-600 rounded-lg">
714
+ <i class="fas fa-plus mr-1"></i> Add Task
715
+ </button>
716
+ </div>
717
+ </div>
718
+ </div>
719
+ </div>
720
+
721
+ <!-- Affiliates Tab Content -->
722
+ <div id="affiliates" class="tab-content hidden">
723
+ <div class="flex justify-between items-center mb-6">
724
+ <h2 class="text-2xl font-bold">Affiliate Program</h2>
725
+ <button onclick="openAffiliateModal()" class="bg-accent hover:bg-yellow-500 text-primary-dark font-bold py-2 px-4 rounded flex items-center">
726
+ <i class="fas fa-plus mr-2"></i> Add Affiliate
727
+ </button>
728
+ </div>
729
+
730
+ <!-- Affiliate Stats -->
731
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
732
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
733
+ <div class="flex items-center justify-between">
734
+ <div>
735
+ <p class="text-gray-400 text-sm">Total Affiliates</p>
736
+ <p class="text-xl font-bold">42</p>
737
+ </div>
738
+ <div class="p-3 rounded-full bg-opacity-20 bg-blue-500 text-blue-400">
739
+ <i class="fas fa-handshake text-xl"></i>
740
+ </div>
741
+ </div>
742
+ </div>
743
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
744
+ <div class="flex items-center justify-between">
745
+ <div>
746
+ <p class="text-gray-400 text-sm">Active This Month</p>
747
+ <p class="text-xl font-bold">18</p>
748
+ </div>
749
+ <div class="p-3 rounded-full bg-opacity-20 bg-green-500 text-green-400">
750
+ <i class="fas fa-chart-line text-xl"></i>
751
+ </div>
752
+ </div>
753
+ </div>
754
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
755
+ <div class="flex items-center justify-between">
756
+ <div>
757
+ <p class="text-gray-400 text-sm">Total Revenue</p>
758
+ <p class="text-xl font-bold">$12,450</p>
759
+ </div>
760
+ <div class="p-3 rounded-full bg-opacity-20 bg-purple-500 text-purple-400">
761
+ <i class="fas fa-dollar-sign text-xl"></i>
762
+ </div>
763
+ </div>
764
+ </div>
765
+ </div>
766
+
767
+ <!-- Affiliates Table -->
768
+ <div class="bg-primary-light rounded-lg border border-gray-700 overflow-hidden">
769
+ <div class="overflow-x-auto">
770
+ <table class="min-w-full divide-y divide-gray-700">
771
+ <thead class="bg-gray-800">
772
+ <tr>
773
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Affiliate</th>
774
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Referrals</th>
775
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Conversions</th>
776
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Earnings</th>
777
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Status</th>
778
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Actions</th>
779
+ </tr>
780
+ </thead>
781
+ <tbody class="bg-primary-light divide-y divide-gray-700">
782
+ <tr>
783
+ <td class="px-6 py-4 whitespace-nowrap">
784
+ <div class="flex items-center">
785
+ <img class="h-10 w-10 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/32.jpg" alt="">
786
+ <div>
787
+ <div class="font-medium">Sarah Johnson</div>
788
+ <div class="text-sm text-gray-400">[email protected]</div>
789
+ </div>
790
+ </div>
791
+ </td>
792
+ <td class="px-6 py-4 whitespace-nowrap">
793
+ <div class="text-sm">156</div>
794
+ </td>
795
+ <td class="px-6 py-4 whitespace-nowrap">
796
+ <div class="text-sm">42 (27%)</div>
797
+ </td>
798
+ <td class="px-6 py-4 whitespace-nowrap">
799
+ <div class="text-sm font-medium">$2,450</div>
800
+ </td>
801
+ <td class="px-6 py-4 whitespace-nowrap">
802
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-500 bg-opacity-20 text-green-400">Active</span>
803
+ </td>
804
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
805
+ <button class="text-accent hover:text-yellow-500 mr-3"><i class="fas fa-edit"></i></button>
806
+ <button class="text-blue-400 hover:text-blue-300 mr-3"><i class="fas fa-eye"></i></button>
807
+ <button class="text-red-400 hover:text-red-300"><i class="fas fa-trash"></i></button>
808
+ </td>
809
+ </tr>
810
+ <tr>
811
+ <td class="px-6 py-4 whitespace-nowrap">
812
+ <div class="flex items-center">
813
+ <img class="h-10 w-10 rounded-full mr-3" src="https://randomuser.me/api/portraits/men/54.jpg" alt="">
814
+ <div>
815
+ <div class="font-medium">Michael Chen</div>
816
+ <div class="text-sm text-gray-400">[email protected]</div>
817
+ </div>
818
+ </div>
819
+ </td>
820
+ <td class="px-6 py-4 whitespace-nowrap">
821
+ <div class="text-sm">98</div>
822
+ </td>
823
+ <td class="px-6 py-4 whitespace-nowrap">
824
+ <div class="text-sm">23 (23%)</div>
825
+ </td>
826
+ <td class="px-6 py-4 whitespace-nowrap">
827
+ <div class="text-sm font-medium">$1,320</div>
828
+ </td>
829
+ <td class="px-6 py-4 whitespace-nowrap">
830
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-500 bg-opacity-20 text-green-400">Active</span>
831
+ </td>
832
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
833
+ <button class="text-accent hover:text-yellow-500 mr-3"><i class="fas fa-edit"></i></button>
834
+ <button class="text-blue-400 hover:text-blue-300 mr-3"><i class="fas fa-eye"></i></button>
835
+ <button class="text-red-400 hover:text-red-300"><i class="fas fa-trash"></i></button>
836
+ </td>
837
+ </tr>
838
+ <tr>
839
+ <td class="px-6 py-4 whitespace-nowrap">
840
+ <div class="flex items-center">
841
+ <img class="h-10 w-10 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/68.jpg" alt="">
842
+ <div>
843
+ <div class="font-medium">Emily Rodriguez</div>
844
+ <div class="text-sm text-gray-400">[email protected]</div>
845
+ </div>
846
+ </div>
847
+ </td>
848
+ <td class="px-6 py-4 whitespace-nowrap">
849
+ <div class="text-sm">76</div>
850
+ </td>
851
+ <td class="px-6 py-4 whitespace-nowrap">
852
+ <div class="text-sm">15 (20%)</div>
853
+ </td>
854
+ <td class="px-6 py-4 whitespace-nowrap">
855
+ <div class="text-sm font-medium">$890</div>
856
+ </td>
857
+ <td class="px-6 py-4 whitespace-nowrap">
858
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-500 bg-opacity-20 text-yellow-400">Pending</span>
859
+ </td>
860
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
861
+ <button class="text-accent hover:text-yellow-500 mr-3"><i class="fas fa-edit"></i></button>
862
+ <button class="text-blue-400 hover:text-blue-300 mr-3"><i class="fas fa-eye"></i></button>
863
+ <button class="text-red-400 hover:text-red-300"><i class="fas fa-trash"></i></button>
864
+ </td>
865
+ </tr>
866
+ </tbody>
867
+ </table>
868
+ </div>
869
+ <div class="px-6 py-4 flex items-center justify-between border-t border-gray-700">
870
+ <div class="text-sm text-gray-400">Showing <span class="font-medium">1</span> to <span class="font-medium">3</span> of <span class="font-medium">42</span> affiliates</div>
871
+ <div class="flex space-x-2">
872
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">Previous</button>
873
+ <button class="px-3 py-1 rounded-md bg-accent text-primary-dark font-medium">1</button>
874
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">2</button>
875
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">3</button>
876
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600">Next</button>
877
+ </div>
878
+ </div>
879
+ </div>
880
+ </div>
881
+
882
+ <!-- Referrals Tab Content -->
883
+ <div id="referrals" class="tab-content hidden">
884
+ <div class="flex justify-between items-center mb-6">
885
+ <h2 class="text-2xl font-bold">Referral Program</h2>
886
+ <button onclick="openReferralModal()" class="bg-accent hover:bg-yellow-500 text-primary-dark font-bold py-2 px-4 rounded flex items-center">
887
+ <i class="fas fa-cog mr-2"></i> Program Settings
888
+ </button>
889
+ </div>
890
+
891
+ <!-- Referral Stats -->
892
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
893
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
894
+ <div class="flex items-center justify-between">
895
+ <div>
896
+ <p class="text-gray-400 text-sm">Total Referrals</p>
897
+ <p class="text-xl font-bold">328</p>
898
+ </div>
899
+ <div class="p-3 rounded-full bg-opacity-20 bg-blue-500 text-blue-400">
900
+ <i class="fas fa-user-plus text-xl"></i>
901
+ </div>
902
+ </div>
903
+ </div>
904
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
905
+ <div class="flex items-center justify-between">
906
+ <div>
907
+ <p class="text-gray-400 text-sm">Active Users</p>
908
+ <p class="text-xl font-bold">142</p>
909
+ </div>
910
+ <div class="p-3 rounded-full bg-opacity-20 bg-green-500 text-green-400">
911
+ <i class="fas fa-users text-xl"></i>
912
+ </div>
913
+ </div>
914
+ </div>
915
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
916
+ <div class="flex items-center justify-between">
917
+ <div>
918
+ <p class="text-gray-400 text-sm">Conversion Rate</p>
919
+ <p class="text-xl font-bold">43.3%</p>
920
+ </div>
921
+ <div class="p-3 rounded-full bg-opacity-20 bg-purple-500 text-purple-400">
922
+ <i class="fas fa-percentage text-xl"></i>
923
+ </div>
924
+ </div>
925
+ </div>
926
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
927
+ <div class="flex items-center justify-between">
928
+ <div>
929
+ <p class="text-gray-400 text-sm">Avg. Value</p>
930
+ <p class="text-xl font-bold">$48.75</p>
931
+ </div>
932
+ <div class="p-3 rounded-full bg-opacity-20 bg-yellow-500 text-accent">
933
+ <i class="fas fa-dollar-sign text-xl"></i>
934
+ </div>
935
+ </div>
936
+ </div>
937
+ </div>
938
+
939
+ <!-- Referral Program Details -->
940
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
941
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700 md:col-span-2">
942
+ <h3 class="font-semibold mb-4">Program Overview</h3>
943
+ <div class="space-y-4">
944
+ <div>
945
+ <h4 class="text-sm font-medium text-gray-300 mb-1">Referral Link</h4>
946
+ <div class="flex">
947
+ <input type="text" class="flex-1 bg-gray-700 border border-gray-600 rounded-l-md px-3 py-2 text-white focus:outline-none focus:ring-1 focus:ring-accent" value="https://teamflow.com/ref/johndoe" readonly>
948
+ <button class="bg-accent hover:bg-yellow-500 text-primary-dark font-bold px-3 rounded-r-md">
949
+ <i class="fas fa-copy"></i>
950
+ </button>
951
+ </div>
952
+ </div>
953
+ <div>
954
+ <h4 class="text-sm font-medium text-gray-300 mb-1">Reward Structure</h4>
955
+ <div class="bg-gray-700 rounded-md p-3">
956
+ <div class="flex justify-between items-center mb-2">
957
+ <span class="text-sm">Referrer Bonus</span>
958
+ <span class="font-medium text-accent">$25</span>
959
+ </div>
960
+ <div class="flex justify-between items-center">
961
+ <span class="text-sm">Referred User Bonus</span>
962
+ <span class="font-medium text-accent">$10</span>
963
+ </div>
964
+ </div>
965
+ </div>
966
+ <div>
967
+ <h4 class="text-sm font-medium text-gray-300 mb-1">Program Terms</h4>
968
+ <div class="bg-gray-700 rounded-md p-3 text-sm">
969
+ <p class="mb-2">• Referrals must make a minimum purchase of $50 to qualify</p>
970
+ <p class="mb-2">• Bonus is paid after 30 days of activity</p>
971
+ <p>• Maximum of 10 referrals per month</p>
972
+ </div>
973
+ </div>
974
+ </div>
975
+ </div>
976
+
977
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
978
+ <h3 class="font-semibold mb-4">Top Referrers</h3>
979
+ <div class="space-y-3">
980
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
981
+ <div class="flex items-center">
982
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/women/44.jpg" alt="">
983
+ <span class="text-sm">Sarah Johnson</span>
984
+ </div>
985
+ <span class="text-xs px-2 py-1 bg-yellow-500 bg-opacity-20 text-accent rounded">28</span>
986
+ </div>
987
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
988
+ <div class="flex items-center">
989
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/men/32.jpg" alt="">
990
+ <span class="text-sm">Michael Chen</span>
991
+ </div>
992
+ <span class="text-xs px-2 py-1 bg-yellow-500 bg-opacity-20 text-accent rounded">19</span>
993
+ </div>
994
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
995
+ <div class="flex items-center">
996
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/women/68.jpg" alt="">
997
+ <span class="text-sm">Emily Rodriguez</span>
998
+ </div>
999
+ <span class="text-xs px-2 py-1 bg-yellow-500 bg-opacity-20 text-accent rounded">15</span>
1000
+ </div>
1001
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
1002
+ <div class="flex items-center">
1003
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/men/75.jpg" alt="">
1004
+ <span class="text-sm">David Wilson</span>
1005
+ </div>
1006
+ <span class="text-xs px-2 py-1 bg-yellow-500 bg-opacity-20 text-accent rounded">12</span>
1007
+ </div>
1008
+ <div class="flex items-center justify-between p-2 bg-gray-700 rounded">
1009
+ <div class="flex items-center">
1010
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/women/12.jpg" alt="">
1011
+ <span class="text-sm">Jessica Lee</span>
1012
+ </div>
1013
+ <span class="text-xs px-2 py-1 bg-yellow-500 bg-opacity-20 text-accent rounded">10</span>
1014
+ </div>
1015
+ </div>
1016
+ </div>
1017
+ </div>
1018
+
1019
+ <!-- Recent Referrals -->
1020
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
1021
+ <div class="flex justify-between items-center mb-4">
1022
+ <h3 class="text-lg font-semibold">Recent Referrals</h3>
1023
+ <button class="text-accent hover:text-yellow-500 text-sm">View All</button>
1024
+ </div>
1025
+ <div class="overflow-x-auto">
1026
+ <table class="min-w-full divide-y divide-gray-700">
1027
+ <thead class="bg-gray-800">
1028
+ <tr>
1029
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Referrer</th>
1030
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Referred User</th>
1031
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Date</th>
1032
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Status</th>
1033
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Value</th>
1034
+ </tr>
1035
+ </thead>
1036
+ <tbody class="bg-primary-light divide-y divide-gray-700">
1037
+ <tr>
1038
+ <td class="px-6 py-4 whitespace-nowrap">
1039
+ <div class="flex items-center">
1040
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/women/44.jpg" alt="">
1041
+ <span>Sarah Johnson</span>
1042
+ </div>
1043
+ </td>
1044
+ <td class="px-6 py-4 whitespace-nowrap">
1045
+ <div class="flex items-center">
1046
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/men/42.jpg" alt="">
1047
+ <span>Robert Taylor</span>
1048
+ </div>
1049
+ </td>
1050
+ <td class="px-6 py-4 whitespace-nowrap">
1051
+ <div class="text-sm">Today, 10:42 AM</div>
1052
+ </td>
1053
+ <td class="px-6 py-4 whitespace-nowrap">
1054
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-500 bg-opacity-20 text-green-400">Completed</span>
1055
+ </td>
1056
+ <td class="px-6 py-4 whitespace-nowrap">
1057
+ <div class="text-sm font-medium text-accent">$35</div>
1058
+ </td>
1059
+ </tr>
1060
+ <tr>
1061
+ <td class="px-6 py-4 whitespace-nowrap">
1062
+ <div class="flex items-center">
1063
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/men/32.jpg" alt="">
1064
+ <span>Michael Chen</span>
1065
+ </div>
1066
+ </td>
1067
+ <td class="px-6 py-4 whitespace-nowrap">
1068
+ <div class="flex items-center">
1069
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/women/24.jpg" alt="">
1070
+ <span>Amanda Smith</span>
1071
+ </div>
1072
+ </td>
1073
+ <td class="px-6 py-4 whitespace-nowrap">
1074
+ <div class="text-sm">Yesterday, 3:15 PM</div>
1075
+ </td>
1076
+ <td class="px-6 py-4 whitespace-nowrap">
1077
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-500 bg-opacity-20 text-yellow-400">Pending</span>
1078
+ </td>
1079
+ <td class="px-6 py-4 whitespace-nowrap">
1080
+ <div class="text-sm font-medium text-accent">$35</div>
1081
+ </td>
1082
+ </tr>
1083
+ <tr>
1084
+ <td class="px-6 py-4 whitespace-nowrap">
1085
+ <div class="flex items-center">
1086
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/women/68.jpg" alt="">
1087
+ <span>Emily Rodriguez</span>
1088
+ </div>
1089
+ </td>
1090
+ <td class="px-6 py-4 whitespace-nowrap">
1091
+ <div class="flex items-center">
1092
+ <img class="h-8 w-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/men/65.jpg" alt="">
1093
+ <span>James Wilson</span>
1094
+ </div>
1095
+ </td>
1096
+ <td class="px-6 py-4 whitespace-nowrap">
1097
+ <div class="text-sm">Yesterday, 11:20 AM</div>
1098
+ </td>
1099
+ <td class="px-6 py-4 whitespace-nowrap">
1100
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-500 bg-opacity-20 text-green-400">Completed</span>
1101
+ </td>
1102
+ <td class="px-6 py-4 whitespace-nowrap">
1103
+ <div class="text-sm font-medium text-accent">$35</div>
1104
+ </td>
1105
+ </tr>
1106
+ </tbody>
1107
+ </table>
1108
+ </div>
1109
+ </div>
1110
+ </div>
1111
+
1112
+ <!-- Payouts Tab Content -->
1113
+ <div id="payouts" class="tab-content hidden">
1114
+ <div class="flex justify-between items-center mb-6">
1115
+ <h2 class="text-2xl font-bold">Payout Management</h2>
1116
+ <button onclick="openPayoutModal()" class="bg-accent hover:bg-yellow-500 text-primary-dark font-bold py-2 px-4 rounded flex items-center">
1117
+ <i class="fas fa-plus mr-2"></i> New Payout
1118
+ </button>
1119
+ </div>
1120
+
1121
+ <!-- Payout Stats -->
1122
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
1123
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
1124
+ <div class="flex items-center justify-between">
1125
+ <div>
1126
+ <p class="text-gray-400 text-sm">Total Payouts</p>
1127
+ <p class="text-xl font-bold">$24,850</p>
1128
+ </div>
1129
+ <div class="p-3 rounded-full bg-opacity-20 bg-green-500 text-green-400">
1130
+ <i class="fas fa-money-bill-wave text-xl"></i>
1131
+ </div>
1132
+ </div>
1133
+ </div>
1134
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
1135
+ <div class="flex items-center justify-between">
1136
+ <div>
1137
+ <p class="text-gray-400 text-sm">Pending Payouts</p>
1138
+ <p class="text-xl font-bold">$3,250</p>
1139
+ </div>
1140
+ <div class="p-3 rounded-full bg-opacity-20 bg-yellow-500 text-accent">
1141
+ <i class="fas fa-clock text-xl"></i>
1142
+ </div>
1143
+ </div>
1144
+ </div>
1145
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700">
1146
+ <div class="flex items-center justify-between">
1147
+ <div>
1148
+ <p class="text-gray-400 text-sm">Next Payout Date</p>
1149
+ <p class="text-xl font-bold">Jul 15, 2023</p>
1150
+ </div>
1151
+ <div class="p-3 rounded-full bg-opacity-20 bg-blue-500 text-blue-400">
1152
+ <i class="fas fa-calendar-alt text-xl"></i>
1153
+ </div>
1154
+ </div>
1155
+ </div>
1156
+ </div>
1157
+
1158
+ <!-- Payout Methods -->
1159
+ <div class="bg-primary-light rounded-lg p-4 border border-gray-700 mb-6">
1160
+ <h3 class="font-semibold mb-4">Payout Methods</h3>
1161
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
1162
+ <div class="bg-gray-700 rounded-lg p-4 border border-gray-600">
1163
+ <div class="flex items-center mb-3">
1164
+ <i class="fab fa-paypal text-2xl text-blue-400 mr-2"></i>
1165
+ <span class="font-medium">PayPal</span>
1166
+ </div>
1167
+ <p class="text-sm text-gray-400 mb-3">Connected to [email protected]</p>
1168
+ <button class="text-sm text-accent hover:text-yellow-500">Edit</button>
1169
+ </div>
1170
+ <div class="bg-gray-700 rounded-lg p-4 border border-gray-600">
1171
+ <div class="flex items-center mb-3">
1172
+ <i class="fas fa-university text-2xl text-green-400 mr-2"></i>
1173
+ <span class="font-medium">Bank Transfer</span>
1174
+ </div>
1175
+ <p class="text-sm text-gray-400 mb-3">**** **** **** 1234</p>
1176
+ <button class="text-sm text-accent hover:text-yellow-500">Edit</button>
1177
+ </div>
1178
+ <div class="bg-gray-700 rounded-lg p-4 border border-gray-600 flex items-center justify-center">
1179
+ <button class="text-accent hover:text-yellow-500 flex items-center">
1180
+ <i class="fas fa-plus mr-1"></i> Add Method
1181
+ </button>
1182
+ </div>
1183
+ </div>
1184
+ </div>
1185
+
1186
+ <!-- Payout History -->
1187
+ <div class="bg-primary-light rounded-lg border border-gray-700 overflow-hidden">
1188
+ <div class="flex justify-between items-center px-6 py-4 border-b border-gray-700">
1189
+ <h3 class="text-lg font-semibold">Payout History</h3>
1190
+ <div class="flex space-x-2">
1191
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-300 hover:bg-gray-600 text-sm">Export</button>
1192
+ <button class="px-3 py-1 rounded-md bg-gray-700 text-gray-
1193
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Create a CMs for organizing teams, tasks, affiliates, referrals, pay outs, challenges, rewards, points, newsletters, sign up, Ai assistance, Ai support chats, Marketplace, profile, and please make this as a dashboard style website, with all tabs working. Dark background, yellow accents, white text , on-boarding, customize , store, save, upload, download, document, terms, & admin and user panels