victor HF Staff commited on
Commit
462759d
Β·
verified Β·
1 Parent(s): 32f0fb3
Files changed (2) hide show
  1. README.md +8 -5
  2. index.html +321 -19
README.md CHANGED
@@ -1,10 +1,13 @@
1
  ---
2
- title: Quantumvortex Unleashed
3
- emoji: πŸ¦€
4
- colorFrom: indigo
5
- colorTo: blue
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
 
1
  ---
2
+ title: QuantumVortex Unleashed πŸš€
3
+ colorFrom: blue
4
+ colorTo: pink
5
+ emoji: 🐳
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite-v3
10
  ---
11
 
12
+ # Welcome to your new DeepSite project!
13
+ This project was created with [DeepSite](https://deepsite.hf.co).
index.html CHANGED
@@ -1,19 +1,321 @@
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>QuantumVortex Unleashed - Next Generation Web Solutions</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <script src="https://unpkg.com/feather-icons"></script>
11
+ <script>
12
+ tailwind.config = {
13
+ theme: {
14
+ extend: {
15
+ colors: {
16
+ primary: {
17
+ 50: '#f0f9ff',
18
+ 100: '#e0f2fe',
19
+ 200: '#bae6fd',
20
+ 300: '#7dd3fc',
21
+ 400: '#38bdf8',
22
+ 500: '#0ea5e9',
23
+ 600: '#0284c7',
24
+ 700: '#0369a1',
25
+ 800: '#075985',
26
+ 900: '#0c4a6e',
27
+ },
28
+ secondary: {
29
+ 50: '#fdf4ff',
30
+ 100: '#fae8ff',
31
+ 200: '#f5d0fe',
32
+ 300: '#f0abfc',
33
+ 400: '#e879f9',
34
+ 500: '#d946ef',
35
+ 600: '#c026d3',
36
+ 700: '#a21caf',
37
+ 800: '#86198f',
38
+ 900: '#701a75',
39
+ }
40
+ }
41
+ }
42
+ }
43
+ }
44
+ </script>
45
+ <style>
46
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
47
+
48
+ body {
49
+ font-family: 'Inter', sans-serif;
50
+ }
51
+
52
+ .gradient-bg {
53
+ background: linear-gradient(135deg, #0ea5e9 0%, #d946ef 100%);
54
+ }
55
+
56
+ .glass-effect {
57
+ background: rgba(255, 255, 255, 0.1);
58
+ backdrop-filter: blur(10px);
59
+ border: 1px solid rgba(255, 255, 255, 0.2);
60
+ }
61
+
62
+ .hero-pattern {
63
+ background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,0.15) 1px, transparent 0);
64
+ background-size: 40px 40px;
65
+ }
66
+ </style>
67
+ </head>
68
+ <body class="bg-white text-gray-900">
69
+ <!-- Navigation -->
70
+ <nav class="fixed w-full z-50 bg-white/80 backdrop-blur-md border-b border-gray-200">
71
+ <div class="container mx-auto px-6 py-4">
72
+ <div class="flex items-center justify-between">
73
+ <div class="flex items-center space-x-2">
74
+ <div class="w-8 h-8 bg-gradient-to-r from-primary-500 to-secondary-500 rounded-lg"></div>
75
+ <span class="text-xl font-bold bg-gradient-to-r from-primary-600 to-secondary-600 bg-clip-text text-transparent">QuantumVortex</span>
76
+ </div>
77
+
78
+ <div class="hidden md:flex items-center space-x-8">
79
+ <a href="#features" class="text-gray-700 hover:text-primary-600 font-medium transition-colors">Features</a>
80
+ <a href="#solutions" class="text-gray-700 hover:text-primary-600 font-medium transition-colors">Solutions</a>
81
+ <a href="#pricing" class="text-gray-700 hover:text-primary-600 font-medium transition-colors">Pricing</a>
82
+ <a href="#contact" class="text-gray-700 hover:text-primary-600 font-medium transition-colors">Contact</a>
83
+ </div>
84
+
85
+ <div class="flex items-center space-x-4">
86
+ <button class="hidden md:inline-block px-4 py-2 text-primary-600 font-medium hover:text-primary-700 transition-colors">
87
+ Sign In
88
+ </button>
89
+ <button class="px-6 py-2 bg-gradient-to-r from-primary-500 to-secondary-500 text-white rounded-lg font-medium hover:from-primary-600 hover:to-secondary-600 transition-all transform hover:-translate-y-0.5 shadow-lg hover:shadow-xl">
90
+ Get Started
91
+ </button>
92
+
93
+ <button class="md:hidden text-gray-700">
94
+ <i data-feather="menu"></i>
95
+ </button>
96
+ </div>
97
+ </div>
98
+ </div>
99
+ </nav>
100
+
101
+ <!-- Hero Section -->
102
+ <section class="pt-32 pb-20 px-6 relative overflow-hidden">
103
+ <div class="absolute inset-0 hero-pattern opacity-5"></div>
104
+ <div class="container mx-auto max-w-6xl">
105
+ <div class="text-center">
106
+ <div class="inline-flex items-center px-4 py-2 rounded-full bg-primary-50 text-primary-700 text-sm font-medium mb-8">
107
+ <span class="w-2 h-2 bg-primary-500 rounded-full mr-2"></span>
108
+ Next Generation Web Solutions
109
+ </div>
110
+
111
+ <h1 class="text-5xl md:text-7xl font-bold mb-6 leading-tight">
112
+ Transform Your Digital
113
+ <span class="bg-gradient-to-r from-primary-600 to-secondary-600 bg-clip-text text-transparent">Presence</span>
114
+ </h1>
115
+
116
+ <p class="text-xl md:text-2xl text-gray-600 mb-12 max-w-3xl mx-auto leading-relaxed">
117
+ Experience the future of web development with cutting-edge solutions that blend innovation, performance, and stunning design.
118
+ </p>
119
+
120
+ <div class="flex flex-col sm:flex-row gap-4 justify-center items-center">
121
+ <button class="px-8 py-4 bg-gradient-to-r from-primary-500 to-secondary-500 text-white rounded-xl font-semibold text-lg hover:from-primary-600 hover:to-secondary-600 transition-all transform hover:-translate-y-1 shadow-xl hover:shadow-2xl flex items-center">
122
+ <span>Start Building</span>
123
+ <i data-feather="arrow-right" class="ml-2 w-5 h-5"></i>
124
+ </button>
125
+ <button class="px-8 py-4 border-2 border-gray-300 text-gray-700 rounded-xl font-semibold text-lg hover:border-primary-500 hover:text-primary-600 transition-all">
126
+ View Demo
127
+ </button>
128
+ </div>
129
+ </div>
130
+
131
+ <!-- Hero Visual -->
132
+ <div class="mt-20 relative">
133
+ <div class="glass-effect rounded-3xl p-8 max-w-4xl mx-auto">
134
+ <div class="bg-gradient-to-br from-primary-50 to-secondary-50 rounded-2xl p-8 shadow-2xl">
135
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
136
+ <div class="bg-white rounded-xl p-6 shadow-lg border border-gray-100">
137
+ <div class="w-12 h-12 bg-primary-100 rounded-lg flex items-center justify-center mb-4">
138
+ <i data-feather="zap" class="text-primary-600 w-6 h-6"></i>
139
+ </div>
140
+ <h3 class="font-bold text-lg mb-2">Lightning Fast</h3>
141
+ <p class="text-gray-600 text-sm">Optimized performance for instant loading</p>
142
+ </div>
143
+ <div class="bg-white rounded-xl p-6 shadow-lg border border-gray-100">
144
+ <div class="w-12 h-12 bg-secondary-100 rounded-lg flex items-center justify-center mb-4">
145
+ <i data-feather="shield" class="text-secondary-600 w-6 h-6"></i>
146
+ </div>
147
+ <h3 class="font-bold text-lg mb-2">Secure & Reliable</h3>
148
+ <p class="text-gray-600 text-sm">Enterprise-grade security measures</p>
149
+ </div>
150
+ <div class="bg-white rounded-xl p-6 shadow-lg border border-gray-100">
151
+ <div class="w-12 h-12 bg-primary-100 rounded-lg flex items-center justify-center mb-4">
152
+ <i data-feather="trending-up" class="text-primary-600 w-6 h-6"></i>
153
+ </div>
154
+ <h3 class="font-bold text-lg mb-2">SEO Optimized</h3>
155
+ <p class="text-gray-600 text-sm">Rank higher with built-in SEO tools</p>
156
+ </div>
157
+ </div>
158
+ </div>
159
+ </div>
160
+ </div>
161
+ </div>
162
+ </section>
163
+
164
+ <!-- Features Section -->
165
+ <section id="features" class="py-20 px-6 bg-gray-50">
166
+ <div class="container mx-auto max-w-6xl">
167
+ <div class="text-center mb-16">
168
+ <h2 class="text-4xl md:text-5xl font-bold mb-6">Powerful Features</h2>
169
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">
170
+ Discover the tools and capabilities that make QuantumVortex the ultimate choice for modern web development
171
+ </p>
172
+ </div>
173
+
174
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
175
+ <!-- Feature 1 -->
176
+ <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 border border-gray-100 hover:border-primary-200">
177
+ <div class="w-16 h-16 bg-gradient-to-r from-primary-500 to-secondary-500 rounded-2xl flex items-center justify-center mb-6">
178
+ <i data-feather="code" class="text-white w-8 h-8"></i>
179
+ </div>
180
+ <h3 class="text-2xl font-bold mb-4">Advanced Development</h3>
181
+ <p class="text-gray-600 mb-6">
182
+ Build with modern frameworks and cutting-edge technologies for superior performance and scalability.
183
+ </p>
184
+ <ul class="space-y-3">
185
+ <li class="flex items-center text-gray-700">
186
+ <i data-feather="check" class="text-primary-500 w-5 h-5 mr-3"></i>
187
+ React & Next.js Integration
188
+ </li>
189
+ <li class="flex items-center text-gray-700">
190
+ <i data-feather="check" class="text-primary-500 w-5 h-5 mr-3"></i>
191
+ TypeScript Support
192
+ </li>
193
+ <li class="flex items-center text-gray-700">
194
+ <i data-feather="check" class="text-primary-500 w-5 h-5 mr-3"></i>
195
+ API-First Architecture
196
+ </li>
197
+ </ul>
198
+ </div>
199
+
200
+ <!-- Feature 2 -->
201
+ <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 border border-gray-100 hover:border-secondary-200">
202
+ <div class="w-16 h-16 bg-gradient-to-r from-secondary-500 to-primary-500 rounded-2xl flex items-center justify-center mb-6">
203
+ <i data-feather="layers" class="text-white w-8 h-8"></i>
204
+ </div>
205
+ <h3 class="text-2xl font-bold mb-4">Design System</h3>
206
+ <p class="text-gray-600 mb-6">
207
+ Access a comprehensive design system with reusable components and consistent styling patterns.
208
+ </p>
209
+ <ul class="space-y-3">
210
+ <li class="flex items-center text-gray-700">
211
+ <i data-feather="check" class="text-secondary-500 w-5 h-5 mr-3"></i>
212
+ Component Library
213
+ </li>
214
+ <li class="flex items-center text-gray-700">
215
+ <i data-feather="check" class="text-secondary-500 w-5 h-5 mr-3"></i>
216
+ Dark/Light Themes
217
+ </li>
218
+ <li class="flex items-center text-gray-700">
219
+ <i data-feather="check" class="text-secondary-500 w-5 h-5 mr-3"></i>
220
+ Responsive Design
221
+ </li>
222
+ </ul>
223
+ </div>
224
+
225
+ <!-- Feature 3 -->
226
+ <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 border border-gray-100 hover:border-primary-200">
227
+ <div class="w-16 h-16 bg-gradient-to-r from-primary-500 to-secondary-500 rounded-2xl flex items-center justify-center mb-6">
228
+ <i data-feather="cloud" class="text-white w-8 h-8"></i>
229
+ </div>
230
+ <h3 class="text-2xl font-bold mb-4">Cloud Deployment</h3>
231
+ <p class="text-gray-600 mb-6">
232
+ Seamless deployment to your preferred cloud platform with automated CI/CD pipelines.
233
+ </p>
234
+ <ul class="space-y-3">
235
+ <li class="flex items-center text-gray-700">
236
+ <i data-feather="check" class="text-primary-500 w-5 h-5 mr-3"></i>
237
+ One-Click Deployment
238
+ </li>
239
+ <li class="flex items-center text-gray-700">
240
+ <i data-feather="check" class="text-primary-500 w-5 h-5 mr-3"></i>
241
+ Auto Scaling
242
+ </li>
243
+ <li class="flex items-center text-gray-700">
244
+ <i data-feather="check" class="text-primary-500 w-5 h-5 mr-3"></i>
245
+ Global CDN
246
+ </li>
247
+ </ul>
248
+ </div>
249
+ </div>
250
+ </div>
251
+ </section>
252
+
253
+ <!-- CTA Section -->
254
+ <section class="py-20 px-6 gradient-bg text-white relative overflow-hidden">
255
+ <div class="absolute inset-0 opacity-10">
256
+ <div class="absolute top-10 left-10 w-72 h-72 bg-white rounded-full blur-3xl"></div>
257
+ <div class="absolute bottom-10 right-10 w-96 h-96 bg-secondary-300 rounded-full blur-3xl"></div>
258
+ </div>
259
+
260
+ <div class="container mx-auto max-w-4xl text-center relative z-10">
261
+ <h2 class="text-4xl md:text-5xl font-bold mb-6">
262
+ Ready to Transform Your Digital Experience?
263
+ </h2>
264
+ <p class="text-xl mb-8 opacity-90 max-w-2xl mx-auto">
265
+ Join thousands of developers and businesses already building the future with QuantumVortex.
266
+ </p>
267
+ <div class="flex flex-col sm:flex-row gap-4 justify-center">
268
+ <button class="px-8 py-4 bg-white text-primary-600 rounded-xl font-semibold text-lg hover:bg-gray-100 transition-all transform hover:-translate-y-1 shadow-2xl">
269
+ Start Free Trial
270
+ </button>
271
+ <button class="px-8 py-4 border-2 border-white text-white rounded-xl font-semibold text-lg hover:bg-white hover:text-primary-600 transition-all">
272
+ Schedule Demo
273
+ </button>
274
+ </div>
275
+ </div>
276
+ </section>
277
+
278
+ <!-- Footer -->
279
+ <footer class="bg-gray-900 text-white py-16 px-6">
280
+ <div class="container mx-auto max-w-6xl">
281
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
282
+ <div class="md:col-span-2">
283
+ <div class="flex items-center space-x-2 mb-6">
284
+ <div class="w-8 h-8 bg-gradient-to-r from-primary-500 to-secondary-500 rounded-lg"></div>
285
+ <span class="text-xl font-bold">QuantumVortex</span>
286
+ </div>
287
+ <p class="text-gray-400 mb-6 max-w-md">
288
+ Building the future of web development with innovative solutions and cutting-edge technology.
289
+ </p>
290
+ <div class="flex space-x-4">
291
+ <a href="#" class="w-10 h-10 bg-gray-800 rounded-lg flex items-center justify-center hover:bg-primary-600 transition-colors">
292
+ <i data-feather="twitter" class="w-5 h-5"></i>
293
+ </a>
294
+ <a href="#" class="w-10 h-10 bg-gray-800 rounded-lg flex items-center justify-center hover:bg-primary-600 transition-colors">
295
+ <i data-feather="github" class="w-5 h-5"></i>
296
+ </a>
297
+ <a href="#" class="w-10 h-10 bg-gray-800 rounded-lg flex items-center justify-center hover:bg-primary-600 transition-colors">
298
+ <i data-feather="linkedin" class="w-5 h-5"></i>
299
+ </a>
300
+ </div>
301
+ </div>
302
+
303
+ <div>
304
+ <h3 class="font-bold text-lg mb-4">Product</h3>
305
+ <ul class="space-y-3">
306
+ <li><a href="#" class="text-gray-400 hover:text-white transition-colors">Features</a></li>
307
+ <li><a href="#" class="text-gray-400 hover:text-white transition-colors">Solutions</a></li>
308
+ <li><a href="#" class="text-gray-400 hover:text-white transition-colors">Pricing</a></li>
309
+ <li><a href="#" class="text-gray-400 hover:text-white transition-colors">Documentation</a></li>
310
+ </ul>
311
+ </div>
312
+
313
+ <div>
314
+ <h3 class="font-bold text-lg mb-4">Company</h3>
315
+ <ul class="space-y-3">
316
+ <li><a href="#" class="text-gray-400 hover:text-white transition-colors">About</a></li>
317
+ <li><a href="#" class="text-gray-400 hover:text-white transition-colors">Blog</a></li>
318
+ <li><a href="#" class="text-gray-400 hover:text-white transition-colors">Careers</a></li>
319
+ <li><a href="#" class="text-gray-400 hover:text-white transition-col
320
+ </body>
321
+ </html>