darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-20 14:29:51 -04:00
Code Issues Packages Projects Releases Wiki Activity

Migrate radio buttons from GOV.UK to USWDS

Browse Source 
- Replace .multiple-choice with .usa-radio classes
- Update radio templates to use USWDS patterns
- Remove GOV.UK dependencies from radio components
- Convert nested lists to flat divs with USWDS margin utilities
- Update tests to use new radio classes
This commit is contained in:
alexjanousekGSA
2025-07-09 16:40:34 -03:00
parent 5d1e1caf24
commit a691f5c0dd
5 changed files with 19 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/templates/components/radios.html
View File

@@ -40,7 +40,7 @@
<div class="radio-select" data-module="radio-select" data-categories="{{ field.categories|join(',') }}" data-show-now-as-default="{{ show_now_as_default|string|lower }}">
<div class="radio-select-column">
{% for option in field %}
<div class="multiple-choice">
<div class="usa-radio">
{{ option }}
<label for="{{ option.id }}">
{{ option.label.text }}

27
app/templates/components/select-input.html
View File

@@ -9,18 +9,19 @@
{% endmacro %}
{% macro select_list(options, child_map, disable=[], option_hints={}, input="radio") %}
<ul>
{% macro select_list(options, child_map, disable=[], option_hints={}, input="radio", indent_level=0) %}
{% 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 %}
<div class="{% if indent_level > 0 %}margin-left-{{ indent_level * 4 }}{% endif %}">
{{ select_input(option, disable, option_hints, as_list_item=False, input=input) }}
</div>
{{ select_list(child_map[option.data], child_map, disable, option_hints, input=input, indent_level=indent_level + 1) }}
{% else %}
{{ select_input(option, disable, option_hints, as_list_item=True, input=input) }}
<div class="{% if indent_level > 0 %}margin-left-{{ indent_level * 4 }}{% endif %}">
{{ select_input(option, disable, option_hints, as_list_item=False, input=input) }}
</div>
{% endif %}
{% endfor %}
</ul>
{% endmacro %}
@@ -63,11 +64,7 @@
{% 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 test-one" {% if data_target %}data-target="{{ data_target }}"{% endif %}>
{% else %}
<div class="usa-radio" {% if data_target %}data-target="{{ data_target }}"{% endif %}>
{% endif %}
<input
id="{{ option.id }}" class="usa-radio__input" name="{{ option.name }}" type="{{ input }}" value="{{ option.data }}"
{% if option.data in disable %}
@@ -80,17 +77,13 @@
<label class="usa-radio__label" for="{{ option.id }}">
{{ option.label.text }}
{% if option_hints[option.data] %}
<div class="block-label-hint">
<span class="usa-hint">
{{ option_hints[option.data] }}
</div>
</span>
{% endif %}
</label>
{% if caller %}
{{ caller() }}
{% endif %}
{% if as_list_item %}
</li>
{% else %}
</div>
{% endif %}
{% endmacro %}