Clicking the small preview thumbnail now opens an enlarged version in a dialog (fresh render, same as the old click-to-refresh), closable via the X button or a backdrop click -- mirroring #widget-dialog's existing pattern.
17 lines
1.1 KiB
HTML
17 lines
1.1 KiB
HTML
<span class="frame-name-view" id="frame-name-view">
|
|
<span id="frame-name-text">{{ frame.name or ("Frame " ~ frame.id) }}</span>
|
|
<button type="button" class="frame-name-pencil" id="frame-name-pencil" title="Rename frame" aria-label="Rename frame">✎</button>
|
|
</span>
|
|
<span class="frame-name-edit" id="frame-name-edit-row" style="display: none;">
|
|
<input type="text" id="frame-name-input" maxlength="64" value="{{ frame.name }}">
|
|
<button type="button" class="btn-inline" id="frame-name-save">Save</button>
|
|
<button type="button" class="btn-inline secondary" id="frame-name-cancel">Cancel</button>
|
|
</span>
|
|
<img id="frame-preview-thumb" class="frame-preview-thumb" alt="Live preview of what the frame is displaying" title="What the frame is currently displaying -- click to enlarge">
|
|
|
|
<dialog id="frame-preview-dialog" class="frame-preview-dialog">
|
|
<button type="button" id="frame-preview-dialog-close" class="icon-btn" aria-label="Close" title="Close">×</button>
|
|
<img id="frame-preview-dialog-img" alt="Live preview of what the frame is displaying" title="Click to refresh">
|
|
</dialog>
|
|
|