mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-01 12:47:32 -04:00
4447af3fec
The default browser file upload control is difficult to style, but looks totally out of place. This commit replaces it with one that has a GOV.UK style button, as a first step. Based heavily on this example: http://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/
25 lines
710 B
HTML
25 lines
710 B
HTML
{% macro file_upload(field) %}
|
|
<div class="form-group{% if field.errors %} error{% endif %}" data-module="file-upload">
|
|
<label class="file-upload-label" for="{{ field.name }}">
|
|
{{ field.label }}
|
|
{% if hint %}
|
|
<span class="form-hint">
|
|
{{ hint }}
|
|
</span>
|
|
{% endif %}
|
|
{% if field.errors %}
|
|
<span class="error-message">
|
|
{{ field.errors[0] }}
|
|
</span>
|
|
{% endif %}
|
|
</label>
|
|
{{ field(**{
|
|
'class': 'file-upload-field'
|
|
}) }}
|
|
<label class="file-upload-button" for="{{ field.name }}">
|
|
Choose file
|
|
</label>
|
|
<label class="file-upload-filename" for="{{ field.name }}"></label>
|
|
</div>
|
|
{% endmacro %}
|