{% extends 'ef_basic_input.html' %}

{% block input %}
	{# TODO: this needs improving for BS4 #}
	{% if not field.readonly or field.value == 'male' %}
		<div>
			<input id="{{ field.id }}-male" name="{{ field.name }}" type="radio"
				   value="male"
				   {% if field.value == 'male' %}checked="checked"{% endif %}>
			<label for="{{ field.id }}-male">
				<img src="{{ url_for('static', filename='img/male-symbol.png') }}"
					 alt="Male Symbol" height="30px">
				Male
			</label>
		</div>
	{% endif %}

	{% if not field.readonly or field.value == 'female' %}
		<div>
			<input id="{{ field.id }}-female" name="{{ field.name }}" type="radio"
				   value="female"
				   {% if field.value == 'female' %}checked="checked"{% endif %}>
			<label for="{{ field.id }}-female">
				<img src="{{ url_for('static', filename='img/female-symbol.png') }}"
					 alt="Female Symbol" height="30px">
				Female
			</label>
		</div>
	{% endif %}

	{% if field.style == styles.BOOTSTRAP_4 and field.error %}
		<span class="{{ field.input_classes }}" style="display: none;"></span>
	{% endif %}
{% endblock input %}
