iframe zoom#116
Conversation
There was a problem hiding this comment.
Pull request overview
Updates the feed page’s embedded visualization iframe markup to support a zoomed display and additional iframe permissions.
Changes:
- Converts the iframe HTML from a single-line tag to a multi-line block for readability.
- Adds CSS
zoom: 0.80to scale iframe content. - Adds an iframe
allowpermissions policy (fullscreen, clipboard-write, autoplay).
| <iframe src="{url}" style="height: 100%; width: 100%; border: none;" frameborder="0"></iframe> | ||
| <iframe | ||
| src="{url}" | ||
| style="height: 100%; width: 100%; border: none;zoom:0.80" |
There was a problem hiding this comment.
zoom is a non-standard CSS property and won’t work in some browsers (notably Firefox), so the iframe scaling will be inconsistent. Consider using a standards-based approach (e.g., CSS transform: scale(...) with transform-origin and compensating width/height) or applying scaling at the content level instead of relying on zoom.
| style="height: 100%; width: 100%; border: none;zoom:0.80" | |
| style="height: calc(100% / 0.8); width: calc(100% / 0.8); border: none; transform: scale(0.8); transform-origin: 0 0;" |
| src="{url}" | ||
| style="height: 100%; width: 100%; border: none;zoom:0.80" | ||
| frameborder="0" | ||
| allow="fullscreen; clipboard-write; autoplay" |
There was a problem hiding this comment.
The new iframe allow list grants clipboard-write and autoplay, which expands what embedded apps can do in the browser. If the snippet content is user-provided, it’s safer to keep this list minimal (e.g., only enable fullscreen if that’s the goal). Also, if fullscreen support is required across browsers, consider adding the boolean allowfullscreen attribute (some browsers rely on it even when allow="fullscreen" is present).
| allow="fullscreen; clipboard-write; autoplay" | |
| allow="fullscreen" | |
| allowfullscreen |
No description provided.