Hugging Face's logo

Spaces:
G-Rost
/
pick-spaces
Running

App Files Community
openfree commited on
Commit
ce5b97d
·
verified ·
1 Parent(s): 3de94b9

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +69 -28
index.html CHANGED
@@ -77,6 +77,7 @@
77
  font-size: 10px;
78
  border-radius: 3px;
79
  margin-top: 5px;
 
80
  }
81
  .tag.open-source {
82
  background-color: #4caf50;
@@ -125,26 +126,19 @@
125
  background: #555;
126
  }
127
 
128
- .tag.text {
129
- background-color: #9c27b0;
130
- color: white;
131
- }
132
- .tag.audio {
133
- background-color: #ff9800;
134
- color: white;
135
- }
136
- .tag.vision {
137
- background-color: #03a9f4;
138
- color: white;
139
- }
140
- .tag.multimodal {
141
- background-color: #795548;
142
- color: white;
143
- }
144
- .tag.announcement {
145
- background-color: #607d8b;
146
- color: white;
147
- }
148
 
149
  .filter-group {
150
  display: flex;
@@ -208,6 +202,40 @@
208
  margin: 0 10px;
209
  color: #ddd;
210
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
211
  </style>
212
  </head>
213
  <body>
@@ -221,13 +249,25 @@
221
  <button class="toggle-button" data-filter="proprietary">Proprietary Software</button>
222
  </div>
223
  <div class="dropdown-filters">
224
- <select id="modalityFilter" onchange="filterByModality(this.value)">
225
- <option value="all">All Modalities</option>
226
- <option value="text">Text</option>
227
- <option value="audio">Audio</option>
228
- <option value="vision">Vision</option>
229
- <option value="multimodal">Multimodal</option>
230
- </select>
 
 
 
 
 
 
 
 
 
 
 
 
231
  <select id="typeFilter" onchange="filterByType(this.value)">
232
  <option value="all">All Types</option>
233
  <option value="model">Models</option>
@@ -246,7 +286,7 @@
246
  </div>
247
  <div class="timeline">
248
  <div class="month">
249
- <h3>January 2025</h3>
250
  <div class="event">
251
  <h4>OpenBMB PRIME</h4>
252
  <p>o1 like Eurus 2 7B (<a href="https://huggingface.co/PRIME-RL/Eurus-2-7B-PRIME" target="_blank">link</a>).</p>
@@ -284,6 +324,7 @@
284
 
285
  function filterByModality(modality) {
286
  currentFilters.modality = modality;
 
287
  applyFilters();
288
  }
289
 
 
77
  font-size: 10px;
78
  border-radius: 3px;
79
  margin-top: 5px;
80
+ margin-right: 3px;
81
  }
82
  .tag.open-source {
83
  background-color: #4caf50;
 
126
  background: #555;
127
  }
128
 
129
+ .tag.best { background-color: #FFD700; color: black; }
130
+ .tag.new { background-color: #FF4081; color: white; }
131
+ .tag.text { background-color: #9c27b0; color: white; }
132
+ .tag.audio { background-color: #ff9800; color: white; }
133
+ .tag.vision { background-color: #03a9f4; color: white; }
134
+ .tag.multimodal { background-color: #795548; color: white; }
135
+ .tag.video { background-color: #E91E63; color: white; }
136
+ .tag.image { background-color: #00BCD4; color: white; }
137
+ .tag.utility { background-color: #9E9E9E; color: white; }
138
+ .tag.predict { background-color: #673AB7; color: white; }
139
+ .tag.game { background-color: #4CAF50; color: white; }
140
+ .tag.education { background-color: #3F51B5; color: white; }
141
+ .tag.announcement { background-color: #607d8b; color: white; }
 
 
 
 
 
 
 
142
 
143
  .filter-group {
144
  display: flex;
 
202
  margin: 0 10px;
203
  color: #ddd;
204
  }
205
+
206
+ .nested-dropdown {
207
+ position: relative;
208
+ display: inline-block;
209
+ }
210
+
211
+ .nested-content {
212
+ display: none;
213
+ position: absolute;
214
+ background-color: white;
215
+ min-width: 160px;
216
+ box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
217
+ z-index: 1;
218
+ border-radius: 5px;
219
+ margin-top: 5px;
220
+ }
221
+
222
+ .nested-content button {
223
+ width: 100%;
224
+ padding: 8px 16px;
225
+ border: none;
226
+ background: none;
227
+ text-align: left;
228
+ cursor: pointer;
229
+ font-size: 13px;
230
+ }
231
+
232
+ .nested-content button:hover {
233
+ background-color: #f1f1f1;
234
+ }
235
+
236
+ .nested-dropdown:hover .nested-content {
237
+ display: block;
238
+ }
239
  </style>
240
  </head>
241
  <body>
 
249
  <button class="toggle-button" data-filter="proprietary">Proprietary Software</button>
250
  </div>
251
  <div class="dropdown-filters">
252
+ <div class="nested-dropdown">
253
+ <select id="modalityFilter">
254
+ <option value="all">All Modalities</option>
255
+ </select>
256
+ <div class="nested-content">
257
+ <button onclick="filterByModality('best')">BEST</button>
258
+ <button onclick="filterByModality('new')">NEW</button>
259
+ <button onclick="filterByModality('text')">Text</button>
260
+ <button onclick="filterByModality('audio')">Audio</button>
261
+ <button onclick="filterByModality('vision')">Vision</button>
262
+ <button onclick="filterByModality('multimodal')">Multimodal</button>
263
+ <button onclick="filterByModality('video')">Video</button>
264
+ <button onclick="filterByModality('image')">Image</button>
265
+ <button onclick="filterByModality('utility')">Utility</button>
266
+ <button onclick="filterByModality('predict')">Predict</button>
267
+ <button onclick="filterByModality('game')">Game</button>
268
+ <button onclick="filterByModality('education')">Education</button>
269
+ </div>
270
+ </div>
271
  <select id="typeFilter" onchange="filterByType(this.value)">
272
  <option value="all">All Types</option>
273
  <option value="model">Models</option>
 
286
  </div>
287
  <div class="timeline">
288
  <div class="month">
289
+ <h3>Latest Models</h3>
290
  <div class="event">
291
  <h4>OpenBMB PRIME</h4>
292
  <p>o1 like Eurus 2 7B (<a href="https://huggingface.co/PRIME-RL/Eurus-2-7B-PRIME" target="_blank">link</a>).</p>
 
324
 
325
  function filterByModality(modality) {
326
  currentFilters.modality = modality;
327
+ document.getElementById('modalityFilter').value = 'all';
328
  applyFilters();
329
  }
330