Hugging Face's logo

Spaces:
techguy1
/
eclipsecat
Running

App Files Community
techguy1 commited on
Commit
87ad947
·
verified ·
1 Parent(s): a8ee934

- Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +457 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Eclipsecat
3
- emoji: 😻
4
- colorFrom: indigo
5
- colorTo: pink
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: eclipsecat
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: yellow
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,457 @@
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>Advantage Software | A Partner You Can Count On</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
+ .dropdown:hover .dropdown-menu {
11
+ display: block;
12
+ }
13
+ .dropdown-submenu:hover .dropdown-submenu-content {
14
+ display: block;
15
+ }
16
+ .hero-slide {
17
+ transition: opacity 0.5s ease-in-out;
18
+ }
19
+ .hero-slide.active {
20
+ opacity: 1;
21
+ z-index: 10;
22
+ }
23
+ .hero-slide.inactive {
24
+ opacity: 0;
25
+ z-index: 0;
26
+ }
27
+ </style>
28
+ </head>
29
+ <body class="font-sans bg-gray-50">
30
+ <!-- Top Bar -->
31
+ <div class="bg-blue-900 text-white text-sm">
32
+ <div class="container mx-auto px-4 py-2 flex justify-between items-center">
33
+ <div class="flex space-x-4">
34
+ <a href="#" class="hover:text-blue-200">Skip to main content</a>
35
+ </div>
36
+ <div class="flex items-center space-x-4">
37
+ <a href="#" class="hover:text-blue-200">Log in</a>
38
+ <a href="#" class="hover:text-blue-200">Create new account</a>
39
+ <a href="#" class="hover:text-blue-200">Request new password</a>
40
+ <div class="flex space-x-2">
41
+ <a href="#"><img src="https://www.facebook.com/images/fbconnect/login-buttons/connect_light_medium_short.gif" alt="Facebook Login" class="h-6"></a>
42
+ <a href="#"><i class="fab fa-facebook text-blue-300 hover:text-white"></i></a>
43
+ <a href="#"><i class="fab fa-twitter text-blue-300 hover:text-white"></i></a>
44
+ <a href="#"><i class="fab fa-youtube text-blue-300 hover:text-white"></i></a>
45
+ </div>
46
+ </div>
47
+ </div>
48
+ </div>
49
+
50
+ <!-- Search Bar -->
51
+ <div class="bg-blue-800 py-2">
52
+ <div class="container mx-auto px-4 flex items-center justify-between">
53
+ <div class="flex items-center">
54
+ <a href="#" class="mr-8">
55
+ <img src="https://eclipsecat.com/sites/default/files/logo-advantage-software-1.png" alt="Advantage Software" class="h-12">
56
+ </a>
57
+ <div class="relative w-64">
58
+ <input type="text" placeholder="Site Search" class="w-full px-4 py-2 rounded text-sm">
59
+ <button class="absolute right-2 top-2 text-gray-500">
60
+ <i class="fas fa-search"></i>
61
+ </button>
62
+ </div>
63
+ </div>
64
+ <div class="flex items-center">
65
+ <img src="https://www.gstatic.com/images/branding/googlelogo/1x/googlelogo_color_42x16dp.png" alt="Google Translate" class="h-4 mr-1">
66
+ <span class="text-white text-sm">Translate</span>
67
+ </div>
68
+ </div>
69
+ </div>
70
+
71
+ <!-- Main Navigation -->
72
+ <nav class="bg-white shadow-md sticky top-0 z-50">
73
+ <div class="container mx-auto px-4">
74
+ <div class="flex justify-between">
75
+ <div class="flex space-x-1">
76
+ <!-- Main Nav Items -->
77
+ <div class="dropdown relative group">
78
+ <button class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium flex items-center">
79
+ Software <i class="fas fa-chevron-down ml-1 text-xs"></i>
80
+ </button>
81
+ <div class="dropdown-menu absolute left-0 mt-0 w-56 bg-white shadow-lg rounded-md hidden z-50">
82
+ <!-- Submenu items -->
83
+ <div class="dropdown-submenu relative">
84
+ <a href="#" class="px-4 py-2 hover:bg-blue-50 flex justify-between items-center">
85
+ AccuCap <i class="fas fa-chevron-right ml-2 text-xs"></i>
86
+ </a>
87
+ <div class="dropdown-submenu-content absolute left-full top-0 w-56 bg-white shadow-lg rounded-md hidden">
88
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">Steno</a>
89
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">Voice</a>
90
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">Student</a>
91
+ </div>
92
+ </div>
93
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">Bridge Mobile</a>
94
+ <!-- More items would go here -->
95
+ </div>
96
+ </div>
97
+
98
+ <div class="dropdown relative group">
99
+ <button class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium flex items-center">
100
+ Laptops <i class="fas fa-chevron-down ml-1 text-xs"></i>
101
+ </button>
102
+ <div class="dropdown-menu absolute left-0 mt-0 w-56 bg-white shadow-lg rounded-md hidden z-50">
103
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">All Laptops</a>
104
+ <div class="dropdown-submenu relative">
105
+ <a href="#" class="px-4 py-2 hover:bg-blue-50 flex justify-between items-center">
106
+ Non-Touch <i class="fas fa-chevron-right ml-2 text-xs"></i>
107
+ </a>
108
+ <div class="dropdown-submenu-content absolute left-full top-0 w-56 bg-white shadow-lg rounded-md hidden">
109
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">ThinkPad P16s</a>
110
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">ThinkPad P16s | 4K OLED</a>
111
+ <a href="#" class="block px-4 py-2 hover:bg-blue-50">ThinkPad X1 Carbon | 2.8K OLED</a>
112
+ </div>
113
+ </div>
114
+ <!-- More items would go here -->
115
+ </div>
116
+ </div>
117
+
118
+ <!-- More main nav items would go here -->
119
+ <a href="#" class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium">Specials</a>
120
+ <a href="#" class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium">Catalog</a>
121
+ <a href="#" class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium">Webinars & Training</a>
122
+ <a href="#" class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium">Support</a>
123
+ <a href="#" class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium">Contact Us</a>
124
+ <a href="#" class="px-4 py-3 text-gray-700 hover:bg-blue-50 hover:text-blue-800 font-medium">About Us</a>
125
+ </div>
126
+ </div>
127
+ </div>
128
+ </nav>
129
+
130
+ <!-- Hero Slider -->
131
+ <div class="relative h-96 overflow-hidden">
132
+ <div class="hero-slide active absolute inset-0 bg-cover bg-center" style="background-image: url('https://eclipsecat.com/sites/default/files/styles/banner_full/public/slideimages/Leading%20CAT%20Software%20Just%20Got%20Even%20Better%20V11.jpg?itok=8a5gQCdq')">
133
+ <div class="absolute inset-0 bg-black bg-opacity-30 flex items-center">
134
+ <div class="container mx-auto px-4 text-white">
135
+ <h1 class="text-4xl font-bold mb-4">Eclipse 11</h1>
136
+ <p class="text-xl mb-6">Leading CAT Software Just Got Even Better</p>
137
+ <a href="#" class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded font-medium">Learn More</a>
138
+ </div>
139
+ </div>
140
+ </div>
141
+ <div class="hero-slide inactive absolute inset-0 bg-cover bg-center" style="background-image: url('https://eclipsecat.com/sites/default/files/styles/banner_full/public/slideimages/Laptop%20Banner%202022.jpg?itok=UKTWlISN')">
142
+ <div class="absolute inset-0 bg-black bg-opacity-30 flex items-center">
143
+ <div class="container mx-auto px-4 text-white">
144
+ <h1 class="text-4xl font-bold mb-4">Business-Class Laptops</h1>
145
+ <p class="text-xl mb-6">Custom configured for your needs</p>
146
+ <a href="#" class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded font-medium">Shop Now</a>
147
+ </div>
148
+ </div>
149
+ </div>
150
+ <div class="absolute bottom-4 left-0 right-0 flex justify-center space-x-2 z-20">
151
+ <button class="slide-dot w-3 h-3 rounded-full bg-white bg-opacity-50 hover:bg-opacity-100 focus:outline-none" data-slide="0"></button>
152
+ <button class="slide-dot w-3 h-3 rounded-full bg-white bg-opacity-50 hover:bg-opacity-100 focus:outline-none" data-slide="1"></button>
153
+ </div>
154
+ <button class="slide-prev absolute left-4 top-1/2 transform -translate-y-1/2 bg-white bg-opacity-50 hover:bg-opacity-75 text-blue-800 p-2 rounded-full z-20">
155
+ <i class="fas fa-chevron-left"></i>
156
+ </button>
157
+ <button class="slide-next absolute right-4 top-1/2 transform -translate-y-1/2 bg-white bg-opacity-50 hover:bg-opacity-75 text-blue-800 p-2 rounded-full z-20">
158
+ <i class="fas fa-chevron-right"></i>
159
+ </button>
160
+ </div>
161
+
162
+ <!-- Quick Links -->
163
+ <div class="bg-white py-8">
164
+ <div class="container mx-auto px-4">
165
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
166
+ <div class="bg-blue-50 rounded-lg p-6 text-center hover:shadow-md transition-shadow">
167
+ <div class="flex justify-center mb-4">
168
+ <img src="https://eclipsecat.com/sites/default/files/resize/users/12628/EclIco-75x74.png" alt="Eclipse" class="h-16">
169
+ </div>
170
+ <h3 class="text-xl font-semibold text-blue-800 mb-2">Eclipse</h3>
171
+ <p class="text-gray-600 mb-4">Leading Edge CAT Software</p>
172
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium">Learn More</a>
173
+ </div>
174
+ <div class="bg-blue-50 rounded-lg p-6 text-center hover:shadow-md transition-shadow">
175
+ <div class="flex justify-center mb-4">
176
+ <img src="https://eclipsecat.com/sites/default/files/resize/AccuCap%20Diamond-75x75.png" alt="AccuCap" class="h-16">
177
+ </div>
178
+ <h3 class="text-xl font-semibold text-blue-800 mb-2">AccuCap</h3>
179
+ <p class="text-gray-600 mb-4">World Class Captioning Software</p>
180
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium">Learn More</a>
181
+ </div>
182
+ <div class="bg-blue-50 rounded-lg p-6 text-center hover:shadow-md transition-shadow">
183
+ <div class="flex justify-center mb-4">
184
+ <img src="https://eclipsecat.com/sites/default/files/resize/Bridge%20Diamond-75x76.png" alt="Bridge Mobile" class="h-16">
185
+ </div>
186
+ <h3 class="text-xl font-semibold text-blue-800 mb-2">Bridge Mobile</h3>
187
+ <p class="text-gray-600 mb-4">Realtime Without Limits</p>
188
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium">Learn More</a>
189
+ </div>
190
+ <div class="bg-blue-50 rounded-lg p-6 text-center hover:shadow-md transition-shadow">
191
+ <div class="flex justify-center mb-4">
192
+ <img src="https://eclipsecat.com/sites/default/files/resize/users/12628/v10%20boost%20rocket%20SQUARE%20Transparent-75x75.png" alt="Boost" class="h-16">
193
+ </div>
194
+ <h3 class="text-xl font-semibold text-blue-800 mb-2">Boost</h3>
195
+ <p class="text-gray-600 mb-4">Features & Pricing</p>
196
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium">Learn More</a>
197
+ </div>
198
+ </div>
199
+ </div>
200
+ </div>
201
+
202
+ <!-- Events Section -->
203
+ <div class="bg-gray-100 py-8">
204
+ <div class="container mx-auto px-4">
205
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
206
+ <div class="bg-white rounded-lg shadow-sm p-6 flex items-center hover:shadow-md transition-shadow">
207
+ <div class="mr-4">
208
+ <img src="https://eclipsecat.com/sites/default/files/resize/ThinkBook%20G7%20%2810%29-100x93.jpg" alt="Laptop" class="w-20">
209
+ </div>
210
+ <div>
211
+ <h3 class="text-lg font-semibold text-blue-800 mb-1">CUSTOM CONFIGURED LAPTOPS</h3>
212
+ <a href="#" class="text-blue-600 hover:text-blue-800 text-sm font-medium">Shop Now</a>
213
+ </div>
214
+ </div>
215
+ <div class="bg-white rounded-lg shadow-sm p-6 flex items-center hover:shadow-md transition-shadow">
216
+ <div class="mr-4">
217
+ <img src="https://eclipsecat.com/sites/default/files/resize/users/12628/Email%20List-100x100.png" alt="Email" class="w-20">
218
+ </div>
219
+ <div>
220
+ <h3 class="text-lg font-semibold text-blue-800 mb-1">JOIN OUR MAILING LIST!</h3>
221
+ <a href="#" class="text-blue-600 hover:text-blue-800 text-sm font-medium">Sign Up</a>
222
+ </div>
223
+ </div>
224
+ <div class="bg-white rounded-lg shadow-sm p-6 flex items-center hover:shadow-md transition-shadow">
225
+ <div class="mr-4">
226
+ <img src="https://eclipsecat.com/sites/default/files/resize/users/57105/A%20to%20Z%20logo_2019_no%20tagline_transparent-100x68.png" alt="NCRA A to Z" class="w-20">
227
+ </div>
228
+ <div>
229
+ <h3 class="text-lg font-semibold text-blue-800 mb-1">NCRA A to Z® Graduate?</h3>
230
+ <a href="#" class="text-blue-600 hover:text-blue-800 text-sm font-medium">Special Offer</a>
231
+ </div>
232
+ </div>
233
+ </div>
234
+ </div>
235
+ </div>
236
+
237
+ <!-- Features Section -->
238
+ <div class="bg-blue-800 text-white py-12">
239
+ <div class="container mx-auto px-4">
240
+ <h2 class="text-3xl font-bold text-center mb-12">Exclusive Technology</h2>
241
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
242
+ <div class="text-center">
243
+ <div class="flex justify-center mb-4">
244
+ <img src="https://eclipsecat.com/sites/default/files/users/12628/Practical_Magic.jpg" alt="Magic" class="h-16 rounded-full">
245
+ </div>
246
+ <h3 class="text-xl font-semibold mb-2">Believe in Magic</h3>
247
+ <p class="text-blue-200">Cutting-edge features that transform your workflow</p>
248
+ </div>
249
+ <div class="text-center">
250
+ <h3 class="text-xl font-semibold mb-2">New in Eclipse 11</h3>
251
+ <p class="text-blue-200">Discover the latest innovations</p>
252
+ <a href="#" class="text-blue-300 hover:text-white mt-2 inline-block">Learn More</a>
253
+ </div>
254
+ <div class="text-center">
255
+ <h3 class="text-xl font-semibold mb-2">Connection Magic</h3>
256
+ <p class="text-blue-200">Seamless integration with your devices</p>
257
+ <a href="#" class="text-blue-300 hover:text-white mt-2 inline-block">Learn More</a>
258
+ </div>
259
+ <div class="text-center">
260
+ <h3 class="text-xl font-semibold mb-2">Translation Magic</h3>
261
+ <p class="text-blue-200">Break language barriers with ease</p>
262
+ <a href="#" class="text-blue-300 hover:text-white mt-2 inline-block">Learn More</a>
263
+ </div>
264
+ </div>
265
+ </div>
266
+ </div>
267
+
268
+ <!-- Calendar Section -->
269
+ <div class="bg-white py-12">
270
+ <div class="container mx-auto px-4">
271
+ <div class="flex flex-col md:flex-row items-center justify-between bg-blue-50 rounded-lg p-6">
272
+ <div class="flex items-center mb-4 md:mb-0">
273
+ <img src="https://eclipsecat.com/sites/default/files/resize/users/12628/ASI%20Calendar-85x53.png" alt="Calendar" class="h-12 mr-4">
274
+ <h3 class="text-xl font-semibold text-blue-800">Calendar of Events</h3>
275
+ </div>
276
+ <a href="#" class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded font-medium">View Calendar</a>
277
+ </div>
278
+ </div>
279
+ </div>
280
+
281
+ <!-- Footer -->
282
+ <footer class="bg-gray-900 text-white pt-12 pb-6">
283
+ <div class="container mx-auto px-4">
284
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
285
+ <div>
286
+ <h3 class="text-lg font-semibold mb-4">Products</h3>
287
+ <ul class="space-y-2">
288
+ <li><a href="#" class="text-gray-400 hover:text-white">Software</a></li>
289
+ <li><a href="#" class="text-gray-400 hover:text-white">Laptops</a></li>
290
+ <li><a href="#" class="text-gray-400 hover:text-white">Accessories</a></li>
291
+ <li><a href="#" class="text-gray-400 hover:text-white">Training Materials</a></li>
292
+ </ul>
293
+ </div>
294
+ <div>
295
+ <h3 class="text-lg font-semibold mb-4">Support</h3>
296
+ <ul class="space-y-2">
297
+ <li><a href="#" class="text-gray-400 hover:text-white">Downloads</a></li>
298
+ <li><a href="#" class="text-gray-400 hover:text-white">Tech Support</a></li>
299
+ <li><a href="#" class="text-gray-400 hover:text-white">Support Plans</a></li>
300
+ <li><a href="#" class="text-gray-400 hover:text-white">Writer Care</a></li>
301
+ </ul>
302
+ </div>
303
+ <div>
304
+ <h3 class="text-lg font-semibold mb-4">Company</h3>
305
+ <ul class="space-y-2">
306
+ <li><a href="#" class="text-gray-400 hover:text-white">About Us</a></li>
307
+ <li><a href="#" class="text-gray-400 hover:text-white">Contact</a></li>
308
+ <li><a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a></li>
309
+ <li><a href="#" class="text-gray-400 hover:text-white">Return Policy</a></li>
310
+ </ul>
311
+ </div>
312
+ <div>
313
+ <h3 class="text-lg font-semibold mb-4">Stay Connected</h3>
314
+ <div class="flex space-x-4 mb-4">
315
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-facebook-f text-xl"></i></a>
316
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-twitter text-xl"></i></a>
317
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-youtube text-xl"></i></a>
318
+ </div>
319
+ <p class="text-gray-400 mb-2">Subscribe to our newsletter</p>
320
+ <a href="#" class="text-blue-400 hover:text-blue-300 font-medium">Sign Up Now</a>
321
+ </div>
322
+ </div>
323
+ <div class="border-t border-gray-800 pt-6 flex flex-col md:flex-row justify-between items-center">
324
+ <div class="mb-4 md:mb-0">
325
+ <p class="text-gray-400 text-sm">All Content ©2006 - 2025 Advantage Software, Inc. All Rights Reserved.</p>
326
+ </div>
327
+ <div class="flex space-x-4">
328
+ <a href="#" class="text-gray-400 hover:text-white text-sm">Privacy Policy</a>
329
+ <a href="#" class="text-gray-400 hover:text-white text-sm">Return Policy</a>
330
+ <a href="#" class="text-gray-400 hover:text-white text-sm">User Agreement</a>
331
+ <a href="#" class="text-gray-400 hover:text-white text-sm">Remote Support</a>
332
+ </div>
333
+ </div>
334
+ </div>
335
+ </footer>
336
+
337
+ <script>
338
+ // Hero Slider Functionality
339
+ const slides = document.querySelectorAll('.hero-slide');
340
+ const dots = document.querySelectorAll('.slide-dot');
341
+ const prevBtn = document.querySelector('.slide-prev');
342
+ const nextBtn = document.querySelector('.slide-next');
343
+ let currentSlide = 0;
344
+ const slideCount = slides.length;
345
+
346
+ function showSlide(index) {
347
+ slides.forEach((slide, i) => {
348
+ if (i === index) {
349
+ slide.classList.remove('inactive');
350
+ slide.classList.add('active');
351
+ } else {
352
+ slide.classList.remove('active');
353
+ slide.classList.add('inactive');
354
+ }
355
+ });
356
+
357
+ dots.forEach((dot, i) => {
358
+ if (i === index) {
359
+ dot.classList.remove('bg-opacity-50');
360
+ dot.classList.add('bg-opacity-100');
361
+ } else {
362
+ dot.classList.remove('bg-opacity-100');
363
+ dot.classList.add('bg-opacity-50');
364
+ }
365
+ });
366
+
367
+ currentSlide = index;
368
+ }
369
+
370
+ function nextSlide() {
371
+ currentSlide = (currentSlide + 1) % slideCount;
372
+ showSlide(currentSlide);
373
+ }
374
+
375
+ function prevSlide() {
376
+ currentSlide = (currentSlide - 1 + slideCount) % slideCount;
377
+ showSlide(currentSlide);
378
+ }
379
+
380
+ // Auto slide
381
+ let slideInterval = setInterval(nextSlide, 5000);
382
+
383
+ function resetInterval() {
384
+ clearInterval(slideInterval);
385
+ slideInterval = setInterval(nextSlide, 5000);
386
+ }
387
+
388
+ // Event listeners
389
+ nextBtn.addEventListener('click', () => {
390
+ nextSlide();
391
+ resetInterval();
392
+ });
393
+
394
+ prevBtn.addEventListener('click', () => {
395
+ prevSlide();
396
+ resetInterval();
397
+ });
398
+
399
+ dots.forEach(dot => {
400
+ dot.addEventListener('click', () => {
401
+ const slideIndex = parseInt(dot.getAttribute('data-slide'));
402
+ showSlide(slideIndex);
403
+ resetInterval();
404
+ });
405
+ });
406
+
407
+ // Initialize first slide
408
+ showSlide(0);
409
+
410
+ // Dropdown menu functionality
411
+ document.addEventListener('DOMContentLoaded', function() {
412
+ const dropdowns = document.querySelectorAll('.dropdown');
413
+
414
+ dropdowns.forEach(dropdown => {
415
+ const button = dropdown.querySelector('button');
416
+ const menu = dropdown.querySelector('.dropdown-menu');
417
+
418
+ button.addEventListener('click', () => {
419
+ const isOpen = menu.classList.contains('hidden');
420
+ // Close all other dropdowns first
421
+ document.querySelectorAll('.dropdown-menu').forEach(m => {
422
+ if (m !== menu) m.classList.add('hidden');
423
+ });
424
+ // Toggle current dropdown
425
+ if (isOpen) {
426
+ menu.classList.remove('hidden');
427
+ } else {
428
+ menu.classList.add('hidden');
429
+ }
430
+ });
431
+ });
432
+
433
+ // Close dropdowns when clicking outside
434
+ document.addEventListener('click', function(event) {
435
+ if (!event.target.closest('.dropdown')) {
436
+ document.querySelectorAll('.dropdown-menu').forEach(menu => {
437
+ menu.classList.add('hidden');
438
+ });
439
+ }
440
+ });
441
+
442
+ // Submenu functionality
443
+ const submenus = document.querySelectorAll('.dropdown-submenu');
444
+
445
+ submenus.forEach(submenu => {
446
+ const link = submenu.querySelector('a');
447
+ const submenuContent = submenu.querySelector('.dropdown-submenu-content');
448
+
449
+ link.addEventListener('click', (e) => {
450
+ e.preventDefault();
451
+ submenuContent.classList.toggle('hidden');
452
+ });
453
+ });
454
+ });
455
+ </script>
456
+ <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=techguy1/eclipsecat" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
457
+ </html>