Hugging Face's logo

Spaces:
adowu
/
tttt
Running

App Files Community
adowu commited on
Commit
a4ff1e6
·
verified ·
1 Parent(s): 05a0373

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +359 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Tttt
3
- emoji: 📊
4
- colorFrom: yellow
5
- colorTo: indigo
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: tttt
3
+ emoji: 🐳
4
+ colorFrom: pink
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,359 @@
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>AutomaForge - Agent 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
+ <style>
10
+ .agent-card:hover {
11
+ transform: translateY(-5px);
12
+ box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
13
+ }
14
+ .sidebar {
15
+ transition: all 0.3s ease;
16
+ }
17
+ .sidebar.collapsed {
18
+ width: 70px;
19
+ }
20
+ .sidebar.collapsed .sidebar-text {
21
+ display: none;
22
+ }
23
+ .main-content {
24
+ transition: all 0.3s ease;
25
+ }
26
+ .main-content.expanded {
27
+ margin-left: 70px;
28
+ }
29
+ </style>
30
+ </head>
31
+ <body class="bg-gray-50">
32
+ <div class="flex h-screen overflow-hidden">
33
+ <!-- Sidebar -->
34
+ <div class="sidebar bg-indigo-800 text-white w-64 flex flex-col">
35
+ <div class="p-4 flex items-center justify-between border-b border-indigo-700">
36
+ <div class="flex items-center space-x-2">
37
+ <i class="fas fa-robot text-2xl"></i>
38
+ <span class="sidebar-text text-xl font-bold">AutomaForge</span>
39
+ </div>
40
+ <button id="toggleSidebar" class="text-white focus:outline-none">
41
+ <i class="fas fa-bars"></i>
42
+ </button>
43
+ </div>
44
+
45
+ <div class="flex-1 overflow-y-auto">
46
+ <div class="p-4">
47
+ <div class="mb-6">
48
+ <h3 class="sidebar-text text-xs uppercase tracking-wider text-indigo-400 mb-2">Navigation</h3>
49
+ <ul>
50
+ <li class="mb-1">
51
+ <a href="#" class="flex items-center px-3 py-2 rounded bg-indigo-700 text-white">
52
+ <i class="fas fa-home mr-3"></i>
53
+ <span class="sidebar-text">Dashboard</span>
54
+ </a>
55
+ </li>
56
+ <li class="mb-1">
57
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
58
+ <i class="fas fa-plus-circle mr-3"></i>
59
+ <span class="sidebar-text">New Agent</span>
60
+ </a>
61
+ </li>
62
+ <li class="mb-1">
63
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
64
+ <i class="fas fa-history mr-3"></i>
65
+ <span class="sidebar-text">Recent Agents</span>
66
+ </a>
67
+ </li>
68
+ </ul>
69
+ </div>
70
+
71
+ <div class="mb-6">
72
+ <h3 class="sidebar-text text-xs uppercase tracking-wider text-indigo-400 mb-2">Agent Types</h3>
73
+ <ul>
74
+ <li class="mb-1">
75
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
76
+ <i class="fas fa-headset mr-3"></i>
77
+ <span class="sidebar-text">Customer Support Bot</span>
78
+ </a>
79
+ </li>
80
+ <li class="mb-1">
81
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
82
+ <i class="fas fa-chart-bar mr-3"></i>
83
+ <span class="sidebar-text">Data Analyzer</span>
84
+ </a>
85
+ </li>
86
+ <li class="mb-1">
87
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
88
+ <i class="fas fa-image mr-3"></i>
89
+ <span class="sidebar-text">Image Processor</span>
90
+ </a>
91
+ </li>
92
+ <li class="mb-1">
93
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
94
+ <i class="fas fa-file-alt mr-3"></i>
95
+ <span class="sidebar-text">Document Summarizer</span>
96
+ </a>
97
+ </li>
98
+ </ul>
99
+ </div>
100
+
101
+ <div>
102
+ <h3 class="sidebar-text text-xs uppercase tracking-wider text-indigo-400 mb-2">Templates</h3>
103
+ <ul>
104
+ <li class="mb-1">
105
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
106
+ <i class="fas fa-comments mr-3"></i>
107
+ <span class="sidebar-text">Chatbot</span>
108
+ </a>
109
+ </li>
110
+ <li class="mb-1">
111
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
112
+ <i class="fas fa-chart-pie mr-3"></i>
113
+ <span class="sidebar-text">Data Analysis</span>
114
+ </a>
115
+ </li>
116
+ <li class="mb-1">
117
+ <a href="#" class="flex items-center px-3 py-2 rounded hover:bg-indigo-700 text-white">
118
+ <i class="fas fa-camera mr-3"></i>
119
+ <span class="sidebar-text">Image Processing</span>
120
+ </a>
121
+ </li>
122
+ </ul>
123
+ </div>
124
+ </div>
125
+ </div>
126
+
127
+ <div class="p-4 border-t border-indigo-700">
128
+ <div class="flex items-center">
129
+ <div class="w-8 h-8 rounded-full bg-indigo-600 flex items-center justify-center">
130
+ <i class="fas fa-user text-sm"></i>
131
+ </div>
132
+ <div class="ml-3 sidebar-text">
133
+ <p class="text-sm font-medium">Admin User</p>
134
+ <p class="text-xs text-indigo-300">[email protected]</p>
135
+ </div>
136
+ </div>
137
+ </div>
138
+ </div>
139
+
140
+ <!-- Main Content -->
141
+ <div class="main-content flex-1 overflow-auto">
142
+ <div class="p-6">
143
+ <div class="flex justify-between items-center mb-6">
144
+ <h1 class="text-2xl font-bold text-gray-800">Agent Dashboard</h1>
145
+ <button class="bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-lg flex items-center">
146
+ <i class="fas fa-plus mr-2"></i>
147
+ <span>Create New Agent</span>
148
+ </button>
149
+ </div>
150
+
151
+ <!-- Status Cards -->
152
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
153
+ <div class="bg-white rounded-lg shadow p-6">
154
+ <div class="flex items-center justify-between">
155
+ <div>
156
+ <p class="text-gray-500">Total Agents</p>
157
+ <h3 class="text-2xl font-bold">24</h3>
158
+ </div>
159
+ <div class="bg-indigo-100 p-3 rounded-full">
160
+ <i class="fas fa-robot text-indigo-600 text-xl"></i>
161
+ </div>
162
+ </div>
163
+ </div>
164
+
165
+ <div class="bg-white rounded-lg shadow p-6">
166
+ <div class="flex items-center justify-between">
167
+ <div>
168
+ <p class="text-gray-500">Active Agents</p>
169
+ <h3 class="text-2xl font-bold">18</h3>
170
+ </div>
171
+ <div class="bg-green-100 p-3 rounded-full">
172
+ <i class="fas fa-check-circle text-green-600 text-xl"></i>
173
+ </div>
174
+ </div>
175
+ </div>
176
+
177
+ <div class="bg-white rounded-lg shadow p-6">
178
+ <div class="flex items-center justify-between">
179
+ <div>
180
+ <p class="text-gray-500">Inactive Agents</p>
181
+ <h3 class="text-2xl font-bold">4</h3>
182
+ </div>
183
+ <div class="bg-yellow-100 p-3 rounded-full">
184
+ <i class="fas fa-exclamation-circle text-yellow-600 text-xl"></i>
185
+ </div>
186
+ </div>
187
+ </div>
188
+
189
+ <div class="bg-white rounded-lg shadow p-6">
190
+ <div class="flex items-center justify-between">
191
+ <div>
192
+ <p class="text-gray-500">Errors Today</p>
193
+ <h3 class="text-2xl font-bold">2</h3>
194
+ </div>
195
+ <div class="bg-red-100 p-3 rounded-full">
196
+ <i class="fas fa-times-circle text-red-600 text-xl"></i>
197
+ </div>
198
+ </div>
199
+ </div>
200
+ </div>
201
+
202
+ <!-- Recent Agents Section -->
203
+ <div class="bg-white rounded-lg shadow p-6 mb-8">
204
+ <div class="flex justify-between items-center mb-6">
205
+ <h2 class="text-xl font-semibold text-gray-800">Recent Agents</h2>
206
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 text-sm font-medium">View All</a>
207
+ </div>
208
+
209
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
210
+ <!-- Agent Card 1 -->
211
+ <div class="agent-card bg-white border border-gray-200 rounded-lg p-6 transition-all duration-300">
212
+ <div class="flex items-center mb-4">
213
+ <div class="bg-indigo-100 p-3 rounded-full mr-4">
214
+ <i class="fas fa-headset text-indigo-600 text-xl"></i>
215
+ </div>
216
+ <div>
217
+ <h3 class="font-semibold">Customer Support Bot</h3>
218
+ <p class="text-gray-500 text-sm">Last active: 5 min ago</p>
219
+ </div>
220
+ </div>
221
+ <p class="text-gray-600 mb-4">Handles customer inquiries and provides automated support responses.</p>
222
+ <div class="flex justify-between items-center">
223
+ <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">Active</span>
224
+ <button class="text-indigo-600 hover:text-indigo-800">
225
+ <i class="fas fa-ellipsis-v"></i>
226
+ </button>
227
+ </div>
228
+ </div>
229
+
230
+ <!-- Agent Card 2 -->
231
+ <div class="agent-card bg-white border border-gray-200 rounded-lg p-6 transition-all duration-300">
232
+ <div class="flex items-center mb-4">
233
+ <div class="bg-blue-100 p-3 rounded-full mr-4">
234
+ <i class="fas fa-chart-bar text-blue-600 text-xl"></i>
235
+ </div>
236
+ <div>
237
+ <h3 class="font-semibold">Data Analyzer</h3>
238
+ <p class="text-gray-500 text-sm">Last active: 2 hours ago</p>
239
+ </div>
240
+ </div>
241
+ <p class="text-gray-600 mb-4">Processes large datasets and generates analytical reports.</p>
242
+ <div class="flex justify-between items-center">
243
+ <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">Active</span>
244
+ <button class="text-indigo-600 hover:text-indigo-800">
245
+ <i class="fas fa-ellipsis-v"></i>
246
+ </button>
247
+ </div>
248
+ </div>
249
+
250
+ <!-- Agent Card 3 -->
251
+ <div class="agent-card bg-white border border-gray-200 rounded-lg p-6 transition-all duration-300">
252
+ <div class="flex items-center mb-4">
253
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
254
+ <i class="fas fa-image text-purple-600 text-xl"></i>
255
+ </div>
256
+ <div>
257
+ <h3 class="font-semibold">Image Processor</h3>
258
+ <p class="text-gray-500 text-sm">Last active: 1 day ago</p>
259
+ </div>
260
+ </div>
261
+ <p class="text-gray-600 mb-4">Processes and analyzes images using computer vision.</p>
262
+ <div class="flex justify-between items-center">
263
+ <span class="bg-yellow-100 text-yellow-800 text-xs px-2 py-1 rounded-full">Inactive</span>
264
+ <button class="text-indigo-600 hover:text-indigo-800">
265
+ <i class="fas fa-ellipsis-v"></i>
266
+ </button>
267
+ </div>
268
+ </div>
269
+ </div>
270
+ </div>
271
+
272
+ <!-- Agent Types Section -->
273
+ <div class="bg-white rounded-lg shadow p-6">
274
+ <h2 class="text-xl font-semibold text-gray-800 mb-6">Create New Agent</h2>
275
+
276
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
277
+ <!-- Agent Type 1 -->
278
+ <div class="agent-card border border-gray-200 rounded-lg p-6 hover:border-indigo-300 transition-all duration-300 cursor-pointer">
279
+ <div class="flex items-center mb-4">
280
+ <div class="bg-indigo-100 p-3 rounded-full mr-4">
281
+ <i class="fas fa-headset text-indigo-600 text-xl"></i>
282
+ </div>
283
+ <h3 class="font-semibold">Customer Support Bot</h3>
284
+ </div>
285
+ <p class="text-gray-600 mb-4">Create an agent that can handle customer inquiries, provide automated responses, and escalate to human agents when needed.</p>
286
+ <button class="w-full bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-lg">
287
+ Create Agent
288
+ </button>
289
+ </div>
290
+
291
+ <!-- Agent Type 2 -->
292
+ <div class="agent-card border border-gray-200 rounded-lg p-6 hover:border-indigo-300 transition-all duration-300 cursor-pointer">
293
+ <div class="flex items-center mb-4">
294
+ <div class="bg-blue-100 p-3 rounded-full mr-4">
295
+ <i class="fas fa-chart-bar text-blue-600 text-xl"></i>
296
+ </div>
297
+ <h3 class="font-semibold">Data Analyzer</h3>
298
+ </div>
299
+ <p class="text-gray-600 mb-4">Create an agent that can process large datasets, generate reports, and provide data-driven insights.</p>
300
+ <button class="w-full bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-lg">
301
+ Create Agent
302
+ </button>
303
+ </div>
304
+
305
+ <!-- Agent Type 3 -->
306
+ <div class="agent-card border border-gray-200 rounded-lg p-6 hover:border-indigo-300 transition-all duration-300 cursor-pointer">
307
+ <div class="flex items-center mb-4">
308
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
309
+ <i class="fas fa-image text-purple-600 text-xl"></i>
310
+ </div>
311
+ <h3 class="font-semibold">Image Processor</h3>
312
+ </div>
313
+ <p class="text-gray-600 mb-4">Create an agent that can analyze images, recognize objects, and process visual data using computer vision.</p>
314
+ <button class="w-full bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-lg">
315
+ Create Agent
316
+ </button>
317
+ </div>
318
+ </div>
319
+ </div>
320
+ </div>
321
+ </div>
322
+ </div>
323
+
324
+ <script>
325
+ // Toggle sidebar
326
+ document.getElementById('toggleSidebar').addEventListener('click', function() {
327
+ const sidebar = document.querySelector('.sidebar');
328
+ const mainContent = document.querySelector('.main-content');
329
+
330
+ sidebar.classList.toggle('collapsed');
331
+ mainContent.classList.toggle('expanded');
332
+ });
333
+
334
+ // Agent card hover effect
335
+ const agentCards = document.querySelectorAll('.agent-card');
336
+ agentCards.forEach(card => {
337
+ card.addEventListener('mouseenter', function() {
338
+ this.style.boxShadow = '0 10px 25px -5px rgba(0, 0, 0, 0.1)';
339
+ this.style.transform = 'translateY(-5px)';
340
+ });
341
+
342
+ card.addEventListener('mouseleave', function() {
343
+ this.style.boxShadow = '';
344
+ this.style.transform = '';
345
+ });
346
+ });
347
+
348
+ // Simulate agent creation
349
+ const createButtons = document.querySelectorAll('.agent-card button');
350
+ createButtons.forEach(button => {
351
+ button.addEventListener('click', function(e) {
352
+ e.stopPropagation();
353
+ const agentType = this.closest('.agent-card').querySelector('h3').textContent;
354
+ alert(`Creating new ${agentType}...`);
355
+ });
356
+ });
357
+ </script>
358
+ <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=adowu/tttt" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body>
359
+ </html>