Hugging Face's logo

Spaces:
likhonsheikh
/
v0-landing-final
Sleeping

App Files Community
likhonsheikh commited on
Commit
26f1b18
·
verified ·
1 Parent(s): 40b153a

Upload index.html with huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +287 -18
index.html CHANGED
@@ -1,19 +1,288 @@
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>v0 by Vercel</title>
7
+ <link rel="stylesheet" href="styles.css">
8
+ </head>
9
+ <body>
10
+ <!-- Top Navigation -->
11
+ <nav class="top-nav">
12
+ <div class="nav-left">
13
+ <a href="#" class="logo">
14
+ <svg viewBox="0 0 24 24" fill="currentColor">
15
+ <path d="M12 2L2 19.5h20L12 2z"/>
16
+ </svg>
17
+ </a>
18
+ <div class="nav-links">
19
+ <button class="nav-link dropdown">
20
+ Templates
21
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
22
+ <polyline points="6 9 12 15 18 9"></polyline>
23
+ </svg>
24
+ </button>
25
+ <button class="nav-link dropdown">
26
+ Resources
27
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
28
+ <polyline points="6 9 12 15 18 9"></polyline>
29
+ </svg>
30
+ </button>
31
+ <a href="#" class="nav-link">Enterprise</a>
32
+ <a href="#" class="nav-link">Pricing</a>
33
+ <a href="#" class="nav-link">iOS</a>
34
+ <a href="#" class="nav-link">Students</a>
35
+ <a href="#" class="nav-link">FAQ</a>
36
+ </div>
37
+ </div>
38
+ <div class="nav-right">
39
+ <button class="btn-secondary">Sign In</button>
40
+ <button class="btn-primary">Sign Up</button>
41
+ </div>
42
+ </nav>
43
+
44
+ <!-- Main Content -->
45
+ <main class="main-container">
46
+ <!-- Hero Section -->
47
+ <section class="hero">
48
+ <h1 class="hero-title">What do you want to create?</h1>
49
+ <p class="hero-subtitle">Start building with a single prompt. No coding needed.</p>
50
+
51
+ <!-- Input Area -->
52
+ <div class="input-container">
53
+ <button class="add-btn" aria-label="Add attachment">
54
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
55
+ <line x1="12" y1="5" x2="12" y2="19"></line>
56
+ <line x1="5" y1="12" x2="19" y2="12"></line>
57
+ </svg>
58
+ </button>
59
+ <input
60
+ type="text"
61
+ class="main-input"
62
+ placeholder="Ask v0 to build..."
63
+ >
64
+ <button class="upload-btn" aria-label="Upload file">
65
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
66
+ <path d="M12 5v14M5 12l7 7 7-7"/>
67
+ </svg>
68
+ </button>
69
+ </div>
70
+ </section>
71
+
72
+ <!-- Community Section -->
73
+ <section class="community">
74
+ <div class="community-header">
75
+ <div>
76
+ <h2 class="community-title">From the Community</h2>
77
+ <p class="community-subtitle">Explore what the community is building with v0.</p>
78
+ </div>
79
+ <a href="#" class="browse-all">
80
+ Browse All
81
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
82
+ <polyline points="9 18 15 12 9 6"></polyline>
83
+ </svg>
84
+ </a>
85
+ </div>
86
+
87
+ <!-- Template Grid -->
88
+ <div class="template-grid">
89
+ <!-- Template Card 1 -->
90
+ <div class="template-card">
91
+ <div class="template-preview">
92
+ <div class="preview-content preview-1">
93
+ <h3>Effortless custom contract billing by Brilliance</h3>
94
+ <div class="preview-mockup">
95
+ <div class="mockup-header"></div>
96
+ <div class="mockup-content">
97
+ <div class="mockup-text"></div>
98
+ <div class="mockup-text short"></div>
99
+ <div class="mockup-button"></div>
100
+ </div>
101
+ </div>
102
+ </div>
103
+ </div>
104
+ <div class="template-info">
105
+ <div class="template-avatar"></div>
106
+ <div class="template-details">
107
+ <h4 class="template-name">Brilliance SaaS Landing Page</h4>
108
+ <div class="template-stats">
109
+ <span class="stat">
110
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
111
+ <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
112
+ <circle cx="12" cy="12" r="3"></circle>
113
+ </svg>
114
+ 2.1k
115
+ </span>
116
+ <span class="stat">
117
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
118
+ <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path>
119
+ </svg>
120
+ 662
121
+ </span>
122
+ </div>
123
+ </div>
124
+ </div>
125
+ </div>
126
+
127
+ <!-- Template Card 2 -->
128
+ <div class="template-card">
129
+ <div class="template-preview">
130
+ <div class="preview-content preview-2">
131
+ <div class="gallery-item"></div>
132
+ <div class="gallery-text">3D Gallery Photography Template</div>
133
+ </div>
134
+ </div>
135
+ <div class="template-info">
136
+ <div class="template-avatar"></div>
137
+ <div class="template-details">
138
+ <h4 class="template-name">3D Gallery Photography Template</h4>
139
+ <div class="template-stats">
140
+ <span class="stat">
141
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
142
+ <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
143
+ <circle cx="12" cy="12" r="3"></circle>
144
+ </svg>
145
+ 5.14k
146
+ </span>
147
+ <span class="stat">
148
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
149
+ <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path>
150
+ </svg>
151
+ 403
152
+ </span>
153
+ </div>
154
+ </div>
155
+ </div>
156
+ </div>
157
+
158
+ <!-- Template Card 3 -->
159
+ <div class="template-card">
160
+ <div class="template-preview">
161
+ <div class="preview-content preview-3">
162
+ <div class="ai-badge">AI</div>
163
+ <h3>AI Gateway Starter</h3>
164
+ </div>
165
+ </div>
166
+ <div class="template-info">
167
+ <div class="template-avatar"></div>
168
+ <div class="template-details">
169
+ <h4 class="template-name">AI Gateway Starter</h4>
170
+ <div class="template-stats">
171
+ <span class="stat">
172
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
173
+ <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
174
+ <circle cx="12" cy="12" r="3"></circle>
175
+ </svg>
176
+ 4.42
177
+ </span>
178
+ <span class="stat">
179
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
180
+ <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path>
181
+ </svg>
182
+ 188
183
+ </span>
184
+ </div>
185
+ </div>
186
+ </div>
187
+ </div>
188
+
189
+ <!-- Template Card 4 -->
190
+ <div class="template-card">
191
+ <div class="template-preview">
192
+ <div class="preview-content preview-4">
193
+ <div class="gradient-bg"></div>
194
+ <h3>Unleash the Power of AI Agents</h3>
195
+ <button class="preview-btn">Learn More</button>
196
+ </div>
197
+ </div>
198
+ <div class="template-info">
199
+ <div class="template-avatar"></div>
200
+ <div class="template-details">
201
+ <h4 class="template-name">Pointer AI landing page</h4>
202
+ <div class="template-stats">
203
+ <span class="stat">
204
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
205
+ <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
206
+ <circle cx="12" cy="12" r="3"></circle>
207
+ </svg>
208
+ 14.8k
209
+ </span>
210
+ <span class="stat">
211
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
212
+ <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path>
213
+ </svg>
214
+ 1.1k
215
+ </span>
216
+ </div>
217
+ </div>
218
+ </div>
219
+ </div>
220
+
221
+ <!-- Template Card 5 -->
222
+ <div class="template-card">
223
+ <div class="template-preview">
224
+ <div class="preview-content preview-5">
225
+ <div class="dashboard-mockup">
226
+ <div class="chart-area"></div>
227
+ </div>
228
+ </div>
229
+ </div>
230
+ <div class="template-info">
231
+ <div class="template-avatar"></div>
232
+ <div class="template-details">
233
+ <h4 class="template-name">Dashboard – M.O.N.K.Y</h4>
234
+ <div class="template-stats">
235
+ <span class="stat">
236
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
237
+ <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
238
+ <circle cx="12" cy="12" r="3"></circle>
239
+ </svg>
240
+ 7.76k
241
+ </span>
242
+ <span class="stat">
243
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
244
+ <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path>
245
+ </svg>
246
+ 725
247
+ </span>
248
+ </div>
249
+ </div>
250
+ </div>
251
+ </div>
252
+
253
+ <!-- Template Card 6 -->
254
+ <div class="template-card">
255
+ <div class="template-preview">
256
+ <div class="preview-content preview-6">
257
+ <h3>Unlock your future growth</h3>
258
+ </div>
259
+ </div>
260
+ <div class="template-info">
261
+ <div class="template-avatar"></div>
262
+ <div class="template-details">
263
+ <h4 class="template-name">Skal Ventures Template</h4>
264
+ <div class="template-stats">
265
+ <span class="stat">
266
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
267
+ <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
268
+ <circle cx="12" cy="12" r="3"></circle>
269
+ </svg>
270
+ 3.23k
271
+ </span>
272
+ <span class="stat">
273
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
274
+ <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path>
275
+ </svg>
276
+ 495
277
+ </span>
278
+ </div>
279
+ </div>
280
+ </div>
281
+ </div>
282
+ </div>
283
+ </section>
284
+ </main>
285
+
286
+ <script src="script.js"></script>
287
+ </body>
288
  </html>