Hugging Face's logo

Spaces:
VyLala
/
mtDNALocation
Running

App Files Community
1
VyLala commited on
Commit
4579566
·
verified ·
1 Parent(s): 6927c07

Update better_offer.html

Browse files
Files changed (1) hide show
  1. better_offer.html +54 -37
better_offer.html CHANGED
@@ -2,20 +2,31 @@
2
  <head>
3
  <meta name="color-scheme" content="light">
4
  <style>
5
- /* Force Hugging Face / Gradio containers to stay white */
6
- html, body, #root, .gradio-container, .container, .block {
7
  background: #ffffff !important;
8
  color: #0f172a !important;
9
  margin: 0;
10
  padding: 0;
11
  }
12
-
13
  * {
14
- color-scheme: only light !important;
15
  }
16
 
17
- /* Force text color inside your page */
18
- #classifier-page,
 
 
 
 
 
 
 
 
 
 
 
 
19
  #classifier-page h1,
20
  #classifier-page h2,
21
  #classifier-page h3,
@@ -27,20 +38,26 @@
27
  #classifier-page td,
28
  #classifier-page th {
29
  color: #0f172a !important;
30
- background: #ffffff !important;
 
 
 
 
 
 
 
 
 
31
  }
 
 
 
 
32
  </style>
33
  </head>
34
 
35
  <body>
36
- <div id="classifier-page" style="font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
37
- line-height:1.6;
38
- background-color:#ffffff;
39
- max-width:900px;
40
- margin:24px auto;
41
- padding:28px 20px;
42
- border-radius:12px;
43
- box-shadow:0 2px 8px rgba(0,0,0,0.05);">
44
 
45
  <!-- Header -->
46
  <h1 style="margin:0 0 8px; font-size:32px;">mtDNA Location Classifier</h1>
@@ -49,11 +66,12 @@
49
  The tool suggests structured labels fast — you decide which ones to trust and refine.
50
  </p>
51
 
 
52
  <div style="display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 24px;">
53
- <span style="background:#eef2ff; color:#3730a3; padding:6px 10px; border-radius:999px; font-size:12px;">84% country accuracy (n=4,934)</span>
54
- <span style="background:#ecfeff; color:#155e75; padding:6px 10px; border-radius:999px; font-size:12px;">92% modern/ancient accuracy (n=4,934)</span>
55
- <span style="background:#f0fdf4; color:#166534; padding:6px 10px; border-radius:999px; font-size:12px;">Source-backed explanations</span>
56
- <span style="background:#fff7ed; color:#9a3412; padding:6px 10px; border-radius:999px; font-size:12px;">Report → free credit</span>
57
  </div>
58
 
59
  <hr style="border:none; border-top:1px solid #e2e8f0; margin:24px 0;">
@@ -143,25 +161,24 @@
143
  for some <em>edge cases</em> were more accurate than his manual annotations — even when metadata was missing.
144
  </div>
145
 
146
- <hr>
147
-
148
- <h2 id="research-supporter" style="margin:24px 0 8px; font-size:22px;">Research Partner Plan (for early supporters)</h2>
149
- <p>
150
- Designed for researchers running larger studies who want to support ongoing development while staying on budget.
151
- Instead of paying strictly per sample, you can join as a <strong>Research Partner</strong>:
152
- </p>
153
- <ul>
154
- <li><strong>$300 flat contribution</strong> (covers ~3,000 samples at $0.10 each, with flexibility on usage)</li>
155
- <li>Includes early access to new features and custom labels</li>
156
- <li>Direct feedback channel — help shape how the tool evolves</li>
157
- <li>Recognition as an early research supporter</li>
158
- </ul>
159
- <p>
160
- <em>This tier was inspired by our very first paying researcher, who contributed $300 to support
161
- continued development after testing thousands of samples. It’s ideal if you see the potential
162
- and want to support the mission, even if you’re still validating outputs in your workflow.</em>
163
- </p>
164
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
165
 
166
  <!-- Who it's for -->
167
  <h2 style="margin:24px 0 8px; font-size:22px;">Best for</h2>
 
2
  <head>
3
  <meta name="color-scheme" content="light">
4
  <style>
5
+ /* Force light mode */
6
+ html, body {
7
  background: #ffffff !important;
8
  color: #0f172a !important;
9
  margin: 0;
10
  padding: 0;
11
  }
 
12
  * {
13
+ color-scheme: only light;
14
  }
15
 
16
+ /* Content wrapper (the white card) */
17
+ #classifier-page {
18
+ font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
19
+ line-height: 1.6;
20
+ background: #ffffff !important;
21
+ color: #0f172a !important;
22
+ max-width: 900px;
23
+ margin: 24px auto;
24
+ padding: 28px 20px;
25
+ border-radius: 12px;
26
+ box-shadow: 0 2px 8px rgba(0,0,0,0.05);
27
+ }
28
+
29
+ /* Make sure headings, text all stay dark */
30
  #classifier-page h1,
31
  #classifier-page h2,
32
  #classifier-page h3,
 
38
  #classifier-page td,
39
  #classifier-page th {
40
  color: #0f172a !important;
41
+ background: transparent !important;
42
+ }
43
+
44
+ /* Pill badges (for accuracy/explanation/report) */
45
+ .pill {
46
+ padding: 6px 10px;
47
+ border-radius: 999px;
48
+ font-size: 12px;
49
+ font-weight: 500;
50
+ display: inline-block;
51
  }
52
+ .pill-blue { background:#eef2ff; color:#3730a3; }
53
+ .pill-cyan { background:#ecfeff; color:#155e75; }
54
+ .pill-green { background:#f0fdf4; color:#166534; }
55
+ .pill-orange { background:#fff7ed; color:#9a3412; }
56
  </style>
57
  </head>
58
 
59
  <body>
60
+ <div id="classifier-page">
 
 
 
 
 
 
 
61
 
62
  <!-- Header -->
63
  <h1 style="margin:0 0 8px; font-size:32px;">mtDNA Location Classifier</h1>
 
66
  The tool suggests structured labels fast — you decide which ones to trust and refine.
67
  </p>
68
 
69
+ <!-- Badges -->
70
  <div style="display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 24px;">
71
+ <span class="pill pill-blue">84% country accuracy (n=4,934)</span>
72
+ <span class="pill pill-cyan">92% modern/ancient accuracy (n=4,934)</span>
73
+ <span class="pill pill-green">Source-backed explanations</span>
74
+ <span class="pill pill-orange">Report → free credit</span>
75
  </div>
76
 
77
  <hr style="border:none; border-top:1px solid #e2e8f0; margin:24px 0;">
 
161
  for some <em>edge cases</em> were more accurate than his manual annotations — even when metadata was missing.
162
  </div>
163
 
164
+ <hr>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
165
 
166
+ <h2 id="research-supporter" style="margin:24px 0 8px; font-size:22px;">Research Partner Plan (for early supporters)</h2>
167
+ <p>
168
+ Designed for researchers running larger studies who want to support ongoing development while staying on budget.
169
+ Instead of paying strictly per sample, you can join as a <strong>Research Partner</strong>:
170
+ </p>
171
+ <ul>
172
+ <li><strong>$300 flat contribution</strong> (covers ~3,000 samples at $0.10 each, with flexibility on usage)</li>
173
+ <li>Includes early access to new features and custom labels</li>
174
+ <li>Direct feedback channel — help shape how the tool evolves</li>
175
+ <li>Recognition as an early research supporter</li>
176
+ </ul>
177
+ <p>
178
+ <em>This tier was inspired by our very first paying researcher, who contributed $300 to support
179
+ continued development after testing thousands of samples. It’s ideal if you see the potential
180
+ and want to support the mission, even if you’re still validating outputs in your workflow.</em>
181
+ </p>
182
 
183
  <!-- Who it's for -->
184
  <h2 style="margin:24px 0 8px; font-size:22px;">Best for</h2>