mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-02-14 07:24:22 -05:00
Adds ability to have inline radio buttons using the fieldset.inline functionality from gov.uk elements. Then implements this for the radio buttons for choosing postage class. Also overrides the gov uk elements styling for the inline radio buttons to place them slightly closer together as this looks better.
97 lines
3.7 KiB
HTML
97 lines
3.7 KiB
HTML
{% macro select(field, hint=None, disable=[], option_hints={}, hide_legend=False, collapsible_opts={}, legend_style="text", input="radio", inline=False) %}
|
|
{% call select_wrapper(
|
|
field, hint, disable, option_hints, hide_legend, collapsible_opts, legend_style, inline=inline
|
|
) %}
|
|
{% for option in field %}
|
|
{{ select_input(option, disable, option_hints, input=input) }}
|
|
{% endfor %}
|
|
{% endcall %}
|
|
{% endmacro %}
|
|
|
|
|
|
{% macro select_list(options, child_map, disable=[], option_hints={}, input="radio") %}
|
|
<ul>
|
|
{% for option in options %}
|
|
{% if child_map[option.data] %}
|
|
{% call select_input(option, disable, option_hints, as_list_item=True, input=input) %}
|
|
{{ select_list(child_map[option.data], child_map, disable, option_hints, input=input) }}
|
|
{% endcall %}
|
|
{% else %}
|
|
{{ select_input(option, disable, option_hints, as_list_item=True, input=input) }}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</ul>
|
|
{% endmacro %}
|
|
|
|
|
|
{% macro select_nested(field, child_map, hint=None, disable=[], option_hints={}, hide_legend=False, collapsible_opts={}, legend_style="text", input="radio") %}
|
|
{% call select_wrapper(
|
|
field, hint, disable, option_hints, hide_legend, collapsible_opts, legend_style
|
|
) %}
|
|
<div class="{{ "radios" if input == "radio" else "checkboxes" }}-nested">
|
|
{{ select_list(child_map[None], child_map, disable, option_hints, input=input) }}
|
|
</div>
|
|
{% endcall %}
|
|
{% endmacro %}
|
|
|
|
|
|
{% macro select_wrapper(field, hint=None, disable=[], option_hints={}, hide_legend=False, collapsible_opts={}, legend_style="text", inline=False) %}
|
|
{% set is_collapsible = collapsible_opts|length %}
|
|
<div class="form-group {% if field.errors %} form-group-error{% endif %}"{% if is_collapsible %} data-module="collapsible-checkboxes"{% if collapsible_opts.field %} data-field-label="{{ collapsible_opts.field }}"{% endif %}{% endif %}>
|
|
{% if is_collapsible %}
|
|
<div class="selection-summary" role="region" aria-live="polite"></div>
|
|
{% endif %}
|
|
<fieldset id="{{ field.id }}" {% if inline %}class="inline"{% endif %}>
|
|
<legend class="{{ 'form-label' if not hide_legend else '' }}{% if legend_style != 'text' %} {{ legend_style }}{% endif %}">
|
|
{% if hide_legend %}<span class="visually-hidden">{% endif %}
|
|
{{ field.label.text|safe }}
|
|
{% if hide_legend %}</span>{% endif %}
|
|
{% if hint %}
|
|
<span class="form-hint">
|
|
{{ hint }}
|
|
</span>
|
|
{% endif %}
|
|
{% if field.errors %}
|
|
<span class="error-message" data-module="track-error" data-error-type="{{ field.errors[0] }}" data-error-label="{{ field.name }}">
|
|
{{ field.errors[0] }}
|
|
</span>
|
|
{% endif %}
|
|
</legend>
|
|
{{ caller() }}
|
|
</fieldset>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{% macro select_input(option, disable=[], option_hints={}, data_target=None, as_list_item=False, input="radio") %}
|
|
{% if as_list_item %}
|
|
<li class="multiple-choice" {% if data_target %}data-target="{{ data_target }}"{% endif %}>
|
|
{% else %}
|
|
<div class="multiple-choice" {% if data_target %}data-target="{{ data_target }}"{% endif %}>
|
|
{% endif %}
|
|
<input
|
|
id="{{ option.id }}" name="{{ option.name }}" type="{{ input }}" value="{{ option.data }}"
|
|
{% if option.data in disable %}
|
|
disabled
|
|
{% endif %}
|
|
{% if option.checked %}
|
|
checked
|
|
{% endif %}
|
|
>
|
|
<label class="block-label" for="{{ option.id }}">
|
|
{{ option.label.text }}
|
|
{% if option_hints[option.data] %}
|
|
<div class="block-label-hint">
|
|
{{ option_hints[option.data] }}
|
|
</div>
|
|
{% endif %}
|
|
</label>
|
|
{% if caller %}
|
|
{{ caller() }}
|
|
{% endif %}
|
|
{% if as_list_item %}
|
|
</li>
|
|
{% else %}
|
|
</div>
|
|
{% endif %}
|
|
{% endmacro %}
|