|
<!doctype html>
|
|
<html lang="fr"><head><meta charset="utf-8">
|
|
<style>
|
|
:root{ --bg:#f8fafc; --card:#fff; --ink:#0f172a; --muted:#64748b; --line:#e2e8f0;
|
|
--primary:#0f172a; --green:#16a34a; --greenbg:#dcfce7; --red:#dc2626; --redbg:#fee2e2;
|
|
--amber:#b45309; --amberbg:#fef3c7; }
|
|
*{box-sizing:border-box} body{margin:0;background:var(--bg);font-family:Inter,system-ui,Arial,sans-serif;color:var(--ink)}
|
|
.wrap{max-width:1000px;margin:0 auto;padding:32px}
|
|
.crumb{font-size:12px;color:var(--muted);margin-bottom:6px}
|
|
h1{font-size:22px;margin:0 0 4px} .lead{color:var(--muted);font-size:13px;margin:0 0 22px}
|
|
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.04);margin-bottom:18px}
|
|
.card-h{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
|
|
.card-h .t{font-weight:600;font-size:14px;display:flex;align-items:center;gap:8px}
|
|
.card-h .t .ic{width:22px;height:22px;border-radius:6px;background:#eef2ff;color:#4f46e5;display:flex;align-items:center;justify-content:center;font-size:12px}
|
|
.btn{font-size:12.5px;font-weight:600;border-radius:8px;padding:8px 13px;border:1px solid var(--line);background:#fff;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
|
|
.btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}
|
|
.btn.ghost{background:transparent}
|
|
.btn.danger{color:var(--red);border-color:#fecaca}
|
|
table{width:100%;border-collapse:collapse;font-size:13px}
|
|
th{ text-align:left;color:var(--muted);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.04em;padding:11px 20px;border-bottom:1px solid var(--line)}
|
|
td{padding:13px 20px;border-bottom:1px solid var(--line);vertical-align:middle}
|
|
tr:last-child td{border-bottom:none}
|
|
.link{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:#334155;background:#f1f5f9;padding:3px 8px;border-radius:6px}
|
|
.badge{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px}
|
|
.b-active{background:var(--greenbg);color:var(--green)} .b-revoked{background:var(--redbg);color:var(--red)}
|
|
.b-exp{background:var(--amberbg);color:var(--amber)}
|
|
.res{font-weight:600} .sub{color:var(--muted);font-size:11.5px}
|
|
.acts{display:flex;gap:8px;justify-content:flex-end}
|
|
.iconbtn{width:30px;height:30px;border-radius:7px;border:1px solid var(--line);background:#fff;cursor:pointer;color:#475569;display:inline-flex;align-items:center;justify-content:center;font-size:13px}
|
|
</style></head>
|
|
<body>
|
|
<div class="wrap">
|
|
<div class="crumb">Paramètres › Liens publics</div>
|
|
<h1>Liens publics</h1>
|
|
<p class="lead">Générez des liens uniques pour donner accès à une page sans connexion. Révocables à tout moment.</p>
|
|
|
|
<div class="card">
|
|
<div class="card-h">
|
|
<div class="t"><span class="ic">🔗</span> Liens actifs</div>
|
|
<button class="btn primary">+ Générer un lien</button>
|
|
</div>
|
|
<table>
|
|
<thead><tr><th>Ressource</th><th>Lien public</th><th>Statut</th><th>Créé le</th><th></th></tr></thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><div class="res">Contrat — NOVÆ</div><div class="sub">Édition de contrat</div></td>
|
|
<td><span class="link">scobby.fr/contrat/8f3a…c1</span></td>
|
|
<td><span class="badge b-active">Actif</span></td>
|
|
<td class="sub">15/06/2026</td>
|
|
<td><div class="acts"><button class="iconbtn" title="Copier">⧉</button><button class="btn danger">Révoquer</button></div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><div class="res">Formulaire de confirmation — Aurora Live</div><div class="sub">Confirmation de date</div></td>
|
|
<td><span class="link">scobby.fr/confirmation/2b7e…9a</span></td>
|
|
<td><span class="badge b-active">Actif</span></td>
|
|
<td class="sub">14/06/2026</td>
|
|
<td><div class="acts"><button class="iconbtn" title="Copier">⧉</button><button class="btn danger">Révoquer</button></div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><div class="res">Dossier de presse — Festival 2026</div><div class="sub">Espace presse</div></td>
|
|
<td><span class="link">scobby.fr/presse/d40c…7f</span></td>
|
|
<td><span class="badge b-exp">Expire 30/06</span></td>
|
|
<td class="sub">10/06/2026</td>
|
|
<td><div class="acts"><button class="iconbtn" title="Copier">⧉</button><button class="btn danger">Révoquer</button></div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><div class="res">Feuille de route — Sept. 2026</div><div class="sub">Feuille de route</div></td>
|
|
<td><span class="link sub">— révoqué —</span></td>
|
|
<td><span class="badge b-revoked">Révoqué</span></td>
|
|
<td class="sub">02/06/2026</td>
|
|
<td><div class="acts"><button class="iconbtn" title="Copier" style="opacity:.4">⧉</button></div></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</body></html>
|
