feat: replace native file input with styled button in photo gallery

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Stephan Kerkman 2026-05-31 14:41:10 +02:00
parent 665d5196d1
commit 300f14eb42

View file

@ -38,8 +38,10 @@
hx-encoding="multipart/form-data" hx-indicator="#photo-upload-spinner">
{% csrf_token %}
<div class="d-flex gap-2 align-items-center flex-wrap">
<input type="file" name="image" accept="image/*"
class="form-control form-control-sm" style="max-width:220px;">
<label class="btn btn-sm btn-outline-secondary mb-0" for="photo-upload-input">📷 Choose photo</label>
<input type="file" id="photo-upload-input" name="image" accept="image/*" class="d-none"
onchange="document.getElementById('photo-filename').textContent = this.files[0]?.name || ''">
<span id="photo-filename" class="text-muted small"></span>
<button type="submit" class="btn btn-sm btn-outline-secondary">Upload</button>
<span id="photo-upload-spinner" class="htmx-indicator text-muted small">Uploading…</span>
</div>