Use plus icon on add field button

This commit is contained in:
Mouse Reeve 2022-03-14 12:54:50 -07:00
parent 35e6dede09
commit 716e357060
2 changed files with 27 additions and 7 deletions

View file

@ -45,7 +45,7 @@ class EditionForm(CustomForm):
attrs={"aria-describedby": "desc_languages_help desc_languages"} attrs={"aria-describedby": "desc_languages_help desc_languages"}
), ),
"subjects": forms.TextInput( "subjects": forms.TextInput(
attrs={"aria-describedby": "desc_subjects_help desc_subjects"} attrs={"aria-describedby": "desc_subjects"}
), ),
"publishers": forms.TextInput( "publishers": forms.TextInput(
attrs={"aria-describedby": "desc_publishers_help desc_publishers"} attrs={"aria-describedby": "desc_publishers_help desc_publishers"}

View file

@ -89,7 +89,13 @@
</label> </label>
<div class="field has-addons" id="subject_field_wrapper_{{ forloop.counter }}"> <div class="field has-addons" id="subject_field_wrapper_{{ forloop.counter }}">
<div class="control is-expanded"> <div class="control is-expanded">
<input id="id_add_subject-{{ forloop.counter }}" type="text" name="subject-" value="{{ subject }}" class="input"> <input
id="id_add_subject-{{ forloop.counter }}"
type="text"
name="subjects"
value="{{ subject }}"
class="input"
>
</div> </div>
<div class="control"> <div class="control">
<button <button
@ -97,21 +103,30 @@
type="button" type="button"
data-remove="subject_field_wrapper_{{ forloop.counter }}" data-remove="subject_field_wrapper_{{ forloop.counter }}"
> >
<span class="icon icon-x" title="{% trans 'Remove' %}"> {% trans "Remove subject" as text %}
<span class="is-sr-only">{% trans "Remove" %}</span> <span class="icon icon-x" title="{{ text }}">
<span class="is-sr-only">{{ text }}</span>
</span> </span>
</button> </button>
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
<input class="input" type="text" name="add_subject" id="id_add_subject" value="{{ subject }}" {% if confirm_mode %}readonly{% endif %}> <input
class="input"
type="text"
name="subjects"
id="id_add_subject"
value="{{ subject }}"
{% if confirm_mode %}readonly{% endif %}
>
{% include 'snippets/form_errors.html' with errors_list=form.subjects.errors id="desc_subjects" %} {% include 'snippets/form_errors.html' with errors_list=form.subjects.errors id="desc_subjects" %}
</div> </div>
<span class="help"> <span class="help">
<button class="button is-small" type="button" data-duplicate="id_add_subject" id="another_subject_field"> <button class="button is-small" type="button" data-duplicate="id_add_subject" id="another_subject_field">
{% trans "Add Another Subject" %} <span class="icon icon-plus" aria-hidden="true"></span>
<span>{% trans "Add Another Subject" %}</span>
</button> </button>
</span> </span>
</div> </div>
@ -186,7 +201,12 @@
<input class="input" type="text" name="add_author" id="id_add_author" placeholder="{% trans 'Jane Doe' %}" value="{{ author }}" {% if confirm_mode %}readonly{% endif %}> <input class="input" type="text" name="add_author" id="id_add_author" placeholder="{% trans 'Jane Doe' %}" value="{{ author }}" {% if confirm_mode %}readonly{% endif %}>
{% endfor %} {% endfor %}
</div> </div>
<span class="help"><button class="button is-small" type="button" data-duplicate="id_add_author" id="another_author_field">{% trans "Add Another Author" %}</button></span> <span class="help">
<button class="button is-small" type="button" data-duplicate="id_add_author" id="another_author_field">
<span class="icon icon-plus" aria-hidden="true"></span>
<span>{% trans "Add Another Author" %}</span>
</button>
</span>
</div> </div>
</section> </section>
</div> </div>