Hugging Face's logo

Spaces:
fdaudens
/
nieman_lab_2025_predictions_visualization
Running

App Files Community
fdaudens HF Staff commited on
Commit
78cb252
·
verified ·
1 Parent(s): 2129e5e

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +86 -56
index.html CHANGED
@@ -7,63 +7,93 @@
7
  <script src="libs/d3.min.js"></script>
8
  <script src="libs/plot.umd.min.js"></script>
9
  <style>
10
- body {
11
- margin: 0;
12
- font-family: Arial, sans-serif;
13
- }
14
- #viz {
15
- width: 100%;
16
- height: 67vh;
17
- position: relative;
18
- overflow: hidden;
19
- }
20
- #popup {
21
- display: none;
22
- position: absolute;
23
- background: white;
24
- border: 1px solid #ccc;
25
- padding: 15px;
26
- border-radius: 4px;
27
- box-shadow: 0 2px 10px rgba(0,0,0,0.1);
28
- max-width: 400px;
29
- z-index: 1000;
30
- font-size: 14px;
31
- line-height: 1.4;
32
- pointer-events: auto;
33
- }
34
- h1 {
35
- color: #1a1a1a;
36
- margin-bottom: 20px;
37
- }
38
- .intro {
39
- max-width: 800px;
40
- margin: 0 auto 40px;
41
- text-align: center;
42
- line-height: 1.6;
43
- color: #374151;
44
- }
45
- .popup-headline {
46
- font-weight: bold;
47
- margin-bottom: 8px;
48
- }
49
- .popup-author {
50
- color: #666;
51
- margin-bottom: 8px;
52
- }
53
- .popup-url {
54
- color: #0066cc;
55
- word-break: break-all;
56
- }
57
- #note {
58
- font-size: 10px;
59
- color: #555;
60
- text-align: center;
61
- margin-top: auto; /* Pushes the note to the bottom */
62
- padding: 5px;
63
- background-color: #f8f8f8;
64
- border-top: 1px solid #ddd;
65
- }
66
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
67
  </style>
68
  </head>
69
  <body>
 
7
  <script src="libs/d3.min.js"></script>
8
  <script src="libs/plot.umd.min.js"></script>
9
  <style>
10
+ body {
11
+ margin: 0;
12
+ font-family: Arial, sans-serif;
13
+ }
14
+
15
+ #viz {
16
+ width: 100%;
17
+ height: 67vh;
18
+ position: relative;
19
+ overflow: hidden;
20
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
21
 
22
+ @media (max-width: 768px) {
23
+ #viz {
24
+ height: 100vh;
25
+ }
26
+ }
27
+
28
+ #popup {
29
+ display: none;
30
+ position: absolute;
31
+ background: white;
32
+ border: 1px solid #ccc;
33
+ padding: 15px;
34
+ border-radius: 4px;
35
+ box-shadow: 0 2px 10px rgba(0,0,0,0.1);
36
+ max-width: 400px;
37
+ z-index: 1000;
38
+ font-size: 14px;
39
+ line-height: 1.4;
40
+ pointer-events: auto;
41
+ }
42
+
43
+ h1 {
44
+ color: #1a1a1a;
45
+ margin-bottom: 20px;
46
+ }
47
+
48
+ .intro {
49
+ max-width: 800px;
50
+ margin: 0 auto 40px;
51
+ text-align: center;
52
+ line-height: 1.6;
53
+ color: #374151;
54
+ }
55
+
56
+ .popup-headline {
57
+ font-weight: bold;
58
+ margin-bottom: 8px;
59
+ }
60
+
61
+ .popup-author {
62
+ color: #666;
63
+ margin-bottom: 8px;
64
+ }
65
+
66
+ .popup-url {
67
+ color: #0066cc;
68
+ word-break: break-all;
69
+ }
70
+
71
+ #note {
72
+ font-size: 10px;
73
+ color: #555;
74
+ text-align: center;
75
+ margin-top: auto;
76
+ padding: 5px;
77
+ background-color: #f8f8f8;
78
+ border-top: 1px solid #ddd;
79
+ }
80
+
81
+ @media (max-width: 768px) {
82
+ #popup {
83
+ max-width: 280px;
84
+ font-size: 12px;
85
+ }
86
+
87
+ .intro {
88
+ padding: 0 20px;
89
+ margin-bottom: 20px;
90
+ }
91
+
92
+ h1 {
93
+ font-size: 24px;
94
+ margin-bottom: 15px;
95
+ }
96
+ }
97
  </style>
98
  </head>
99
  <body>