feat(modals): editor template that extends base_layout
Lifts the file editor markup out of overlay_detail.html into its own
template with server-side filename, content, byte count, and download
URL pre-filled. Uses {% extends base_layout %} so the same template
renders as either a full page or a layoutless modal fragment.
Binary replace UI deferred — pilot scope is editable text files only.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
82c3f041ce
commit
a26b4cc34e
1 changed files with 47 additions and 0 deletions
47
l4d2web/l4d2web/templates/overlay_file_editor.html
Normal file
47
l4d2web/l4d2web/templates/overlay_file_editor.html
Normal file
|
|
@ -0,0 +1,47 @@
|
||||||
|
{% extends base_layout %}
|
||||||
|
{% block title %}Edit {{ rel_path }} · {{ overlay.name }}{% endblock %}
|
||||||
|
{% block extra_head %}{% include "_editor_assets.html" %}{% endblock %}
|
||||||
|
{% block content %}
|
||||||
|
<dialog id="files-editor-modal" class="modal modal-wide" open aria-labelledby="files-editor-title">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h2 id="files-editor-title" class="files-editor-path">
|
||||||
|
<span class="files-editor-title-text">{{ rel_path }}</span>
|
||||||
|
</h2>
|
||||||
|
<button type="button" class="modal-close" data-modal-dismiss aria-label="Close">×</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<label class="files-editor-field">
|
||||||
|
<span class="files-field-label">Filename</span>
|
||||||
|
<input type="text" class="files-editor-filename" data-editor-filename autocomplete="off" spellcheck="false" value="{{ rel_path }}">
|
||||||
|
</label>
|
||||||
|
<p class="files-editor-rename-hint" hidden>↻ Save will rename <code class="files-rename-from"></code> → <code class="files-rename-to"></code>.</p>
|
||||||
|
|
||||||
|
<div class="files-editor-text">
|
||||||
|
<label class="files-editor-field files-editor-language-field">
|
||||||
|
<span class="files-field-label">Language</span>
|
||||||
|
<select data-editor-language-select aria-label="Editor language">
|
||||||
|
<option value="auto">auto (from filename)</option>
|
||||||
|
<option value="srccfg">srccfg (.cfg)</option>
|
||||||
|
<option value="bash">bash (.sh)</option>
|
||||||
|
<option value="plain">plain</option>
|
||||||
|
</select>
|
||||||
|
</label>
|
||||||
|
<label class="files-editor-field">
|
||||||
|
<span class="files-field-label">Content</span>
|
||||||
|
<div class="editor-mount" style="--editor-rows: 14"><textarea class="files-editor-content" rows="14" spellcheck="false" data-editor-language="auto" data-overlay-id="{{ overlay.id }}" data-rel-path="{{ rel_path }}">{{ content }}</textarea></div>
|
||||||
|
</label>
|
||||||
|
<div class="files-editor-meta muted">
|
||||||
|
<span class="files-editor-byte-count">UTF-8 · {{ byte_count }} bytes</span>
|
||||||
|
<span>Ctrl+S to save</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer files-editor-footer">
|
||||||
|
<button type="button" class="danger-outline files-editor-delete">Delete</button>
|
||||||
|
<span class="files-editor-footer-spacer"></span>
|
||||||
|
<a class="button-secondary files-editor-download" href="/overlays/{{ overlay.id }}/files/download?path={{ rel_path|urlencode }}">⬇ Download</a>
|
||||||
|
<button type="button" class="button-secondary" data-modal-dismiss>Cancel</button>
|
||||||
|
<button type="button" class="files-editor-save">Save</button>
|
||||||
|
</div>
|
||||||
|
</dialog>
|
||||||
|
{% endblock %}
|
||||||
Loading…
Reference in a new issue