Hugging Face's logo

Spaces:
Xcoder2020
/
sigma-trial-2
Running

App Files Community
Xcoder2020 commited on
Commit
c9021b0
·
verified ·
1 Parent(s): 6f215c7

add store section with some digital and physical goods - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +765 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Sigma Trial 2
3
- emoji: 🏆
4
- colorFrom: blue
5
- colorTo: yellow
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: sigma-trial-2
3
+ emoji: 🐳
4
+ colorFrom: purple
5
+ colorTo: red
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,765 @@
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>Sigma Trial - Cutting Edge Analysis</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
+ /* Custom animations */
11
+ @keyframes fadeIn {
12
+ from { opacity: 0; }
13
+ to { opacity: 1; }
14
+ }
15
+
16
+ .fade-in {
17
+ animation: fadeIn 0.5s ease-in-out;
18
+ }
19
+
20
+ /* Custom scrollbar */
21
+ ::-webkit-scrollbar {
22
+ width: 8px;
23
+ }
24
+
25
+ ::-webkit-scrollbar-track {
26
+ background: #f1f1f1;
27
+ }
28
+
29
+ ::-webkit-scrollbar-thumb {
30
+ background: #3b82f6;
31
+ border-radius: 4px;
32
+ }
33
+
34
+ ::-webkit-scrollbar-thumb:hover {
35
+ background: #2563eb;
36
+ }
37
+
38
+ /* Gradient text */
39
+ .gradient-text {
40
+ background: linear-gradient(90deg, #3b82f6, #10b981);
41
+ -webkit-background-clip: text;
42
+ background-clip: text;
43
+ color: transparent;
44
+ }
45
+
46
+ /* Card hover effect */
47
+ .card-hover {
48
+ transition: all 0.3s ease;
49
+ }
50
+
51
+ .card-hover:hover {
52
+ transform: translateY(-5px);
53
+ box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
54
+ }
55
+ </style>
56
+ </head>
57
+ <body class="bg-gray-50 font-sans">
58
+ <!-- Header -->
59
+ <header class="sticky top-0 z-50 bg-white shadow-md">
60
+ <div class="container mx-auto px-4 py-3">
61
+ <div class="flex justify-between items-center">
62
+ <div class="flex items-center space-x-2">
63
+ <div class="w-10 h-10 bg-gradient-to-r from-blue-500 to-green-500 rounded-full flex items-center justify-center">
64
+ <span class="text-white font-bold text-xl">Σ</span>
65
+ </div>
66
+ <h1 class="text-2xl font-bold gradient-text">Sigma Trial</h1>
67
+ </div>
68
+
69
+ <nav class="hidden md:flex space-x-8">
70
+ <a href="#home" class="text-gray-700 hover:text-blue-600 font-medium transition">Home</a>
71
+ <a href="#categories" class="text-gray-700 hover:text-blue-600 font-medium transition">Categories</a>
72
+ <a href="#trending" class="text-gray-700 hover:text-blue-600 font-medium transition">Trending</a>
73
+ <a href="#store" class="text-gray-700 hover:text-blue-600 font-medium transition">Store</a>
74
+ <a href="#about" class="text-gray-700 hover:text-blue-600 font-medium transition">About</a>
75
+ </nav>
76
+
77
+ <div class="flex items-center space-x-4">
78
+ <button class="md:hidden text-gray-700" id="mobile-menu-button">
79
+ <i class="fas fa-bars text-xl"></i>
80
+ </button>
81
+ <button class="hidden md:block bg-gradient-to-r from-blue-500 to-green-500 text-white px-4 py-2 rounded-full font-medium hover:opacity-90 transition">
82
+ Subscribe
83
+ </button>
84
+ </div>
85
+ </div>
86
+ </div>
87
+
88
+ <!-- Mobile menu -->
89
+ <div class="md:hidden hidden bg-white py-4 px-4 shadow-lg" id="mobile-menu">
90
+ <div class="flex flex-col space-y-3">
91
+ <a href="#home" class="text-gray-700 hover:text-blue-600 font-medium transition">Home</a>
92
+ <a href="#categories" class="text-gray-700 hover:text-blue-600 font-medium transition">Categories</a>
93
+ <a href="#trending" class="text-gray-700 hover:text-blue-600 font-medium transition">Trending</a>
94
+ <a href="#store" class="text-gray-700 hover:text-blue-600 font-medium transition">Store</a>
95
+ <a href="#about" class="text-gray-700 hover:text-blue-600 font-medium transition">About</a>
96
+ <button class="bg-gradient-to-r from-blue-500 to-green-500 text-white px-4 py-2 rounded-full font-medium hover:opacity-90 transition">
97
+ Subscribe
98
+ </button>
99
+ </div>
100
+ </div>
101
+ </header>
102
+
103
+ <!-- Hero Section -->
104
+ <section id="home" class="py-16 md:py-24 bg-gradient-to-r from-blue-50 to-green-50">
105
+ <div class="container mx-auto px-4">
106
+ <div class="flex flex-col md:flex-row items-center">
107
+ <div class="md:w-1/2 mb-10 md:mb-0 fade-in">
108
+ <h2 class="text-4xl md:text-5xl font-bold text-gray-800 mb-4">
109
+ Cutting Edge <span class="gradient-text">Analysis</span> for the Modern Thinker
110
+ </h2>
111
+ <p class="text-lg text-gray-600 mb-6">
112
+ Sigma Trial delivers in-depth articles on politics, economics, AI, cybersecurity, and technology.
113
+ Stay ahead with our expert analysis.
114
+ </p>
115
+ <div class="flex space-x-4">
116
+ <button class="bg-gradient-to-r from-blue-500 to-green-500 text-white px-6 py-3 rounded-full font-medium hover:opacity-90 transition">
117
+ Explore Articles
118
+ </button>
119
+ <button class="border border-blue-500 text-blue-500 px-6 py-3 rounded-full font-medium hover:bg-blue-50 transition">
120
+ Learn More
121
+ </button>
122
+ </div>
123
+ </div>
124
+ <div class="md:w-1/2 flex justify-center fade-in">
125
+ <div class="relative w-full max-w-md">
126
+ <div class="absolute -top-6 -left-6 w-32 h-32 bg-blue-200 rounded-full opacity-50"></div>
127
+ <div class="absolute -bottom-6 -right-6 w-32 h-32 bg-green-200 rounded-full opacity-50"></div>
128
+ <div class="relative bg-white p-6 rounded-xl shadow-lg">
129
+ <div class="flex items-center mb-4">
130
+ <div class="w-12 h-12 bg-gradient-to-r from-blue-500 to-green-500 rounded-full flex items-center justify-center">
131
+ <span class="text-white font-bold text-xl">Σ</span>
132
+ </div>
133
+ <div class="ml-3">
134
+ <h4 class="font-bold text-gray-800">Today's Featured</h4>
135
+ <p class="text-sm text-gray-500">Updated 2 hours ago</p>
136
+ </div>
137
+ </div>
138
+ <h3 class="text-xl font-bold text-gray-800 mb-3">The Future of AI in Political Campaigns</h3>
139
+ <p class="text-gray-600 mb-4">
140
+ How artificial intelligence is reshaping political strategies and voter targeting in the 2024 elections...
141
+ </p>
142
+ <div class="flex justify-between items-center">
143
+ <span class="text-sm text-blue-500 font-medium">Politics • AI</span>
144
+ <button class="text-blue-500 hover:text-blue-700">
145
+ <i class="fas fa-arrow-right"></i>
146
+ </button>
147
+ </div>
148
+ </div>
149
+ </div>
150
+ </div>
151
+ </div>
152
+ </div>
153
+ </section>
154
+
155
+ <!-- Categories Section -->
156
+ <section id="categories" class="py-16 bg-white">
157
+ <div class="container mx-auto px-4">
158
+ <div class="text-center mb-12 fade-in">
159
+ <h2 class="text-3xl font-bold text-gray-800 mb-3">Explore Our <span class="gradient-text">Categories</span></h2>
160
+ <p class="text-gray-600 max-w-2xl mx-auto">
161
+ Dive into our specialized content areas covering the most important topics shaping our world today.
162
+ </p>
163
+ </div>
164
+
165
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
166
+ <!-- Politics Card -->
167
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.1s;">
168
+ <div class="h-48 bg-gradient-to-r from-red-500 to-pink-500 flex items-center justify-center">
169
+ <i class="fas fa-landmark text-white text-6xl"></i>
170
+ </div>
171
+ <div class="p-6">
172
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Politics</h3>
173
+ <p class="text-gray-600 mb-4">
174
+ In-depth analysis of global political developments, policy changes, and geopolitical shifts.
175
+ </p>
176
+ <button class="text-blue-500 font-medium flex items-center">
177
+ View Articles <i class="fas fa-arrow-right ml-2"></i>
178
+ </button>
179
+ </div>
180
+ </div>
181
+
182
+ <!-- Economics Card -->
183
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.2s;">
184
+ <div class="h-48 bg-gradient-to-r from-yellow-500 to-orange-500 flex items-center justify-center">
185
+ <i class="fas fa-chart-line text-white text-6xl"></i>
186
+ </div>
187
+ <div class="p-6">
188
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Economics</h3>
189
+ <p class="text-gray-600 mb-4">
190
+ Market trends, fiscal policies, and economic theories explained for the modern professional.
191
+ </p>
192
+ <button class="text-blue-500 font-medium flex items-center">
193
+ View Articles <i class="fas fa-arrow-right ml-2"></i>
194
+ </button>
195
+ </div>
196
+ </div>
197
+
198
+ <!-- AI Card -->
199
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.3s;">
200
+ <div class="h-48 bg-gradient-to-r from-purple-500 to-indigo-500 flex items-center justify-center">
201
+ <i class="fas fa-robot text-white text-6xl"></i>
202
+ </div>
203
+ <div class="p-6">
204
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Artificial Intelligence</h3>
205
+ <p class="text-gray-600 mb-4">
206
+ The latest breakthroughs in AI research, applications, and ethical considerations.
207
+ </p>
208
+ <button class="text-blue-500 font-medium flex items-center">
209
+ View Articles <i class="fas fa-arrow-right ml-2"></i>
210
+ </button>
211
+ </div>
212
+ </div>
213
+
214
+ <!-- Cybersecurity Card -->
215
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.4s;">
216
+ <div class="h-48 bg-gradient-to-r from-green-500 to-teal-500 flex items-center justify-center">
217
+ <i class="fas fa-shield-alt text-white text-6xl"></i>
218
+ </div>
219
+ <div class="p-6">
220
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Cybersecurity</h3>
221
+ <p class="text-gray-600 mb-4">
222
+ Protecting digital assets in an increasingly connected world with expert security insights.
223
+ </p>
224
+ <button class="text-blue-500 font-medium flex items-center">
225
+ View Articles <i class="fas fa-arrow-right ml-2"></i>
226
+ </button>
227
+ </div>
228
+ </div>
229
+
230
+ <!-- Programming Card -->
231
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.5s;">
232
+ <div class="h-48 bg-gradient-to-r from-blue-500 to-cyan-500 flex items-center justify-center">
233
+ <i class="fas fa-code text-white text-6xl"></i>
234
+ </div>
235
+ <div class="p-6">
236
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Programming & Tech</h3>
237
+ <p class="text-gray-600 mb-4">
238
+ Cutting-edge technologies, programming languages, and development methodologies.
239
+ </p>
240
+ <button class="text-blue-500 font-medium flex items-center">
241
+ View Articles <i class="fas fa-arrow-right ml-2"></i>
242
+ </button>
243
+ </div>
244
+ </div>
245
+
246
+ <!-- History Card -->
247
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.5s;">
248
+ <div class="h-48 bg-gradient-to-r from-amber-500 to-orange-500 flex items-center justify-center">
249
+ <i class="fas fa-history text-white text-6xl"></i>
250
+ </div>
251
+ <div class="p-6">
252
+ <h3 class="text-xl font-bold text-gray-800 mb-2">History</h3>
253
+ <p class="text-gray-600 mb-4">
254
+ Exploring historical events and their impact on modern politics, technology and society.
255
+ </p>
256
+ <button class="text-blue-500 font-medium flex items-center">
257
+ View Articles <i class="fas fa-arrow-right ml-2"></i>
258
+ </button>
259
+ </div>
260
+ </div>
261
+
262
+ <!-- Newsletter Card -->
263
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.6s;">
264
+ <div class="h-48 bg-gradient-to-r from-gray-800 to-gray-600 flex items-center justify-center">
265
+ <i class="fas fa-envelope-open-text text-white text-6xl"></i>
266
+ </div>
267
+ <div class="p-6">
268
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Weekly Digest</h3>
269
+ <p class="text-gray-600 mb-4">
270
+ Get our best articles delivered straight to your inbox every week.
271
+ </p>
272
+ <div class="flex">
273
+ <input type="email" placeholder="Your email" class="flex-grow px-4 py-2 border border-gray-300 rounded-l-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
274
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-r-lg hover:bg-blue-600 transition">
275
+ <i class="fas fa-paper-plane"></i>
276
+ </button>
277
+ </div>
278
+ </div>
279
+ </div>
280
+ </div>
281
+ </div>
282
+ </section>
283
+
284
+ <!-- Trending Articles -->
285
+ <section id="trending" class="py-16 bg-gray-50">
286
+ <div class="container mx-auto px-4">
287
+ <div class="text-center mb-12 fade-in">
288
+ <h2 class="text-3xl font-bold text-gray-800 mb-3"><span class="gradient-text">Trending</span> This Week</h2>
289
+ <p class="text-gray-600 max-w-2xl mx-auto">
290
+ The articles our readers are engaging with most this week across all categories.
291
+ </p>
292
+ </div>
293
+
294
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-8 mb-8">
295
+ <!-- Featured Article -->
296
+ <div class="lg:col-span-2 bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
297
+ <div class="md:flex">
298
+ <div class="md:w-1/2 h-64 md:h-auto bg-cover bg-center" style="background-image: url('https://images.unsplash.com/photo-1620712943543-bcc4688e7485?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80');"></div>
299
+ <div class="md:w-1/2 p-6">
300
+ <div class="flex items-center mb-3">
301
+ <span class="bg-blue-100 text-blue-800 text-xs font-medium px-2.5 py-0.5 rounded">Featured</span>
302
+ <span class="text-gray-500 text-sm ml-2">15 min read</span>
303
+ </div>
304
+ <h3 class="text-2xl font-bold text-gray-800 mb-3">Quantum Computing Breakthrough: What It Means for Cybersecurity</h3>
305
+ <p class="text-gray-600 mb-4">
306
+ Researchers have achieved a major milestone in quantum computing that could render current encryption methods obsolete. We examine the implications for global cybersecurity.
307
+ </p>
308
+ <div class="flex items-center justify-between">
309
+ <div class="flex items-center">
310
+ <div class="w-8 h-8 bg-gray-300 rounded-full"></div>
311
+ <div class="ml-2">
312
+ <p class="text-sm font-medium text-gray-800">Dr. Sarah Chen</p>
313
+ <p class="text-xs text-gray-500">Cybersecurity Expert</p>
314
+ </div>
315
+ </div>
316
+ <span class="text-sm text-blue-500 font-medium">Cybersecurity • Tech</span>
317
+ </div>
318
+ </div>
319
+ </div>
320
+ </div>
321
+
322
+ <!-- Second Article -->
323
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
324
+ <div class="h-48 bg-cover bg-center" style="background-image: url('https://images.unsplash.com/photo-1642790559316-8c62b1f827fe?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80');"></div>
325
+ <div class="p-6">
326
+ <div class="flex items-center mb-3">
327
+ <span class="bg-green-100 text-green-800 text-xs font-medium px-2.5 py-0.5 rounded">Trending</span>
328
+ <span class="text-gray-500 text-sm ml-2">8 min read</span>
329
+ </div>
330
+ <h3 class="text-xl font-bold text-gray-800 mb-3">The Economic Impact of AI Regulation in the EU</h3>
331
+ <p class="text-gray-600 mb-4">
332
+ How the new EU AI Act could shape the competitive landscape for tech companies and startups across Europe.
333
+ </p>
334
+ <div class="flex items-center justify-between">
335
+ <div class="flex items-center">
336
+ <div class="w-8 h-8 bg-gray-300 rounded-full"></div>
337
+ <div class="ml-2">
338
+ <p class="text-sm font-medium text-gray-800">Markus Weber</p>
339
+ <p class="text-xs text-gray-500">Economic Analyst</p>
340
+ </div>
341
+ </div>
342
+ <span class="text-sm text-blue-500 font-medium">Economics • AI</span>
343
+ </div>
344
+ </div>
345
+ </div>
346
+ </div>
347
+
348
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
349
+ <!-- Article 3 -->
350
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.1s;">
351
+ <div class="h-48 bg-cover bg-center" style="background-image: url('https://images.unsplash.com/photo-1579621970563-ebec7560ff3e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80');"></div>
352
+ <div class="p-6">
353
+ <div class="flex items-center mb-3">
354
+ <span class="text-gray-500 text-sm">12 min read</span>
355
+ </div>
356
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Rust vs Go: Which Language Dominates in 2024?</h3>
357
+ <p class="text-gray-600 mb-4">
358
+ A comprehensive comparison of performance, ecosystem, and adoption trends for these two rising stars in systems programming.
359
+ </p>
360
+ <div class="flex items-center justify-between">
361
+ <div class="flex items-center">
362
+ <div class="w-8 h-8 bg-gray-300 rounded-full"></div>
363
+ <div class="ml-2">
364
+ <p class="text-sm font-medium text-gray-800">Alex Johnson</p>
365
+ <p class="text-xs text-gray-500">Senior Developer</p>
366
+ </div>
367
+ </div>
368
+ <span class="text-sm text-blue-500 font-medium">Programming</span>
369
+ </div>
370
+ </div>
371
+ </div>
372
+
373
+ <!-- Article 4 -->
374
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.2s;">
375
+ <div class="h-48 bg-cover bg-center" style="background-image: url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80');"></div>
376
+ <div class="p-6">
377
+ <div class="flex items-center mb-3">
378
+ <span class="text-gray-500 text-sm">10 min read</span>
379
+ </div>
380
+ <h3 class="text-xl font-bold text-gray-800 mb-3">The Geopolitics of Semiconductor Manufacturing</h3>
381
+ <p class="text-gray-600 mb-4">
382
+ How the global chip shortage has become a focal point in US-China relations and what it means for tech sovereignty.
383
+ </p>
384
+ <div class="flex items-center justify-between">
385
+ <div class="flex items-center">
386
+ <div class="w-8 h-8 bg-gray-300 rounded-full"></div>
387
+ <div class="ml-2">
388
+ <p class="text-sm font-medium text-gray-800">Priya Patel</p>
389
+ <p class="text-xs text-gray-500">Political Analyst</p>
390
+ </div>
391
+ </div>
392
+ <span class="text-sm text-blue-500 font-medium">Politics • Tech</span>
393
+ </div>
394
+ </div>
395
+ </div>
396
+
397
+ <!-- Article 5 -->
398
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in" style="animation-delay: 0.3s;">
399
+ <div class="h-48 bg-cover bg-center" style="background-image: url('https://images.unsplash.com/photo-1620641788421-7a1c342ea42e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80');"></div>
400
+ <div class="p-6">
401
+ <div class="flex items-center mb-3">
402
+ <span class="text-gray-500 text-sm">7 min read</span>
403
+ </div>
404
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Zero Trust Security: Implementation Strategies</h3>
405
+ <p class="text-gray-600 mb-4">
406
+ Practical steps for organizations transitioning to a Zero Trust architecture in an era of sophisticated cyber threats.
407
+ </p>
408
+ <div class="flex items-center justify-between">
409
+ <div class="flex items-center">
410
+ <div class="w-8 h-8 bg-gray-300 rounded-full"></div>
411
+ <div class="ml-2">
412
+ <p class="text-sm font-medium text-gray-800">David Kim</p>
413
+ <p class="text-xs text-gray-500">Security Consultant</p>
414
+ </div>
415
+ </div>
416
+ <span class="text-sm text-blue-500 font-medium">Cybersecurity</span>
417
+ </div>
418
+ </div>
419
+ </div>
420
+ </div>
421
+
422
+ <div class="text-center mt-12">
423
+ <button class="border border-blue-500 text-blue-500 px-6 py-3 rounded-full font-medium hover:bg-blue-50 transition">
424
+ View All Trending Articles
425
+ </button>
426
+ </div>
427
+ </div>
428
+ </section>
429
+
430
+ <!-- Store Section -->
431
+ <section id="store" class="py-16 bg-white">
432
+ <div class="container mx-auto px-4">
433
+ <div class="text-center mb-12 fade-in">
434
+ <h2 class="text-3xl font-bold text-gray-800 mb-3">Sigma <span class="gradient-text">Store</span></h2>
435
+ <p class="text-gray-600 max-w-2xl mx-auto">
436
+ Premium digital and physical goods for thinkers and builders
437
+ </p>
438
+ </div>
439
+
440
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
441
+ <!-- Digital Product 1 -->
442
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
443
+ <div class="h-48 bg-gradient-to-r from-blue-500 to-purple-500 flex items-center justify-center">
444
+ <i class="fas fa-book-open text-white text-6xl"></i>
445
+ </div>
446
+ <div class="p-6">
447
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Premium Research Papers</h3>
448
+ <p class="text-gray-600 mb-4">
449
+ In-depth analysis reports on emerging technologies and geopolitical trends.
450
+ </p>
451
+ <div class="flex justify-between items-center">
452
+ <span class="text-lg font-bold text-gray-800">$29.99</span>
453
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition">
454
+ Add to Cart
455
+ </button>
456
+ </div>
457
+ </div>
458
+ </div>
459
+
460
+ <!-- Digital Product 2 -->
461
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
462
+ <div class="h-48 bg-gradient-to-r from-green-500 to-teal-500 flex items-center justify-center">
463
+ <i class="fas fa-video text-white text-6xl"></i>
464
+ </div>
465
+ <div class="p-6">
466
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Video Courses</h3>
467
+ <p class="text-gray-600 mb-4">
468
+ Expert-led courses on cybersecurity, AI ethics, and political analysis.
469
+ </p>
470
+ <div class="flex justify-between items-center">
471
+ <span class="text-lg font-bold text-gray-800">$99.99</span>
472
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition">
473
+ Add to Cart
474
+ </button>
475
+ </div>
476
+ </div>
477
+ </div>
478
+
479
+ <!-- Physical Product 1 -->
480
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
481
+ <div class="h-48 bg-gradient-to-r from-amber-500 to-orange-500 flex items-center justify-center">
482
+ <i class="fas fa-tshirt text-white text-6xl"></i>
483
+ </div>
484
+ <div class="p-6">
485
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Sigma Apparel</h3>
486
+ <p class="text-gray-600 mb-4">
487
+ Premium quality t-shirts and hoodies with minimalist Sigma designs.
488
+ </p>
489
+ <div class="flex justify-between items-center">
490
+ <span class="text-lg font-bold text-gray-800">$34.99</span>
491
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition">
492
+ Add to Cart
493
+ </button>
494
+ </div>
495
+ </div>
496
+ </div>
497
+
498
+ <!-- Physical Product 2 -->
499
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
500
+ <div class="h-48 bg-gradient-to-r from-red-500 to-pink-500 flex items-center justify-center">
501
+ <i class="fas fa-mug-hot text-white text-6xl"></i>
502
+ </div>
503
+ <div class="p-6">
504
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Sigma Mug</h3>
505
+ <p class="text-gray-600 mb-4">
506
+ Ceramic mug with the Sigma logo - perfect for your morning coffee.
507
+ </p>
508
+ <div class="flex justify-between items-center">
509
+ <span class="text-lg font-bold text-gray-800">$19.99</span>
510
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition">
511
+ Add to Cart
512
+ </button>
513
+ </div>
514
+ </div>
515
+ </div>
516
+
517
+ <!-- Subscription -->
518
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
519
+ <div class="h-48 bg-gradient-to-r from-gray-800 to-gray-600 flex items-center justify-center">
520
+ <i class="fas fa-gem text-white text-6xl"></i>
521
+ </div>
522
+ <div class="p-6">
523
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Premium Membership</h3>
524
+ <p class="text-gray-600 mb-4">
525
+ Unlimited access to all content, exclusive reports, and member discounts.
526
+ </p>
527
+ <div class="flex justify-between items-center">
528
+ <span class="text-lg font-bold text-gray-800">$9.99/mo</span>
529
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition">
530
+ Subscribe
531
+ </button>
532
+ </div>
533
+ </div>
534
+ </div>
535
+
536
+ <!-- Gift Card -->
537
+ <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover fade-in">
538
+ <div class="h-48 bg-gradient-to-r from-purple-500 to-indigo-500 flex items-center justify-center">
539
+ <i class="fas fa-gift text-white text-6xl"></i>
540
+ </div>
541
+ <div class="p-6">
542
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Gift Card</h3>
543
+ <p class="text-gray-600 mb-4">
544
+ Give the gift of knowledge with a Sigma Trial digital gift card.
545
+ </p>
546
+ <div class="flex justify-between items-center">
547
+ <select class="border rounded-lg px-2 py-1">
548
+ <option>$25</option>
549
+ <option>$50</option>
550
+ <option>$100</option>
551
+ </select>
552
+ <button class="bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition">
553
+ Purchase
554
+ </button>
555
+ </div>
556
+ </div>
557
+ </div>
558
+ </div>
559
+ </div>
560
+ </section>
561
+
562
+ <!-- Newsletter Section -->
563
+ <section class="py-16 bg-gradient-to-r from-blue-500 to-green-500 text-white">
564
+ <div class="container mx-auto px-4 text-center">
565
+ <div class="max-w-2xl mx-auto fade-in">
566
+ <h2 class="text-3xl font-bold mb-4">Stay Updated with Sigma Trial</h2>
567
+ <p class="text-xl mb-8 opacity-90">
568
+ Get our most insightful articles delivered directly to your inbox twice a week.
569
+ </p>
570
+ <div class="flex flex-col sm:flex-row gap-4 max-w-lg mx-auto">
571
+ <input type="email" placeholder="Your email address" class="flex-grow px-4 py-3 rounded-lg text-gray-800 focus:outline-none focus:ring-2 focus:ring-white">
572
+ <button class="bg-white text-blue-600 px-6 py-3 rounded-lg font-bold hover:bg-gray-100 transition">
573
+ Subscribe Now
574
+ </button>
575
+ </div>
576
+ <p class="text-sm mt-4 opacity-75">
577
+ We respect your privacy. Unsubscribe at any time.
578
+ </p>
579
+ </div>
580
+ </div>
581
+ </section>
582
+
583
+ <!-- About Section -->
584
+ <section id="about" class="py-16 bg-white">
585
+ <div class="container mx-auto px-4">
586
+ <div class="flex flex-col md:flex-row items-center">
587
+ <div class="md:w-1/2 mb-10 md:mb-0 fade-in">
588
+ <h2 class="text-3xl font-bold text-gray-800 mb-6">About <span class="gradient-text">Sigma Trial</span></h2>
589
+ <p class="text-gray-600 mb-4">
590
+ Founded in 2022, Sigma Trial was created to fill the gap in high-quality, analytical content covering the intersection of technology, policy, and economics.
591
+ </p>
592
+ <p class="text-gray-600 mb-4">
593
+ Our team of experts brings decades of combined experience across industries to deliver insights you won't find anywhere else.
594
+ </p>
595
+ <p class="text-gray-600 mb-6">
596
+ We believe in data-driven analysis, clear communication of complex ideas, and maintaining intellectual independence from corporate or political influences.
597
+ </p>
598
+ <button class="bg-gradient-to-r from-blue-500 to-green-500 text-white px-6 py-3 rounded-full font-medium hover:opacity-90 transition">
599
+ Meet Our Team
600
+ </button>
601
+ </div>
602
+ <div class="md:w-1/2 md:pl-12 fade-in">
603
+ <div class="grid grid-cols-2 gap-4">
604
+ <div class="bg-blue-50 p-6 rounded-xl">
605
+ <div class="w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center mb-4">
606
+ <i class="fas fa-users text-blue-500 text-xl"></i>
607
+ </div>
608
+ <h3 class="text-xl font-bold text-gray-800 mb-2">250K+</h3>
609
+ <p class="text-gray-600">Monthly Readers</p>
610
+ </div>
611
+ <div class="bg-green-50 p-6 rounded-xl">
612
+ <div class="w-12 h-12 bg-green-100 rounded-full flex items-center justify-center mb-4">
613
+ <i class="fas fa-file-alt text-green-500 text-xl"></i>
614
+ </div>
615
+ <h3 class="text-xl font-bold text-gray-800 mb-2">1.2K+</h3>
616
+ <p class="text-gray-600">Published Articles</p>
617
+ </div>
618
+ <div class="bg-purple-50 p-6 rounded-xl">
619
+ <div class="w-12 h-12 bg-purple-100 rounded-full flex items-center justify-center mb-4">
620
+ <i class="fas fa-globe text-purple-500 text-xl"></i>
621
+ </div>
622
+ <h3 class="text-xl font-bold text-gray-800 mb-2">150+</h3>
623
+ <p class="text-gray-600">Countries Reached</p>
624
+ </div>
625
+ <div class="bg-yellow-50 p-6 rounded-xl">
626
+ <div class="w-12 h-12 bg-yellow-100 rounded-full flex items-center justify-center mb-4">
627
+ <i class="fas fa-medal text-yellow-500 text-xl"></i>
628
+ </div>
629
+ <h3 class="text-xl font-bold text-gray-800 mb-2">25+</h3>
630
+ <p class="text-gray-600">Industry Awards</p>
631
+ </div>
632
+ </div>
633
+ </div>
634
+ </div>
635
+ </div>
636
+ </section>
637
+
638
+ <!-- Footer -->
639
+ <footer class="bg-gray-900 text-white py-12">
640
+ <div class="container mx-auto px-4">
641
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
642
+ <div>
643
+ <div class="flex items-center space-x-2 mb-4">
644
+ <div class="w-10 h-10 bg-gradient-to-r from-blue-500 to-green-500 rounded-full flex items-center justify-center">
645
+ <span class="text-white font-bold text-xl">Σ</span>
646
+ </div>
647
+ <h3 class="text-xl font-bold">Sigma Trial</h3>
648
+ </div>
649
+ <p class="text-gray-400 mb-4">
650
+ Delivering cutting-edge analysis at the intersection of technology, policy, and economics.
651
+ </p>
652
+ <div class="flex space-x-4">
653
+ <a href="#" class="text-gray-400 hover:text-white transition">
654
+ <i class="fab fa-twitter text-xl"></i>
655
+ </a>
656
+ <a href="#" class="text-gray-400 hover:text-white transition">
657
+ <i class="fab fa-linkedin text-xl"></i>
658
+ </a>
659
+ <a href="#" class="text-gray-400 hover:text-white transition">
660
+ <i class="fab fa-facebook text-xl"></i>
661
+ </a>
662
+ <a href="#" class="text-gray-400 hover:text-white transition">
663
+ <i class="fab fa-instagram text-xl"></i>
664
+ </a>
665
+ </div>
666
+ </div>
667
+
668
+ <div>
669
+ <h4 class="text-lg font-bold mb-4">Categories</h4>
670
+ <ul class="space-y-2">
671
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Politics</a></li>
672
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Economics</a></li>
673
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Artificial Intelligence</a></li>
674
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Cybersecurity</a></li>
675
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Programming & Tech</a></li>
676
+ <li><a href="#" class="text-gray-400 hover:text-white transition">History</a></li>
677
+ <li><a href="#store" class="text-gray-400 hover:text-white transition">Store</a></li>
678
+ </ul>
679
+ </div>
680
+
681
+ <div>
682
+ <h4 class="text-lg font-bold mb-4">Company</h4>
683
+ <ul class="space-y-2">
684
+ <li><a href="#" class="text-gray-400 hover:text-white transition">About Us</a></li>
685
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Our Team</a></li>
686
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Careers</a></li>
687
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Contact</a></li>
688
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Advertise</a></li>
689
+ </ul>
690
+ </div>
691
+
692
+ <div>
693
+ <h4 class="text-lg font-bold mb-4">Legal</h4>
694
+ <ul class="space-y-2">
695
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Terms of Service</a></li>
696
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Privacy Policy</a></li>
697
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Cookie Policy</a></li>
698
+ <li><a href="#" class="text-gray-400 hover:text-white transition">GDPR Compliance</a></li>
699
+ </ul>
700
+ </div>
701
+ </div>
702
+
703
+ <div class="border-t border-gray-800 pt-8 flex flex-col md:flex-row justify-between items-center">
704
+ <p class="text-gray-400 mb-4 md:mb-0">
705
+ © 2023 Sigma Trial. All rights reserved.
706
+ </p>
707
+ <div class="flex space-x-6">
708
+ <a href="#" class="text-gray-400 hover:text-white transition">Sitemap</a>
709
+ <a href="#" class="text-gray-400 hover:text-white transition">Accessibility</a>
710
+ <a href="#" class="text-gray-400 hover:text-white transition">FAQ</a>
711
+ </div>
712
+ </div>
713
+ </div>
714
+ </footer>
715
+
716
+ <script>
717
+ // Mobile menu toggle
718
+ const mobileMenuButton = document.getElementById('mobile-menu-button');
719
+ const mobileMenu = document.getElementById('mobile-menu');
720
+
721
+ mobileMenuButton.addEventListener('click', () => {
722
+ mobileMenu.classList.toggle('hidden');
723
+ });
724
+
725
+ // Smooth scrolling for anchor links
726
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
727
+ anchor.addEventListener('click', function (e) {
728
+ e.preventDefault();
729
+
730
+ const targetId = this.getAttribute('href');
731
+ if (targetId === '#') return;
732
+
733
+ const targetElement = document.querySelector(targetId);
734
+ if (targetElement) {
735
+ targetElement.scrollIntoView({
736
+ behavior: 'smooth'
737
+ });
738
+
739
+ // Close mobile menu if open
740
+ if (!mobileMenu.classList.contains('hidden')) {
741
+ mobileMenu.classList.add('hidden');
742
+ }
743
+ }
744
+ });
745
+ });
746
+
747
+ // Add fade-in animation to elements as they come into view
748
+ const fadeElements = document.querySelectorAll('.fade-in');
749
+
750
+ const fadeInObserver = new IntersectionObserver((entries) => {
751
+ entries.forEach(entry => {
752
+ if (entry.isIntersecting) {
753
+ entry.target.classList.add('animate-fadeIn');
754
+ }
755
+ });
756
+ }, {
757
+ threshold: 0.1
758
+ });
759
+
760
+ fadeElements.forEach(element => {
761
+ fadeInObserver.observe(element);
762
+ });
763
+ </script>
764
+ <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=Xcoder2020/sigma-trial-2" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
765
+ </html>