Spaces:
Paused
Paused
| <html lang="fr"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>PixelDrive — Partage sécurisé</title> | |
| __OG_META__ | |
| <style> | |
| :root{--bg:#0d0f1a;--panel:#151827;--border:#262a3f;--primary:#6366f1;--text:#f4f4f5;--muted:#9aa0b4;--danger:#ef4444} | |
| *{box-sizing:border-box;margin:0;padding:0} | |
| body{font-family:'Inter',-apple-system,'Segoe UI',Roboto,sans-serif;background:radial-gradient(1200px 600px at 70% -10%,rgba(99,102,241,.15),transparent),var(--bg);color:var(--text);min-height:100dvh;display:flex;flex-direction:column} | |
| .top{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border)} | |
| .logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.05rem} | |
| .logo svg{width:22px;height:22px;stroke:var(--primary);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} | |
| .badge{font-size:.65rem;color:var(--primary);border:1px solid var(--primary);padding:3px 8px;border-radius:99px;letter-spacing:.06em;text-transform:uppercase} | |
| main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;gap:18px} | |
| .card{width:min(920px,100%);background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:220px} | |
| .card img,.card video{width:100%;max-height:70vh;object-fit:contain;background:#000} | |
| .card audio{width:90%;margin:40px 0} | |
| .card iframe{width:100%;height:70vh;border:none} | |
| .card .no{padding:48px;text-align:center;color:var(--muted)} | |
| .card .no svg{width:56px;height:56px;stroke:var(--muted);fill:none;stroke-width:1.5;margin-bottom:12px;stroke-linecap:round;stroke-linejoin:round} | |
| .card .no.err{color:var(--danger);font-weight:600} | |
| .meta{text-align:center;max-width:90%} | |
| .name{font-weight:600;font-size:1.05rem;word-break:break-all} | |
| .sub{color:var(--muted);font-size:.8rem;margin-top:4px} | |
| .btn{display:inline-flex;align-items:center;gap:8px;background:var(--primary);color:#fff;text-decoration:none;padding:12px 22px;border-radius:10px;font-weight:600;font-size:.95rem;transition:filter .15s} | |
| .btn:hover{filter:brightness(1.1)} | |
| .btn svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} | |
| .foot{color:var(--muted);font-size:.7rem;margin-top:6px} | |
| </style> | |
| </head> | |
| <body> | |
| <header class="top"> | |
| <div class="logo"><svg viewBox="0 0 24 24"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/></svg> PixelDrive</div> | |
| <span class="badge">Zero-Knowledge</span> | |
| </header> | |
| <main> | |
| <div class="card" id="player"></div> | |
| <div class="meta"><div class="name" id="fname"></div><div class="sub" id="fsize"></div></div> | |
| <a class="btn" id="dl" download><svg viewBox="0 0 24 24"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg> Télécharger</a> | |
| <p class="foot">Chiffré AES-256-GCM · Propulsé par PixelDrive</p> | |
| </main> | |
| <script> | |
| const D = __EMBED_DATA__; | |
| const $ = id => document.getElementById(id); | |
| function fmt(b){if(b==null)return'—';if(b<1024)return b+' B';if(b<1048576)return(b/1024).toFixed(0)+' KB';if(b<1073741824)return(b/1048576).toFixed(1)+' MB';return(b/1073741824).toFixed(2)+' GB'} | |
| if (D.error) { | |
| $('player').innerHTML = '<div class="no err">' + D.error + '</div>'; | |
| $('dl').style.display = 'none'; | |
| } else { | |
| document.title = D.name + ' · PixelDrive'; | |
| $('fname').textContent = D.name; | |
| $('fsize').textContent = fmt(D.size) + ' · ' + (D.mime || ''); | |
| $('dl').href = D.dl; | |
| const m = D.mime || ''; | |
| if (m.startsWith('image/')) $('player').innerHTML = '<img src="' + D.dl + '" alt="">'; | |
| else if (m.startsWith('video/')) $('player').innerHTML = '<video controls playsinline src="' + D.dl + '"></video>'; | |
| else if (m.startsWith('audio/')) $('player').innerHTML = '<audio controls src="' + D.dl + '"></audio>'; | |
| else if (m === 'application/pdf') $('player').innerHTML = '<iframe src="' + D.dl + '"></iframe>'; | |
| else $('player').innerHTML = '<div class="no"><svg viewBox="0 0 24 24"><path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"/><polyline points="13 2 13 9 20 9"/></svg><div>Aperçu non disponible</div></div>'; | |
| } | |
| </script> | |
| </body> | |
| </html> |