Spaces:
Running
Running
Update app.py
Browse files
app.py
CHANGED
@@ -251,6 +251,9 @@ body{margin:0;font-family:Nunito,sans-serif;background:#f6f8fb;}
|
|
251 |
.frame{flex:1;position:relative;overflow:hidden;}
|
252 |
.frame iframe{position:absolute;width:166.667%;height:166.667%;transform:scale(.6);transform-origin:top left;border:0;}
|
253 |
.frame img{width:100%;height:100%;object-fit:cover;}
|
|
|
|
|
|
|
254 |
.foot{height:44px;background:#fafafa;display:flex;align-items:center;justify-content:center;border-top:1px solid #eee;}
|
255 |
.foot a{font-size:.82rem;font-weight:700;color:#4a6dd8;text-decoration:none;}
|
256 |
.pagination{display:flex;justify-content:center;margin:20px 0;gap:10px;}
|
@@ -365,6 +368,7 @@ function loadFavorites(page) {
|
|
365 |
if(item.mode === 'snapshot') {
|
366 |
html += `
|
367 |
<div class="card">
|
|
|
368 |
<div class="frame">
|
369 |
<img src="${item.preview_url}" loading="lazy">
|
370 |
</div>
|
@@ -376,6 +380,7 @@ function loadFavorites(page) {
|
|
376 |
} else {
|
377 |
html += `
|
378 |
<div class="card">
|
|
|
379 |
<div class="frame">
|
380 |
<iframe src="${item.preview_url}" loading="lazy" sandbox="allow-forms allow-modals allow-popups allow-same-origin allow-scripts allow-downloads"></iframe>
|
381 |
</div>
|
|
|
251 |
.frame{flex:1;position:relative;overflow:hidden;}
|
252 |
.frame iframe{position:absolute;width:166.667%;height:166.667%;transform:scale(.6);transform-origin:top left;border:0;}
|
253 |
.frame img{width:100%;height:100%;object-fit:cover;}
|
254 |
+
.card-label{position:absolute;top:10px;left:10px;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:bold;z-index:100;text-transform:uppercase;letter-spacing:0.5px;box-shadow:0 2px 4px rgba(0,0,0,0.2);}
|
255 |
+
.label-live{background:linear-gradient(135deg, #00c6ff, #0072ff);color:white;}
|
256 |
+
.label-static{background:linear-gradient(135deg, #ff9a9e, #fad0c4);color:#333;}
|
257 |
.foot{height:44px;background:#fafafa;display:flex;align-items:center;justify-content:center;border-top:1px solid #eee;}
|
258 |
.foot a{font-size:.82rem;font-weight:700;color:#4a6dd8;text-decoration:none;}
|
259 |
.pagination{display:flex;justify-content:center;margin:20px 0;gap:10px;}
|
|
|
368 |
if(item.mode === 'snapshot') {
|
369 |
html += `
|
370 |
<div class="card">
|
371 |
+
<div class="card-label label-static">Static</div>
|
372 |
<div class="frame">
|
373 |
<img src="${item.preview_url}" loading="lazy">
|
374 |
</div>
|
|
|
380 |
} else {
|
381 |
html += `
|
382 |
<div class="card">
|
383 |
+
<div class="card-label label-live">LIVE</div>
|
384 |
<div class="frame">
|
385 |
<iframe src="${item.preview_url}" loading="lazy" sandbox="allow-forms allow-modals allow-popups allow-same-origin allow-scripts allow-downloads"></iframe>
|
386 |
</div>
|