User friendly-er add cover form

bulma has failed me. Fixes #628
This commit is contained in:
Mouse Reeve 2021-02-23 13:23:41 -08:00
parent b9f06edc1b
commit ffe5ce7251
2 changed files with 5 additions and 21 deletions

View File

@ -42,26 +42,10 @@
<h3 class="title is-6 mb-1">Add cover</h3> <h3 class="title is-6 mb-1">Add cover</h3>
<form name="add-cover" method="POST" action="/upload-cover/{{ book.id }}" enctype="multipart/form-data"> <form name="add-cover" method="POST" action="/upload-cover/{{ book.id }}" enctype="multipart/form-data">
{% csrf_token %} {% csrf_token %}
<div class="field has-addons"> <label class="label">
<div class="control"> <input type="file" name="cover" accept="image/*" enctype="multipart/form-data" id="id_cover" required>
<div class="file is-small mb-1"> </label>
<label class="file-label"> <button class="button is-small is-primary" type="submit">Add</button>
<input class="file-input" type="file" name="cover" accept="image/*" enctype="multipart/form-data" id="id_cover" required>
<span class="file-cta">
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
<span class="file-label">
Choose file...
</span>
</span>
</label>
</div>
</div>
<div class="control">
<button class="button is-small is-primary" type="submit">Add</button>
</div>
</div>
</form> </form>
</div> </div>
{% endif %} {% endif %}

View File

@ -62,7 +62,7 @@
<div class="column is-narrow"> <div class="column is-narrow">
<div class="block"> <div class="block">
<h2 class="title is-4">Cover</h2> <h2 class="title is-4">Cover</h2>
<p>{{ form.cover }} </p> <p>{{ form.cover }}</p>
{% for error in form.cover.errors %} {% for error in form.cover.errors %}
<p class="help is-danger">{{ error | escape }}</p> <p class="help is-danger">{{ error | escape }}</p>
{% endfor %} {% endfor %}