diff --git a/TODO.md b/TODO.md index 8120b73..3ccf568 100644 --- a/TODO.md +++ b/TODO.md @@ -1,3 +1,4 @@ # TODO - [x] Fix CSP: add `frame-src` to allow iframes from `videos.erg.be` and `depnum.happyngreen.fr` +- [x] Website iframe overlay: remove blur, move button to bottom-right, replace text with SVG icon + tooltip diff --git a/app/public/assets/css/tfe.css b/app/public/assets/css/tfe.css index 71f3086..11f40ee 100644 --- a/app/public/assets/css/tfe.css +++ b/app/public/assets/css/tfe.css @@ -145,44 +145,28 @@ border-radius: var(--radius); } -.tfe-website-overlay { +.tfe-website-open-btn { position: absolute; - inset: 0; - z-index: 1; + bottom: var(--space-xs); + right: var(--space-xs); + z-index: 2; display: grid; place-items: center; - background: rgb(0 0 0 / 0.12); - backdrop-filter: blur(4px) saturate(0.6); - transition: background 0.2s; - pointer-events: none; -} - -.tfe-website-overlay:hover { - background: rgb(0 0 0 / 0.06); -} - -.tfe-website-open-btn { - pointer-events: auto; - display: inline-grid; - grid-auto-flow: column; - align-items: center; - gap: var(--space-2xs); - padding: var(--space-xs) var(--space-m); + width: 40px; + height: 40px; background: var(--accent-primary); color: #fff; border: none; border-radius: var(--radius); - font-size: var(--step-0); - font-weight: 500; text-decoration: none; cursor: pointer; - box-shadow: 0 2px 8px rgb(0 0 0 / 0.2); + box-shadow: 0 2px 8px rgb(0 0 0 / 0.25); transition: transform 0.15s, box-shadow 0.15s; } .tfe-website-open-btn:hover { transform: translateY(-1px); - box-shadow: 0 4px 12px rgb(0 0 0 / 0.25); + box-shadow: 0 4px 12px rgb(0 0 0 / 0.35); background: var(--accent-primary); color: #fff; } diff --git a/app/templates/public/tfe.php b/app/templates/public/tfe.php index f8c3f0c..177f590 100644 --- a/app/templates/public/tfe.php +++ b/app/templates/public/tfe.php @@ -390,14 +390,14 @@
Site web -
- - Ouvrir le site web ↗ - -
+ + +