Prithvie commited on
Commit
9ec71ce
·
verified ·
1 Parent(s): cd13eeb

Create a website that acts as a news site for programmers and developers that provides day to day updates regarding the latest progress and developments in the AI field. Make the UI clean and dark with a dark blue hue.

Browse files
Files changed (2) hide show
  1. README.md +7 -4
  2. index.html +344 -18
README.md CHANGED
@@ -1,10 +1,13 @@
1
  ---
2
- title: Ai Dev Dispatch
3
- emoji: 📚
4
- colorFrom: yellow
5
  colorTo: red
 
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: AI Dev Dispatch 📰
3
+ colorFrom: red
 
4
  colorTo: red
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,345 @@
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>AI Dev Dispatch - Latest AI News for Developers</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script>
10
+ tailwind.config = {
11
+ theme: {
12
+ extend: {
13
+ colors: {
14
+ primary: '#1E3A8A',
15
+ secondary: '#3B82F6',
16
+ accent: '#10B981',
17
+ }
18
+ }
19
+ }
20
+ }
21
+ </script>
22
+ <script src="https://unpkg.com/feather-icons"></script>
23
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
24
+ <style>
25
+ .article-card:hover {
26
+ transform: translateY(-4px);
27
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
28
+ }
29
+ .gradient-bg {
30
+ background: linear-gradient(135deg, #1E3A8A 0%, #111827 100%);
31
+ }
32
+ </style>
33
+ </head>
34
+ <body class="bg-gray-900 text-gray-100 font-sans">
35
+ <!-- Navigation -->
36
+ <nav class="bg-primary sticky top-0 z-50 shadow-lg">
37
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
38
+ <div class="flex items-center space-x-2">
39
+ <i data-feather="cpu" class="text-accent"></i>
40
+ <span class="text-xl font-bold">AI Dev Dispatch</span>
41
+ </div>
42
+ <div class="hidden md:flex space-x-6">
43
+ <a href="#" class="hover:text-accent transition">Home</a>
44
+ <a href="#" class="hover:text-accent transition">Trending</a>
45
+ <a href="#" class="hover:text-accent transition">Categories</a>
46
+ <a href="#" class="hover:text-accent transition">Bookmarks</a>
47
+ <a href="#" class="hover:text-accent transition">Newsletter</a>
48
+ </div>
49
+ <div class="flex items-center space-x-4">
50
+ <button class="p-2 rounded-full hover:bg-gray-800 transition">
51
+ <i data-feather="search"></i>
52
+ </button>
53
+ <button class="p-2 rounded-full hover:bg-gray-800 transition">
54
+ <i data-feather="user"></i>
55
+ </button>
56
+ <button class="p-2 rounded-full hover:bg-gray-800 transition">
57
+ <i data-feather="moon"></i>
58
+ </button>
59
+ </div>
60
+ </div>
61
+ </nav>
62
+
63
+ <!-- Hero Section -->
64
+ <header class="gradient-bg py-16">
65
+ <div class="container mx-auto px-4 text-center">
66
+ <h1 class="text-4xl md:text-5xl font-bold mb-4">Daily AI News for Developers</h1>
67
+ <p class="text-xl text-gray-300 mb-8 max-w-2xl mx-auto">Stay ahead with the latest breakthroughs, frameworks, and research in artificial intelligence.</p>
68
+ <div class="flex flex-col sm:flex-row justify-center gap-4">
69
+ <button class="bg-accent hover:bg-green-500 text-white font-semibold px-6 py-3 rounded-lg transition flex items-center justify-center">
70
+ <i data-feather="zap" class="mr-2"></i> Trending Stories
71
+ </button>
72
+ <button class="bg-secondary hover:bg-blue-500 text-white font-semibold px-6 py-3 rounded-lg transition flex items-center justify-center">
73
+ <i data-feather="mail" class="mr-2"></i> Subscribe
74
+ </button>
75
+ </div>
76
+ </div>
77
+ </header>
78
+
79
+ <!-- Main Content -->
80
+ <main class="container mx-auto px-4 py-12">
81
+ <!-- Top Stories Carousel -->
82
+ <section class="mb-16">
83
+ <h2 class="text-2xl font-bold mb-6 flex items-center">
84
+ <i data-feather="trending-up" class="mr-2 text-accent"></i> Top Stories
85
+ </h2>
86
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
87
+ <!-- Featured Story 1 -->
88
+ <div class="bg-gray-800 rounded-xl overflow-hidden shadow-lg article-card transition duration-300">
89
+ <img src="http://static.photos/technology/640x360/1" alt="AI Technology" class="w-full h-48 object-cover">
90
+ <div class="p-6">
91
+ <div class="flex items-center text-sm text-gray-400 mb-2">
92
+ <span>Today</span>
93
+ <span class="mx-2">•</span>
94
+ <span>8 min read</span>
95
+ </div>
96
+ <h3 class="text-xl font-bold mb-2">New TensorFlow 3.0 Released with Quantum Computing Support</h3>
97
+ <p class="text-gray-400 mb-4">Google announces major update to their flagship ML framework with breakthrough performance improvements.</p>
98
+ <div class="flex justify-between items-center">
99
+ <span class="text-sm bg-primary rounded-full px-3 py-1">Machine Learning</span>
100
+ <button class="text-accent hover:text-green-400 transition">
101
+ <i data-feather="bookmark"></i>
102
+ </button>
103
+ </div>
104
+ </div>
105
+ </div>
106
+
107
+ <!-- Featured Story 2 -->
108
+ <div class="bg-gray-800 rounded-xl overflow-hidden shadow-lg article-card transition duration-300">
109
+ <img src="http://static.photos/science/640x360/2" alt="AI Research" class="w-full h-48 object-cover">
110
+ <div class="p-6">
111
+ <div class="flex items-center text-sm text-gray-400 mb-2">
112
+ <span>2 hours ago</span>
113
+ <span class="mx-2">•</span>
114
+ <span>5 min read</span>
115
+ </div>
116
+ <h3 class="text-xl font-bold mb-2">OpenAI Unveils GPT-5: Human-Level Reasoning Achieved</h3>
117
+ <p class="text-gray-400 mb-4">The newest iteration shows remarkable improvements in logical reasoning and context retention.</p>
118
+ <div class="flex justify-between items-center">
119
+ <span class="text-sm bg-primary rounded-full px-3 py-1">NLP</span>
120
+ <button class="text-accent hover:text-green-400 transition">
121
+ <i data-feather="bookmark"></i>
122
+ </button>
123
+ </div>
124
+ </div>
125
+ </div>
126
+
127
+ <!-- Featured Story 3 -->
128
+ <div class="bg-gray-800 rounded-xl overflow-hidden shadow-lg article-card transition duration-300">
129
+ <img src="http://static.photos/technology/640x360/3" alt="AI Ethics" class="w-full h-48 object-cover">
130
+ <div class="p-6">
131
+ <div class="flex items-center text-sm text-gray-400 mb-2">
132
+ <span>Yesterday</span>
133
+ <span class="mx-2">•</span>
134
+ <span>10 min read</span>
135
+ </div>
136
+ <h3 class="text-xl font-bold mb-2">EU Passes Groundbreaking AI Regulation Act</h3>
137
+ <p class="text-gray-400 mb-4">New legislation sets global precedent for ethical AI development and deployment.</p>
138
+ <div class="flex justify-between items-center">
139
+ <span class="text-sm bg-primary rounded-full px-3 py-1">Policy</span>
140
+ <button class="text-accent hover:text-green-400 transition">
141
+ <i data-feather="bookmark"></i>
142
+ </button>
143
+ </div>
144
+ </div>
145
+ </div>
146
+ </div>
147
+ </section>
148
+
149
+ <!-- Latest News Section -->
150
+ <section>
151
+ <div class="flex justify-between items-center mb-6">
152
+ <h2 class="text-2xl font-bold flex items-center">
153
+ <i data-feather="clock" class="mr-2 text-accent"></i> Latest Updates
154
+ </h2>
155
+ <div class="flex space-x-2">
156
+ <button class="px-3 py-1 rounded-lg bg-primary text-sm">All</button>
157
+ <button class="px-3 py-1 rounded-lg bg-gray-800 text-sm hover:bg-gray-700 transition">ML</button>
158
+ <button class="px-3 py-1 rounded-lg bg-gray-800 text-sm hover:bg-gray-700 transition">NLP</button>
159
+ <button class="px-3 py-1 rounded-lg bg-gray-800 text-sm hover:bg-gray-700 transition">CV</button>
160
+ <button class="px-3 py-1 rounded-lg bg-gray-800 text-sm hover:bg-gray-700 transition">Robotics</button>
161
+ </div>
162
+ </div>
163
+
164
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
165
+ <!-- Article 1 -->
166
+ <div class="bg-gray-800 rounded-lg p-6 article-card transition duration-300">
167
+ <div class="flex justify-between items-start mb-4">
168
+ <span class="text-sm bg-primary rounded-full px-3 py-1">Research</span>
169
+ <button class="text-gray-400 hover:text-white transition">
170
+ <i data-feather="bookmark"></i>
171
+ </button>
172
+ </div>
173
+ <h3 class="text-lg font-semibold mb-2">Meta Releases Llama 3 with 1T Parameters</h3>
174
+ <p class="text-gray-400 text-sm mb-4">Open weights model outperforms GPT-4 in several benchmarks while being more efficient.</p>
175
+ <div class="flex justify-between items-center text-sm text-gray-500">
176
+ <span>45 min ago</span>
177
+ <span>7 min read</span>
178
+ </div>
179
+ </div>
180
+
181
+ <!-- Article 2 -->
182
+ <div class="bg-gray-800 rounded-lg p-6 article-card transition duration-300">
183
+ <div class="flex justify-between items-start mb-4">
184
+ <span class="text-sm bg-secondary rounded-full px-3 py-1">Tools</span>
185
+ <button class="text-gray-400 hover:text-white transition">
186
+ <i data-feather="bookmark"></i>
187
+ </button>
188
+ </div>
189
+ <h3 class="text-lg font-semibold mb-2">VSCode AI Copilot Now Free for Students</h3>
190
+ <p class="text-gray-400 text-sm mb-4">Microsoft extends free access to their AI coding assistant for educational institutions.</p>
191
+ <div class="flex justify-between items-center text-sm text-gray-500">
192
+ <span>2 hours ago</span>
193
+ <span>4 min read</span>
194
+ </div>
195
+ </div>
196
+
197
+ <!-- Article 3 -->
198
+ <div class="bg-gray-800 rounded-lg p-6 article-card transition duration-300">
199
+ <div class="flex justify-between items-start mb-4">
200
+ <span class="text-sm bg-accent rounded-full px-3 py-1">Startups</span>
201
+ <button class="text-gray-400 hover:text-white transition">
202
+ <i data-feather="bookmark"></i>
203
+ </button>
204
+ </div>
205
+ <h3 class="text-lg font-semibold mb-2">Anthropic Raises $5B at $45B Valuation</h3>
206
+ <p class="text-gray-400 text-sm mb-4">Series F round led by Amazon as the AI race intensifies.</p>
207
+ <div class="flex justify-between items-center text-sm text-gray-500">
208
+ <span>3 hours ago</span>
209
+ <span>6 min read</span>
210
+ </div>
211
+ </div>
212
+
213
+ <!-- Article 4 -->
214
+ <div class="bg-gray-800 rounded-lg p-6 article-card transition duration-300">
215
+ <div class="flex justify-between items-start mb-4">
216
+ <span class="text-sm bg-primary rounded-full px-3 py-1">ML</span>
217
+ <button class="text-gray-400 hover:text-white transition">
218
+ <i data-feather="bookmark"></i>
219
+ </button>
220
+ </div>
221
+ <h3 class="text-lg font-semibold mb-2">New Paper: 10x Faster Training with Sparse Attention</h3>
222
+ <p class="text-gray-400 text-sm mb-4">Stanford researchers achieve breakthrough in transformer efficiency without accuracy loss.</p>
223
+ <div class="flex justify-between items-center text-sm text-gray-500">
224
+ <span>5 hours ago</span>
225
+ <span>8 min read</span>
226
+ </div>
227
+ </div>
228
+
229
+ <!-- Article 5 -->
230
+ <div class="bg-gray-800 rounded-lg p-6 article-card transition duration-300">
231
+ <div class="flex justify-between items-start mb-4">
232
+ <span class="text-sm bg-secondary rounded-full px-3 py-1">NLP</span>
233
+ <button class="text-gray-400 hover:text-white transition">
234
+ <i data-feather="bookmark"></i>
235
+ </button>
236
+ </div>
237
+ <h3 class="text-lg font-semibold mb-2">Multilingual BERT for Low-Resource Languages</h3>
238
+ <p class="text-gray-400 text-sm mb-4">New technique improves performance for languages with limited training data.</p>
239
+ <div class="flex justify-between items-center text-sm text-gray-500">
240
+ <span>7 hours ago</span>
241
+ <span>5 min read</span>
242
+ </div>
243
+ </div>
244
+
245
+ <!-- Article 6 -->
246
+ <div class="bg-gray-800 rounded-lg p-6 article-card transition duration-300">
247
+ <div class="flex justify-between items-start mb-4">
248
+ <span class="text-sm bg-accent rounded-full px-3 py-1">Tutorial</span>
249
+ <button class="text-gray-400 hover:text-white transition">
250
+ <i data-feather="bookmark"></i>
251
+ </button>
252
+ </div>
253
+ <h3 class="text-lg font-semibold mb-2">Deploying LLMs on Edge Devices</h3>
254
+ <p class="text-gray-400 text-sm mb-4">Step-by-step guide to optimizing large language models for mobile and IoT applications.</p>
255
+ <div class="flex justify-between items-center text-sm text-gray-500">
256
+ <span>9 hours ago</span>
257
+ <span>12 min read</span>
258
+ </div>
259
+ </div>
260
+ </div>
261
+
262
+ <div class="text-center mt-10">
263
+ <button class="border border-primary text-primary hover:bg-primary hover:text-white px-6 py-3 rounded-lg transition font-medium">
264
+ Load More Stories
265
+ </button>
266
+ </div>
267
+ </section>
268
+ </main>
269
+
270
+ <!-- Newsletter Section -->
271
+ <section class="gradient-bg py-16 mt-16">
272
+ <div class="container mx-auto px-4 text-center">
273
+ <div class="max-w-2xl mx-auto">
274
+ <h2 class="text-2xl md:text-3xl font-bold mb-4">Get AI Updates in Your Inbox</h2>
275
+ <p class="text-gray-300 mb-6">Join 50,000+ developers receiving the most important AI news and tutorials weekly.</p>
276
+ <div class="flex flex-col sm:flex-row gap-4">
277
+ <input type="email" placeholder="Your email address" class="flex-grow px-4 py-3 rounded-lg bg-gray-800 border border-gray-700 focus:outline-none focus:ring-2 focus:ring-accent">
278
+ <button class="bg-accent hover:bg-green-500 text-white font-semibold px-6 py-3 rounded-lg transition">
279
+ Subscribe
280
+ </button>
281
+ </div>
282
+ <p class="text-gray-400 text-xs mt-3">No spam. Unsubscribe anytime.</p>
283
+ </div>
284
+ </div>
285
+ </section>
286
+
287
+ <!-- Footer -->
288
+ <footer class="bg-gray-800 py-12">
289
+ <div class="container mx-auto px-4">
290
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
291
+ <div>
292
+ <div class="flex items-center space-x-2 mb-4">
293
+ <i data-feather="cpu" class="text-accent"></i>
294
+ <span class="text-xl font-bold">AI Dev Dispatch</span>
295
+ </div>
296
+ <p class="text-gray-400">Your daily source for AI breakthroughs, tools, and research.</p>
297
+ <div class="flex space-x-4 mt-4">
298
+ <a href="#" class="text-gray-400 hover:text-accent transition"><i data-feather="twitter"></i></a>
299
+ <a href="#" class="text-gray-400 hover:text-accent transition"><i data-feather="github"></i></a>
300
+ <a href="#" class="text-gray-400 hover:text-accent transition"><i data-feather="linkedin"></i></a>
301
+ <a href="#" class="text-gray-400 hover:text-accent transition"><i data-feather="rss"></i></a>
302
+ </div>
303
+ </div>
304
+ <div>
305
+ <h3 class="font-bold mb-4">Categories</h3>
306
+ <ul class="space-y-2">
307
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Machine Learning</a></li>
308
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Natural Language Processing</a></li>
309
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Computer Vision</a></li>
310
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Robotics</a></li>
311
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">AI Ethics</a></li>
312
+ </ul>
313
+ </div>
314
+ <div>
315
+ <h3 class="font-bold mb-4">Resources</h3>
316
+ <ul class="space-y-2">
317
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Developer Tools</a></li>
318
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Research Papers</a></li>
319
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Datasets</a></li>
320
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Tutorials</a></li>
321
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Podcasts</a></li>
322
+ </ul>
323
+ </div>
324
+ <div>
325
+ <h3 class="font-bold mb-4">Company</h3>
326
+ <ul class="space-y-2">
327
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">About Us</a></li>
328
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Careers</a></li>
329
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Contact</a></li>
330
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Privacy Policy</a></li>
331
+ <li><a href="#" class="text-gray-400 hover:text-accent transition">Terms of Service</a></li>
332
+ </ul>
333
+ </div>
334
+ </div>
335
+ <div class="border-t border-gray-700 mt-10 pt-6 text-center text-gray-500 text-sm">
336
+ <p>© 2023 AI Dev Dispatch. All rights reserved.</p>
337
+ </div>
338
+ </div>
339
+ </footer>
340
+
341
+ <script>
342
+ feather.replace();
343
+ </script>
344
+ </body>
345
  </html>