ReRaWo commited on
Commit
bd602c4
·
verified ·
1 Parent(s): a5c61ef

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +1408 -19
index.html CHANGED
@@ -1,19 +1,1408 @@
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="zh-CN">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>论文雷达 - 前沿论文自动化爬取解析系统</title>
7
+ <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
8
+ <style>
9
+ :root {
10
+ --primary-color: #6366f1;
11
+ --primary-dark: #4f46e5;
12
+ --primary-light: #818cf8;
13
+ --secondary-color: #06b6d4;
14
+ --accent-color: #f59e0b;
15
+ --bg-dark: #0f172a;
16
+ --bg-card: #1e293b;
17
+ --bg-card-hover: #334155;
18
+ --text-primary: #f1f5f9;
19
+ --text-secondary: #94a3b8;
20
+ --text-muted: #64748b;
21
+ --border-color: #334155;
22
+ --success: #10b981;
23
+ --warning: #f59e0b;
24
+ --error: #ef4444;
25
+ --shadow-lg: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
26
+ --shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
27
+ --gradient-main: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
28
+ }
29
+
30
+ * {
31
+ margin: 0;
32
+ padding: 0;
33
+ box-sizing: border-box;
34
+ }
35
+
36
+ body {
37
+ font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
38
+ background: var(--bg-dark);
39
+ color: var(--text-primary);
40
+ min-height: 100vh;
41
+ overflow-x: hidden;
42
+ }
43
+
44
+ /* Header */
45
+ .header {
46
+ background: rgba(15, 23, 42, 0.95);
47
+ backdrop-filter: blur(10px);
48
+ border-bottom: 1px solid var(--border-color);
49
+ padding: 1rem 2rem;
50
+ position: fixed;
51
+ top: 0;
52
+ left: 0;
53
+ right: 0;
54
+ z-index: 1000;
55
+ display: flex;
56
+ justify-content: space-between;
57
+ align-items: center;
58
+ }
59
+
60
+ .logo {
61
+ display: flex;
62
+ align-items: center;
63
+ gap: 0.75rem;
64
+ font-size: 1.5rem;
65
+ font-weight: 700;
66
+ background: var(--gradient-main);
67
+ -webkit-background-clip: text;
68
+ -webkit-text-fill-color: transparent;
69
+ background-clip: text;
70
+ }
71
+
72
+ .logo i {
73
+ -webkit-text-fill-color: var(--primary-light);
74
+ }
75
+
76
+ .logo span {
77
+ font-size: 0.85rem;
78
+ color: var(--text-secondary);
79
+ font-weight: 400;
80
+ margin-left: 0.5rem;
81
+ }
82
+
83
+ .header-actions {
84
+ display: flex;
85
+ gap: 1rem;
86
+ align-items: center;
87
+ }
88
+
89
+ .notification-btn {
90
+ position: relative;
91
+ background: transparent;
92
+ border: none;
93
+ color: var(--text-secondary);
94
+ font-size: 1.25rem;
95
+ cursor: pointer;
96
+ padding: 0.5rem;
97
+ border-radius: 0.5rem;
98
+ transition: all 0.3s;
99
+ }
100
+
101
+ .notification-btn:hover {
102
+ background: var(--bg-card);
103
+ color: var(--text-primary);
104
+ }
105
+
106
+ .notification-badge {
107
+ position: absolute;
108
+ top: 0;
109
+ right: 0;
110
+ background: var(--error);
111
+ color: white;
112
+ font-size: 0.65rem;
113
+ padding: 0.15rem 0.4rem;
114
+ border-radius: 1rem;
115
+ font-weight: 600;
116
+ }
117
+
118
+ .user-avatar {
119
+ width: 40px;
120
+ height: 40px;
121
+ border-radius: 50%;
122
+ background: var(--gradient-main);
123
+ display: flex;
124
+ align-items: center;
125
+ justify-content: center;
126
+ font-weight: 600;
127
+ cursor: pointer;
128
+ transition: transform 0.3s;
129
+ }
130
+
131
+ .user-avatar:hover {
132
+ transform: scale(1.05);
133
+ }
134
+
135
+ /* Main Layout */
136
+ .main-container {
137
+ display: flex;
138
+ margin-top: 73px;
139
+ min-height: calc(100vh - 73px);
140
+ }
141
+
142
+ /* Sidebar */
143
+ .sidebar {
144
+ width: 260px;
145
+ background: var(--bg-card);
146
+ border-right: 1px solid var(--border-color);
147
+ padding: 1.5rem;
148
+ position: fixed;
149
+ top: 73px;
150
+ bottom: 0;
151
+ left: 0;
152
+ overflow-y: auto;
153
+ transition: transform 0.3s ease;
154
+ }
155
+
156
+ .sidebar-section {
157
+ margin-bottom: 2rem;
158
+ }
159
+
160
+ .sidebar-title {
161
+ font-size: 0.75rem;
162
+ text-transform: uppercase;
163
+ letter-spacing: 0.1em;
164
+ color: var(--text-muted);
165
+ margin-bottom: 1rem;
166
+ font-weight: 600;
167
+ }
168
+
169
+ .nav-item {
170
+ display: flex;
171
+ align-items: center;
172
+ gap: 0.75rem;
173
+ padding: 0.75rem 1rem;
174
+ border-radius: 0.75rem;
175
+ color: var(--text-secondary);
176
+ cursor: pointer;
177
+ transition: all 0.3s;
178
+ margin-bottom: 0.25rem;
179
+ }
180
+
181
+ .nav-item:hover {
182
+ background: var(--bg-card-hover);
183
+ color: var(--text-primary);
184
+ }
185
+
186
+ .nav-item.active {
187
+ background: var(--gradient-main);
188
+ color: white;
189
+ }
190
+
191
+ .nav-item i {
192
+ width: 20px;
193
+ text-align: center;
194
+ }
195
+
196
+ .nav-item span {
197
+ flex: 1;
198
+ }
199
+
200
+ .nav-item .badge {
201
+ background: rgba(255, 255, 255, 0.2);
202
+ padding: 0.15rem 0.5rem;
203
+ border-radius: 1rem;
204
+ font-size: 0.7rem;
205
+ }
206
+
207
+ /* Content Area */
208
+ .content {
209
+ flex: 1;
210
+ margin-left: 260px;
211
+ padding: 2rem;
212
+ }
213
+
214
+ /* Search Section */
215
+ .search-section {
216
+ margin-bottom: 2rem;
217
+ }
218
+
219
+ .search-container {
220
+ background: var(--bg-card);
221
+ border-radius: 1rem;
222
+ padding: 1.5rem;
223
+ margin-bottom: 1.5rem;
224
+ border: 1px solid var(--border-color);
225
+ }
226
+
227
+ .search-header {
228
+ display: flex;
229
+ justify-content: space-between;
230
+ align-items: center;
231
+ margin-bottom: 1rem;
232
+ }
233
+
234
+ .search-title {
235
+ font-size: 1.25rem;
236
+ font-weight: 600;
237
+ }
238
+
239
+ .search-input-wrapper {
240
+ position: relative;
241
+ }
242
+
243
+ .search-input {
244
+ width: 100%;
245
+ padding: 1rem 1rem 1rem 3rem;
246
+ background: var(--bg-dark);
247
+ border: 2px solid var(--border-color);
248
+ border-radius: 0.75rem;
249
+ color: var(--text-primary);
250
+ font-size: 1rem;
251
+ transition: all 0.3s;
252
+ }
253
+
254
+ .search-input:focus {
255
+ outline: none;
256
+ border-color: var(--primary-color);
257
+ box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1);
258
+ }
259
+
260
+ .search-input::placeholder {
261
+ color: var(--text-muted);
262
+ }
263
+
264
+ .search-icon {
265
+ position: absolute;
266
+ left: 1rem;
267
+ top: 50%;
268
+ transform: translateY(-50%);
269
+ color: var(--text-muted);
270
+ font-size: 1.1rem;
271
+ }
272
+
273
+ .search-filters {
274
+ display: flex;
275
+ gap: 1rem;
276
+ margin-top: 1rem;
277
+ flex-wrap: wrap;
278
+ }
279
+
280
+ .filter-chip {
281
+ padding: 0.5rem 1rem;
282
+ background: var(--bg-dark);
283
+ border: 1px solid var(--border-color);
284
+ border-radius: 2rem;
285
+ font-size: 0.875rem;
286
+ color: var(--text-secondary);
287
+ cursor: pointer;
288
+ transition: all 0.3s;
289
+ display: flex;
290
+ align-items: center;
291
+ gap: 0.5rem;
292
+ }
293
+
294
+ .filter-chip:hover {
295
+ border-color: var(--primary-color);
296
+ color: var(--primary-light);
297
+ }
298
+
299
+ .filter-chip.active {
300
+ background: var(--primary-color);
301
+ border-color: var(--primary-color);
302
+ color: white;
303
+ }
304
+
305
+ .search-btn {
306
+ padding: 0.75rem 2rem;
307
+ background: var(--gradient-main);
308
+ border: none;
309
+ border-radius: 0.75rem;
310
+ color: white;
311
+ font-weight: 600;
312
+ cursor: pointer;
313
+ transition: all 0.3s;
314
+ display: flex;
315
+ align-items: center;
316
+ gap: 0.5rem;
317
+ }
318
+
319
+ .search-btn:hover {
320
+ transform: translateY(-2px);
321
+ box-shadow: 0 10px 20px rgba(99, 102, 241, 0.3);
322
+ }
323
+
324
+ /* Stats Grid */
325
+ .stats-grid {
326
+ display: grid;
327
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
328
+ gap: 1rem;
329
+ margin-bottom: 2rem;
330
+ }
331
+
332
+ .stat-card {
333
+ background: var(--bg-card);
334
+ border-radius: 1rem;
335
+ padding: 1.25rem;
336
+ border: 1px solid var(--border-color);
337
+ transition: all 0.3s;
338
+ }
339
+
340
+ .stat-card:hover {
341
+ transform: translateY(-4px);
342
+ box-shadow: var(--shadow-md);
343
+ }
344
+
345
+ .stat-icon {
346
+ width: 48px;
347
+ height: 48px;
348
+ border-radius: 0.75rem;
349
+ display: flex;
350
+ align-items: center;
351
+ justify-content: center;
352
+ font-size: 1.25rem;
353
+ margin-bottom: 1rem;
354
+ }
355
+
356
+ .stat-icon.blue {
357
+ background: rgba(99, 102, 241, 0.2);
358
+ color: var(--primary-light);
359
+ }
360
+
361
+ .stat-icon.cyan {
362
+ background: rgba(6, 182, 212, 0.2);
363
+ color: var(--secondary-color);
364
+ }
365
+
366
+ .stat-icon.amber {
367
+ background: rgba(245, 158, 11, 0.2);
368
+ color: var(--accent-color);
369
+ }
370
+
371
+ .stat-icon.green {
372
+ background: rgba(16, 185, 129, 0.2);
373
+ color: var(--success);
374
+ }
375
+
376
+ .stat-value {
377
+ font-size: 1.75rem;
378
+ font-weight: 700;
379
+ margin-bottom: 0.25rem;
380
+ }
381
+
382
+ .stat-label {
383
+ color: var(--text-secondary);
384
+ font-size: 0.875rem;
385
+ }
386
+
387
+ .stat-trend {
388
+ display: flex;
389
+ align-items: center;
390
+ gap: 0.25rem;
391
+ font-size: 0.75rem;
392
+ margin-top: 0.5rem;
393
+ }
394
+
395
+ .stat-trend.up {
396
+ color: var(--success);
397
+ }
398
+
399
+ .stat-trend.down {
400
+ color: var(--error);
401
+ }
402
+
403
+ /* Paper List */
404
+ .papers-section {
405
+ margin-bottom: 2rem;
406
+ }
407
+
408
+ .section-header {
409
+ display: flex;
410
+ justify-content: space-between;
411
+ align-items: center;
412
+ margin-bottom: 1.5rem;
413
+ }
414
+
415
+ .section-title {
416
+ font-size: 1.25rem;
417
+ font-weight: 600;
418
+ display: flex;
419
+ align-items: center;
420
+ gap: 0.5rem;
421
+ }
422
+
423
+ .view-toggle {
424
+ display: flex;
425
+ gap: 0.25rem;
426
+ background: var(--bg-card);
427
+ border-radius: 0.5rem;
428
+ padding: 0.25rem;
429
+ }
430
+
431
+ .view-btn {
432
+ padding: 0.5rem 0.75rem;
433
+ background: transparent;
434
+ border: none;
435
+ color: var(--text-muted);
436
+ border-radius: 0.375rem;
437
+ cursor: pointer;
438
+ transition: all 0.3s;
439
+ }
440
+
441
+ .view-btn.active {
442
+ background: var(--primary-color);
443
+ color: white;
444
+ }
445
+
446
+ .paper-list {
447
+ display: flex;
448
+ flex-direction: column;
449
+ gap: 1rem;
450
+ }
451
+
452
+ .paper-card {
453
+ background: var(--bg-card);
454
+ border-radius: 1rem;
455
+ padding: 1.5rem;
456
+ border: 1px solid var(--border-color);
457
+ transition: all 0.3s;
458
+ cursor: pointer;
459
+ }
460
+
461
+ .paper-card:hover {
462
+ border-color: var(--primary-color);
463
+ transform: translateX(4px);
464
+ box-shadow: -4px 0 0 var(--primary-color);
465
+ }
466
+
467
+ .paper-header {
468
+ display: flex;
469
+ justify-content: space-between;
470
+ align-items: flex-start;
471
+ margin-bottom: 1rem;
472
+ }
473
+
474
+ .paper-title {
475
+ font-size: 1.1rem;
476
+ font-weight: 600;
477
+ color: var(--text-primary);
478
+ line-height: 1.4;
479
+ flex: 1;
480
+ margin-right: 1rem;
481
+ }
482
+
483
+ .paper-status {
484
+ padding: 0.25rem 0.75rem;
485
+ border-radius: 2rem;
486
+ font-size: 0.75rem;
487
+ font-weight: 500;
488
+ white-space: nowrap;
489
+ }
490
+
491
+ .status-new {
492
+ background: rgba(16, 185, 129, 0.2);
493
+ color: var(--success);
494
+ }
495
+
496
+ .status-hot {
497
+ background: rgba(239, 68, 68, 0.2);
498
+ color: var(--error);
499
+ }
500
+
501
+ .status-analyzing {
502
+ background: rgba(245, 158, 11, 0.2);
503
+ color: var(--accent-color);
504
+ }
505
+
506
+ .paper-meta {
507
+ display: flex;
508
+ flex-wrap: wrap;
509
+ gap: 1rem;
510
+ margin-bottom: 1rem;
511
+ color: var(--text-secondary);
512
+ font-size: 0.875rem;
513
+ }
514
+
515
+ .paper-meta-item {
516
+ display: flex;
517
+ align-items: center;
518
+ gap: 0.5rem;
519
+ }
520
+
521
+ .paper-abstract {
522
+ color: var(--text-secondary);
523
+ font-size: 0.9rem;
524
+ line-height: 1.6;
525
+ display: -webkit-box;
526
+ -webkit-line-clamp: 2;
527
+ -webkit-box-orient: vertical;
528
+ overflow: hidden;
529
+ margin-bottom: 1rem;
530
+ }
531
+
532
+ .paper-tags {
533
+ display: flex;
534
+ flex-wrap: wrap;
535
+ gap: 0.5rem;
536
+ margin-bottom: 1rem;
537
+ }
538
+
539
+ .tag {
540
+ padding: 0.25rem 0.75rem;
541
+ background: var(--bg-dark);
542
+ border-radius: 2rem;
543
+ font-size: 0.75rem;
544
+ color: var(--text-secondary);
545
+ }
546
+
547
+ .paper-footer {
548
+ display: flex;
549
+ justify-content: space-between;
550
+ align-items: center;
551
+ padding-top: 1rem;
552
+ border-top: 1px solid var(--border-color);
553
+ }
554
+
555
+ .paper-stats {
556
+ display: flex;
557
+ gap: 1.5rem;
558
+ color: var(--text-muted);
559
+ font-size: 0.85rem;
560
+ }
561
+
562
+ .paper-stats span {
563
+ display: flex;
564
+ align-items: center;
565
+ gap: 0.5rem;
566
+ }
567
+
568
+ .paper-actions {
569
+ display: flex;
570
+ gap: 0.5rem;
571
+ }
572
+
573
+ .action-btn {
574
+ padding: 0.5rem 1rem;
575
+ background: transparent;
576
+ border: 1px solid var(--border-color);
577
+ border-radius: 0.5rem;
578
+ color: var(--text-secondary);
579
+ font-size: 0.85rem;
580
+ cursor: pointer;
581
+ transition: all 0.3s;
582
+ display: flex;
583
+ align-items: center;
584
+ gap: 0.5rem;
585
+ }
586
+
587
+ .action-btn:hover {
588
+ border-color: var(--primary-color);
589
+ color: var(--primary-light);
590
+ }
591
+
592
+ .action-btn.primary {
593
+ background: var(--primary-color);
594
+ border-color: var(--primary-color);
595
+ color: white;
596
+ }
597
+
598
+ .action-btn.primary:hover {
599
+ background: var(--primary-dark);
600
+ }
601
+
602
+ /* Analysis Panel */
603
+ .analysis-panel {
604
+ position: fixed;
605
+ top: 0;
606
+ right: -600px;
607
+ width: 600px;
608
+ height: 100vh;
609
+ background: var(--bg-card);
610
+ border-left: 1px solid var(--border-color);
611
+ z-index: 2000;
612
+ transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
613
+ display: flex;
614
+ flex-direction: column;
615
+ }
616
+
617
+ .analysis-panel.open {
618
+ right: 0;
619
+ }
620
+
621
+ .panel-header {
622
+ padding: 1.5rem;
623
+ border-bottom: 1px solid var(--border-color);
624
+ display: flex;
625
+ justify-content: space-between;
626
+ align-items: center;
627
+ }
628
+
629
+ .panel-title {
630
+ font-size: 1.25rem;
631
+ font-weight: 600;
632
+ }
633
+
634
+ .close-btn {
635
+ background: transparent;
636
+ border: none;
637
+ color: var(--text-secondary);
638
+ font-size: 1.25rem;
639
+ cursor: pointer;
640
+ padding: 0.5rem;
641
+ border-radius: 0.5rem;
642
+ transition: all 0.3s;
643
+ }
644
+
645
+ .close-btn:hover {
646
+ background: var(--bg-dark);
647
+ color: var(--text-primary);
648
+ }
649
+
650
+ .panel-content {
651
+ flex: 1;
652
+ overflow-y: auto;
653
+ padding: 1.5rem;
654
+ }
655
+
656
+ .analysis-section {
657
+ margin-bottom: 2rem;
658
+ }
659
+
660
+ .analysis-section-title {
661
+ font-size: 1rem;
662
+ font-weight: 600;
663
+ margin-bottom: 1rem;
664
+ display: flex;
665
+ align-items: center;
666
+ gap: 0.5rem;
667
+ }
668
+
669
+ .analysis-section-title i {
670
+ color: var(--primary-light);
671
+ }
672
+
673
+ .analysis-card {
674
+ background: var(--bg-dark);
675
+ border-radius: 0.75rem;
676
+ padding: 1rem;
677
+ border: 1px solid var(--border-color);
678
+ }
679
+
680
+ .extracted-info {
681
+ display: flex;
682
+ flex-direction: column;
683
+ gap: 1rem;
684
+ }
685
+
686
+ .info-item {
687
+ display: flex;
688
+ gap: 1rem;
689
+ }
690
+
691
+ .info-label {
692
+ color: var(--text-muted);
693
+ font-size: 0.85rem;
694
+ min-width: 80px;
695
+ }
696
+
697
+ .info-value {
698
+ color: var(--text-primary);
699
+ font-size: 0.9rem;
700
+ flex: 1;
701
+ }
702
+
703
+ /* Loading Animation */
704
+ .loading-overlay {
705
+ position: fixed;
706
+ top: 0;
707
+ left: 0;
708
+ right: 0;
709
+ bottom: 0;
710
+ background: rgba(15, 23, 42, 0.9);
711
+ display: none;
712
+ align-items: center;
713
+ justify-content: center;
714
+ z-index: 3000;
715
+ }
716
+
717
+ .loading-overlay.active {
718
+ display: flex;
719
+ }
720
+
721
+ .loader {
722
+ text-align: center;
723
+ }
724
+
725
+ .loader-spinner {
726
+ width: 60px;
727
+ height: 60px;
728
+ border: 3px solid var(--border-color);
729
+ border-top-color: var(--primary-color);
730
+ border-radius: 50%;
731
+ animation: spin 1s linear infinite;
732
+ margin: 0 auto 1rem;
733
+ }
734
+
735
+ @keyframes spin {
736
+ to { transform: rotate(360deg); }
737
+ }
738
+
739
+ .loader-text {
740
+ color: var(--text-secondary);
741
+ font-size: 0.9rem;
742
+ }
743
+
744
+ .progress-bar {
745
+ width: 200px;
746
+ height: 4px;
747
+ background: var(--border-color);
748
+ border-radius: 2px;
749
+ margin-top: 1rem;
750
+ overflow: hidden;
751
+ }
752
+
753
+ .progress-fill {
754
+ height: 100%;
755
+ background: var(--gradient-main);
756
+ border-radius: 2px;
757
+ transition: width 0.3s;
758
+ animation: progress 2s ease-in-out infinite;
759
+ }
760
+
761
+ @keyframes progress {
762
+ 0% { width: 0%; }
763
+ 50% { width: 70%; }
764
+ 100% { width: 100%; }
765
+ }
766
+
767
+ /* Timeline */
768
+ .timeline {
769
+ position: relative;
770
+ padding-left: 1.5rem;
771
+ }
772
+
773
+ .timeline::before {
774
+ content: '';
775
+ position: absolute;
776
+ left: 0;
777
+ top: 0;
778
+ bottom: 0;
779
+ width: 2px;
780
+ background: var(--border-color);
781
+ }
782
+
783
+ .timeline-item {
784
+ position: relative;
785
+ padding-bottom: 1.5rem;
786
+ }
787
+
788
+ .timeline-item::before {
789
+ content: '';
790
+ position: absolute;
791
+ left: -1.65rem;
792
+ top: 0.25rem;
793
+ width: 10px;
794
+ height: 10px;
795
+ background: var(--primary-color);
796
+ border-radius: 50%;
797
+ border: 2px solid var(--bg-card);
798
+ }
799
+
800
+ .timeline-time {
801
+ font-size: 0.75rem;
802
+ color: var(--text-muted);
803
+ margin-bottom: 0.25rem;
804
+ }
805
+
806
+ .timeline-content {
807
+ font-size: 0.9rem;
808
+ color: var(--text-primary);
809
+ }
810
+
811
+ /* Keywords Cloud */
812
+ .keywords-cloud {
813
+ display: flex;
814
+ flex-wrap: wrap;
815
+ gap: 0.5rem;
816
+ }
817
+
818
+ .keyword {
819
+ padding: 0.35rem 0.75rem;
820
+ background: linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(6, 182, 212, 0.2));
821
+ border-radius: 2rem;
822
+ font-size: 0.8rem;
823
+ color: var(--primary-light);
824
+ border: 1px solid rgba(99, 102, 241, 0.3);
825
+ }
826
+
827
+ .keyword.size-lg {
828
+ font-size: 1rem;
829
+ padding: 0.5rem 1rem;
830
+ }
831
+
832
+ .keyword.size-md {
833
+ font-size: 0.9rem;
834
+ }
835
+
836
+ /* Overlay */
837
+ .overlay {
838
+ position: fixed;
839
+ top: 0;
840
+ left: 0;
841
+ right: 0;
842
+ bottom: 0;
843
+ background: rgba(0, 0, 0, 0.5);
844
+ opacity: 0;
845
+ visibility: hidden;
846
+ transition: all 0.3s;
847
+ z-index: 1500;
848
+ }
849
+
850
+ .overlay.active {
851
+ opacity: 1;
852
+ visibility: visible;
853
+ }
854
+
855
+ /* Pagination */
856
+ .pagination {
857
+ display: flex;
858
+ justify-content: center;
859
+ gap: 0.5rem;
860
+ margin-top: 2rem;
861
+ }
862
+
863
+ .page-btn {
864
+ padding: 0.75rem 1rem;
865
+ background: var(--bg-card);
866
+ border: 1px solid var(--border-color);
867
+ border-radius: 0.5rem;
868
+ color: var(--text-secondary);
869
+ cursor: pointer;
870
+ transition: all 0.3s;
871
+ }
872
+
873
+ .page-btn:hover {
874
+ border-color: var(--primary-color);
875
+ color: var(--primary-light);
876
+ }
877
+
878
+ .page-btn.active {
879
+ background: var(--primary-color);
880
+ border-color: var(--primary-color);
881
+ color: white;
882
+ }
883
+
884
+ /* Responsive */
885
+ @media (max-width: 1024px) {
886
+ .sidebar {
887
+ transform: translateX(-100%);
888
+ }
889
+
890
+ .sidebar.open {
891
+ transform: translateX(0);
892
+ }
893
+
894
+ .content {
895
+ margin-left: 0;
896
+ }
897
+
898
+ .analysis-panel {
899
+ width: 100%;
900
+ right: -100%;
901
+ }
902
+ }
903
+
904
+ @media (max-width: 640px) {
905
+ .header {
906
+ padding: 1rem;
907
+ }
908
+
909
+ .content {
910
+ padding: 1rem;
911
+ }
912
+
913
+ .stats-grid {
914
+ grid-template-columns: repeat(2, 1fr);
915
+ }
916
+
917
+ .search-filters {
918
+ gap: 0.5rem;
919
+ }
920
+
921
+ .paper-header {
922
+ flex-direction: column;
923
+ gap: 0.75rem;
924
+ }
925
+
926
+ .paper-footer {
927
+ flex-direction: column;
928
+ gap: 1rem;
929
+ align-items: flex-start;
930
+ }
931
+ }
932
+
933
+ /* Built with anycoder */
934
+ .built-with {
935
+ position: fixed;
936
+ bottom: 1rem;
937
+ left: 1.5rem;
938
+ font-size: 0.8rem;
939
+ color: var(--text-muted);
940
+ z-index: 100;
941
+ }
942
+
943
+ .built-with a {
944
+ color: var(--primary-light);
945
+ text-decoration: none;
946
+ font-weight: 500;
947
+ }
948
+
949
+ .built-with a:hover {
950
+ text-decoration: underline;
951
+ }
952
+
953
+ /* Menu Toggle */
954
+ .menu-toggle {
955
+ display: none;
956
+ background: transparent;
957
+ border: none;
958
+ color: var(--text-primary);
959
+ font-size: 1.25rem;
960
+ cursor: pointer;
961
+ padding: 0.5rem;
962
+ }
963
+
964
+ @media (max-width: 1024px) {
965
+ .menu-toggle {
966
+ display: block;
967
+ }
968
+ }
969
+
970
+ /* Scrollbar */
971
+ ::-webkit-scrollbar {
972
+ width: 8px;
973
+ height: 8px;
974
+ }
975
+
976
+ ::-webkit-scrollbar-track {
977
+ background: var(--bg-dark);
978
+ }
979
+
980
+ ::-webkit-scrollbar-thumb {
981
+ background: var(--border-color);
982
+ border-radius: 4px;
983
+ }
984
+
985
+ ::-webkit-scrollbar-thumb:hover {
986
+ background: var(--text-muted);
987
+ }
988
+
989
+ /* Toast Notification */
990
+ .toast-container {
991
+ position: fixed;
992
+ bottom: 2rem;
993
+ right: 2rem;
994
+ z-index: 4000;
995
+ display: flex;
996
+ flex-direction: column;
997
+ gap: 0.75rem;
998
+ }
999
+
1000
+ .toast {
1001
+ background: var(--bg-card);
1002
+ border: 1px solid var(--border-color);
1003
+ border-radius: 0.75rem;
1004
+ padding: 1rem 1.5rem;
1005
+ display: flex;
1006
+ align-items: center;
1007
+ gap: 0.75rem;
1008
+ box-shadow: var(--shadow-lg);
1009
+ animation: slideIn 0.3s ease;
1010
+ }
1011
+
1012
+ @keyframes slideIn {
1013
+ from {
1014
+ transform: translateX(100%);
1015
+ opacity: 0;
1016
+ }
1017
+ to {
1018
+ transform: translateX(0);
1019
+ opacity: 1;
1020
+ }
1021
+ }
1022
+
1023
+ .toast.success {
1024
+ border-color: var(--success);
1025
+ }
1026
+
1027
+ .toast.error {
1028
+ border-color: var(--error);
1029
+ }
1030
+
1031
+ .toast i {
1032
+ font-size: 1.25rem;
1033
+ }
1034
+
1035
+ .toast.success i {
1036
+ color: var(--success);
1037
+ }
1038
+
1039
+ .toast.error i {
1040
+ color: var(--error);
1041
+ }
1042
+
1043
+ /* Abstract highlight */
1044
+ .abstract-highlight {
1045
+ background: rgba(99, 102, 241, 0.2);
1046
+ padding: 0.1rem 0.3rem;
1047
+ border-radius: 0.25rem;
1048
+ }
1049
+ </style>
1050
+ </head>
1051
+ <body>
1052
+ <!-- Header -->
1053
+ <header class="header">
1054
+ <div style="display: flex; align-items: center; gap: 1rem;">
1055
+ <button class="menu-toggle" onclick="toggleSidebar()">
1056
+ <i class="fas fa-bars"></i>
1057
+ </button>
1058
+ <div class="logo">
1059
+ <i class="fas fa-microscope"></i>
1060
+ 论文雷达
1061
+ <span>PaperRadar AI</span>
1062
+ </div>
1063
+ </div>
1064
+ <div class="header-actions">
1065
+ <button class="notification-btn">
1066
+ <i class="fas fa-bell"></i>
1067
+ <span class="notification-badge">5</span>
1068
+ </button>
1069
+ <div class="user-avatar">JD</div>
1070
+ </div>
1071
+ </header>
1072
+
1073
+ <!-- Main Container -->
1074
+ <div class="main-container">
1075
+ <!-- Sidebar -->
1076
+ <aside class="sidebar" id="sidebar">
1077
+ <div class="sidebar-section">
1078
+ <div class="sidebar-title">主导航</div>
1079
+ <div class="nav-item active">
1080
+ <i class="fas fa-search"></i>
1081
+ <span>论文搜索</span>
1082
+ </div>
1083
+ <div class="nav-item">
1084
+ <i class="fas fa-fire"></i>
1085
+ <span>热门趋势</span>
1086
+ <span class="badge">Hot</span>
1087
+ </div>
1088
+ <div class="nav-item">
1089
+ <i class="fas fa-star"></i>
1090
+ <span>我的收藏</span>
1091
+ </div>
1092
+ <div class="nav-item">
1093
+ <i class="fas fa-history"></i>
1094
+ <span>浏览历史</span>
1095
+ </div>
1096
+ </div>
1097
+ <div class="sidebar-section">
1098
+ <div class="sidebar-title">数据源</div>
1099
+ <div class="nav-item">
1100
+ <i class="fas fa-database"></i>
1101
+ <span>arXiv</span>
1102
+ <i class="fas fa-check-circle" style="color: var(--success);"></i>
1103
+ </div>
1104
+ <div class="nav-item">
1105
+ <i class="fas fa-graduation-cap"></i>
1106
+ <span>Semantic Scholar</span>
1107
+ </div>
1108
+ <div class="nav-item">
1109
+ <i class="fas fa-book"></i>
1110
+ <span>PubMed</span>
1111
+ </div>
1112
+ <div class="nav-item">
1113
+ <i class="fas fa-globe"></i>
1114
+ <span>IEEEXplore</span>
1115
+ </div>
1116
+ </div>
1117
+ <div class="sidebar-section">
1118
+ <div class="sidebar-title">工具</div>
1119
+ <div class="nav-item">
1120
+ <i class="fas fa-robot"></i>
1121
+ <span>AI摘要</span>
1122
+ </div>
1123
+ <div class="nav-item">
1124
+ <i class="fas fa-language"></i>
1125
+ <span>翻译</span>
1126
+ </div>
1127
+ <div class="nav-item">
1128
+ <i class="fas fa-download"></i>
1129
+ <span>导出报告</span>
1130
+ </div>
1131
+ </div>
1132
+ </aside>
1133
+
1134
+ <!-- Content -->
1135
+ <main class="content">
1136
+ <!-- Search Section -->
1137
+ <section class="search-section">
1138
+ <div class="search-container">
1139
+ <div class="search-header">
1140
+ <h2 class="search-title"><i class="fas fa-search" style="color: var(--primary-light);"></i> 智能论文搜索</h2>
1141
+ </div>
1142
+ <div class="search-input-wrapper">
1143
+ <i class="fas fa-search search-icon"></i>
1144
+ <input type="text" class="search-input" placeholder="搜索论文标题、作者、关键词... 例如: transformer attention mechanism" id="searchInput">
1145
+ </div>
1146
+ <div class="search-filters">
1147
+ <span class="filter-chip active" data-filter="all">全部</span>
1148
+ <span class="filter-chip" data-filter="ai">人工智能</span>
1149
+ <span class="filter-chip" data-filter="nlp">自然语言处理</span>
1150
+ <span class="filter-chip" data-filter="cv">计算机视觉</span>
1151
+ <span class="filter-chip" data-filter="ml">机器学习</span>
1152
+ <span class="filter-chip" data-filter="robotics">机器人学</span>
1153
+ <span class="filter-chip" data-filter="recent">最新发布</span>
1154
+ <span class="filter-chip" data-filter="high-cited">高引用</span>
1155
+ </div>
1156
+ <div style="margin-top: 1rem; display: flex; justify-content: flex-end;">
1157
+ <button class="search-btn" onclick="searchPapers()">
1158
+ <i class="fas fa-rocket"></i> 开始搜索
1159
+ </button>
1160
+ </div>
1161
+ </div>
1162
+ </section>
1163
+
1164
+ <!-- Stats Grid -->
1165
+ <div class="stats-grid">
1166
+ <div class="stat-card">
1167
+ <div class="stat-icon blue">
1168
+ <i class="fas fa-file-alt"></i>
1169
+ </div>
1170
+ <div class="stat-value">12,847</div>
1171
+ <div class="stat-label">论文总数</div>
1172
+ <div class="stat-trend up">
1173
+ <i class="fas fa-arrow-up"></i> 今日新增 156 篇
1174
+ </div>
1175
+ </div>
1176
+ <div class="stat-card">
1177
+ <div class="stat-icon cyan">
1178
+ <i class="fas fa-microscope"></i>
1179
+ </div>
1180
+ <div class="stat-value">3,429</div>
1181
+ <div class="stat-label">已解析论文</div>
1182
+ <div class="stat-trend up">
1183
+ <i class="fas fa-arrow-up"></i> 解析率 26.7%
1184
+ </div>
1185
+ </div>
1186
+ <div class="stat-card">
1187
+ <div class="stat-icon amber">
1188
+ <i class="fas fa-users"></i>
1189
+ </div>
1190
+ <div class="stat-value">8,542</div>
1191
+ <div class="stat-label">活跃研究者</div>
1192
+ <div class="stat-trend up">
1193
+ <i class="fas fa-arrow-up"></i> +12.3% 本月
1194
+ </div>
1195
+ </div>
1196
+ <div class="stat-card">
1197
+ <div class="stat-icon green">
1198
+ <i class="fas fa引用次数"></i>
1199
+ </div>
1200
+ <div class="stat-value">156,892</div>
1201
+ <div class="stat-label">总引用次数</div>
1202
+ <div class="stat-trend up">
1203
+ <i class="fas fa-arrow-up"></i> 同比增长 34.5%
1204
+ </div>
1205
+ </div>
1206
+ </div>
1207
+
1208
+ <!-- Paper List -->
1209
+ <section class="papers-section">
1210
+ <div class="section-header">
1211
+ <h2 class="section-title">
1212
+ <i class="fas fa-list" style="color: var(--primary-light);"></i>
1213
+ 搜索结果
1214
+ <span style="font-size: 0.9rem; color: var(--text-secondary); font-weight: 400;">(显示 1-10 条,共 1,247 条)</span>
1215
+ </h2>
1216
+ <div class="view-toggle">
1217
+ <button class="view-btn active"><i class="fas fa-list"></i></button>
1218
+ <button class="view-btn"><i class="fas fa-th-large"></i></button>
1219
+ </div>
1220
+ </div>
1221
+ <div class="paper-list" id="paperList">
1222
+ <!-- Papers will be dynamically loaded -->
1223
+ </div>
1224
+ <div class="pagination">
1225
+ <button class="page-btn"><i class="fas fa-chevron-left"></i></button>
1226
+ <button class="page-btn active">1</button>
1227
+ <button class="page-btn">2</button>
1228
+ <button class="page-btn">3</button>
1229
+ <button class="page-btn">...</button>
1230
+ <button class="page-btn">125</button>
1231
+ <button class="page-btn"><i class="fas fa-chevron-right"></i></button>
1232
+ </div>
1233
+ </section>
1234
+ </main>
1235
+ </div>
1236
+
1237
+ <!-- Analysis Panel -->
1238
+ <div class="overlay" id="overlay" onclick="closeAnalysisPanel()"></div>
1239
+ <aside class="analysis-panel" id="analysisPanel">
1240
+ <div class="panel-header">
1241
+ <h3 class="panel-title"><i class="fas fa-chart-pie" style="color: var(--primary-light);"></i> 论文深度解析</h3>
1242
+ <button class="close-btn" onclick="closeAnalysisPanel()">
1243
+ <i class="fas fa-times"></i>
1244
+ </button>
1245
+ </div>
1246
+ <div class="panel-content" id="panelContent">
1247
+ <!-- Analysis content will be dynamically loaded -->
1248
+ </div>
1249
+ </aside>
1250
+
1251
+ <!-- Loading Overlay -->
1252
+ <div class="loading-overlay" id="loadingOverlay">
1253
+ <div class="loader">
1254
+ <div class="loader-spinner"></div>
1255
+ <div class="loader-text" id="loadingText">正在解析论文...</div>
1256
+ <div class="progress-bar">
1257
+ <div class="progress-fill"></div>
1258
+ </div>
1259
+ </div>
1260
+ </div>
1261
+
1262
+ <!-- Toast Container -->
1263
+ <div class="toast-container" id="toastContainer"></div>
1264
+
1265
+ <!-- Built with anycoder -->
1266
+ <div class="built-with">
1267
+ Built with <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank">anycoder</a>
1268
+ </div>
1269
+
1270
+ <script>
1271
+ // Sample Papers Data
1272
+ const samplePapers = [
1273
+ {
1274
+ id: 1,
1275
+ title: "Attention Is All You Need: Rethinking Transformer Architecture for Language Understanding",
1276
+ authors: ["Ashish Vaswani", "Noam Shazeer", "Niki Parmar", "Jakob Uszkoreit"],
1277
+ venue: "NeurIPS 2024",
1278
+ date: "2024-01-15",
1279
+ citations: 2847,
1280
+ abstract: "We propose a novel transformer architecture that eliminates the need for recurrence and convolution entirely. Our model relies solely on attention mechanisms, achieving state-of-the-art results on multiple NLP benchmarks while reducing training time by 40%.",
1281
+ tags: ["Transformer", "Attention", "NLP", "Deep Learning"],
1282
+ status: "hot",
1283
+ likes: 892,
1284
+ views: 12458
1285
+ },
1286
+ {
1287
+ id: 2,
1288
+ title: "Vision Transformers in Medical Imaging: A Comprehensive Survey and Benchmark",
1289
+ authors: ["Xiaohong Liu", "Yiming Zhou", "Wei Liu", "et al."],
1290
+ venue: "Nature Machine Intelligence",
1291
+ date: "2024-01-12",
1292
+ citations: 567,
1293
+ abstract: "This paper presents a systematic survey and benchmark of Vision Transformer applications in medical imaging. We evaluate 15+ ViT variants across 8 medical imaging tasks, providing insights into their strengths and limitations.",
1294
+ tags: ["Vision Transformer", "Medical AI", "Computer Vision", "Survey"],
1295
+ status: "new",
1296
+ likes: 445,
1297
+ views: 6789
1298
+ },
1299
+ {
1300
+ id: 3,
1301
+ title: "Self-Supervised Learning for Protein Structure Prediction with AlphaFold-3",
1302
+ authors: ["John Jumper", "Richard Evans", "Alexander Pritzel", "et al."],
1303
+ venue: "Science",
1304
+ date: "2024-01-10",
1305
+ citations: 1234,
1306
+ abstract: "We introduce AlphaFold-3, a revolutionary approach to protein structure prediction that leverages self-supervised learning to predict protein structures with unprecedented accuracy, including protein-ligand and protein-nucleic acid complexes.",
1307
+ tags: ["Protein Folding", "Self-Supervised", "Bioinformatics", "AlphaFold"],
1308
+ status: "hot",
1309
+ likes: 1203,
1310
+ views: 18923
1311
+ },
1312
+ {
1313
+ id: 4,
1314
+ title: "Large Multimodal Models: Bridging Vision and Language for Universal Understanding",
1315
+ authors: ["Bohan Li", "Hao Wu", "Jiahui Xu", "et al."],
1316
+ venue: "ICML 2024",
1317
+ date: "2024-01-08",
1318
+ citations: 789,
1319
+ abstract: "We present LLaVA-Med, a large multimodal model designed for biomedical applications. Our approach efficiently aligns visual and linguistic representations, achieving competitive performance on various biomedical VQA tasks.",
1320
+ tags: ["Multimodal", "LMM", "Vision-Language", "Biomedical"],
1321
+ status: "analyzing",
1322
+ likes: 567,
1323
+ views: 8934
1324
+ },
1325
+ {
1326
+ id: 5,
1327
+ title: "Efficient Fine-Tuning of Large Language Models: A Comprehensive Study",
1328
+ authors: ["Edward J. Hu", "Yelong Shen", "Pengwei Huang", "et al."],
1329
+ venue: "ACL 2024",
1330
+ date: "2024-01-05",
1331
+ citations: 456,
1332
+ abstract: "This comprehensive study investigates parameter-efficient fine-tuning methods for LLMs. We compare LoRA, Adapter, and Prefix-Tuning across multiple tasks, providing practical guidelines for practitioners.",
1333
+ tags: ["LLM Fine-tuning", "Parameter Efficiency", "NLP", "LoRA"],
1334
+ status: "new",
1335
+ likes: 334,
1336
+ views: 5678
1337
+ },
1338
+ {
1339
+ id: 6,
1340
+ title: "Reinforcement Learning in Robotics: From Simulation to Real-World Deployment",
1341
+ authors: ["Sergey Levine", "Pieter Abbeel", "John D. Schulman"],
1342
+ venue: "RSS 2024",
1343
+ date: "2024-01-03",
1344
+ citations: 678,
1345
+ abstract: "We address the sim-to-real gap in reinforcement learning for robotics. Our domain randomization and adaptation techniques enable seamless transfer of learned policies from simulation to physical robots.",
1346
+ tags: ["Reinforcement Learning", "Robotics", "Sim-to-Real", "Control"],
1347
+ status: "new",
1348
+ likes: 289,
1349
+ views: 4567
1350
+ },
1351
+ {
1352
+ id: 7,
1353
+ title: "Federated Learning with Differential Privacy: Theory and Practice",
1354
+ authors: ["Peter Kairouz", "H. Brendan McMahan", "Brian Knott", "et al."],
1355
+ venue: "IEEE S&P 2024",
1356
+ date: "2024-01-01",
1357
+ citations: 892,
1358
+ abstract: "This paper provides a rigorous analysis of differential privacy in federated learning settings. We derive tight privacy guarantees and propose efficient algorithms that achieve optimal utility-privacy trade-off.",
1359
+ tags: ["Federated Learning", "Differential Privacy", "Security", "ML"],
1360
+ status: "new",
1361
+ likes: 412,
1362
+ views: 6789
1363
+ },
1364
+ {
1365
+ id: 8,
1366
+ title: "Neural Architecture Search for Efficient Edge Computing",
1367
+ authors: ["Hanxiao Liu", "Karen Simonyan", "Yiming Yang", "Chris Dyer"],
1368
+ venue: "CVPR 2024",
1369
+ date: "2023-12-28",
1370
+ citations: 345,
1371
+ abstract: "We introduce EfficientNet-NAS, a family of neural networks optimized for edge devices. Our search method achieves 2-4x better efficiency compared to existing mobile-friendly architectures.",
1372
+ tags: ["Neural Architecture Search", "Edge AI", "Efficient Networks", "Mobile"],
1373
+ status: "new",
1374
+ likes: 267,
1375
+ views: 3456
1376
+ }
1377
+ ];
1378
+
1379
+ // Initialize
1380
+ document.addEventListener('DOMContentLoaded', function() {
1381
+ renderPapers(samplePapers);
1382
+ setupFilterChips();
1383
+ setupSearch();
1384
+ });
1385
+
1386
+ // Render Papers
1387
+ function renderPapers(papers) {
1388
+ const paperList = document.getElementById('paperList');
1389
+ paperList.innerHTML = papers.map(paper => `
1390
+ <div class="paper-card" onclick="openAnalysisPanel(${paper.id})">
1391
+ <div class="paper-header">
1392
+ <h3 class="paper-title">${highlightKeywords(paper.title)}</h3>
1393
+ <span class="paper-status status-${paper.status}">
1394
+ ${getStatusLabel(paper.status)}
1395
+ </span>
1396
+ </div>
1397
+ <div class="paper-meta">
1398
+ <span class="paper-meta-item">
1399
+ <i class="fas fa-user"></i> ${paper.authors.slice(0, 3).join(', ')}${paper.authors.length > 3 ? ' et al.' : ''}
1400
+ </span>
1401
+ <span class="paper-meta-item">
1402
+ <i class="fas fa-map-marker-alt"></i> ${paper.venue}
1403
+ </span>
1404
+ <span class="paper-meta-item">
1405
+ <i class="fas fa-calendar"></i> ${formatDate(paper.date)}
1406
+ </span>
1407
+ <span class="paper-meta-item">
1408
+ <i class="fas fa引用次数"></i> ${formatNumber(paper.citations