diff --git a/src/registrar/assets/sass/_theme/_base.scss b/src/registrar/assets/sass/_theme/_base.scss index db1599621..9a6818f09 100644 --- a/src/registrar/assets/sass/_theme/_base.scss +++ b/src/registrar/assets/sass/_theme/_base.scss @@ -149,6 +149,14 @@ footer { color: color('primary'); } +.usa-footer { + margin-bottom: 0.5rem; +} + +.usa-radio { + margin-top: 1rem; +} + abbr[title] { // workaround for underlining abbr element border-bottom: none; diff --git a/src/registrar/assets/sass/_theme/_typography.scss b/src/registrar/assets/sass/_theme/_typography.scss index c60b7d802..952fc6dad 100644 --- a/src/registrar/assets/sass/_theme/_typography.scss +++ b/src/registrar/assets/sass/_theme/_typography.scss @@ -27,9 +27,8 @@ h2 { .usa-form, .usa-form fieldset { font-size: 1rem; - legend em { + .usa-legend { font-size: 1rem; - margin-bottom: 0.5rem; } } diff --git a/src/registrar/templates/django/forms/label.html b/src/registrar/templates/django/forms/label.html index 2852ce2ba..3783c0fef 100644 --- a/src/registrar/templates/django/forms/label.html +++ b/src/registrar/templates/django/forms/label.html @@ -2,8 +2,8 @@ class="{% if label_classes %} {{ label_classes }}{% endif %}{% if label_tag == 'legend' %} {{ legend_classes }}{% endif %}" {% if not field.use_fieldset %}for="{{ widget.attrs.id }}"{% endif %} > - {% if legend_label %} -

{{ legend_label }}

+ {% if legend_heading %} +

{{ legend_heading }}

{% if widget.attrs.id == 'id_additional_details-has_cisa_representative' %}

.gov is managed by the Cybersecurity and Infrastructure Security Agency. CISA has 10 regions that some organizations choose to work with. Regional representatives use titles like protective security advisors, cyber security advisors, or election security advisors.

{% endif %} diff --git a/src/registrar/templates/domain_request_additional_details.html b/src/registrar/templates/domain_request_additional_details.html index 6e28e5869..ba7a7f441 100644 --- a/src/registrar/templates/domain_request_additional_details.html +++ b/src/registrar/templates/domain_request_additional_details.html @@ -9,9 +9,9 @@ {% block form_fields %} -
+
- {% with add_class="usa-radio__input--tile" add_legend_label="Are you working with a CISA regional representative on your domain request?" %} + {% with add_class="usa-radio__input--tile" add_legend_heading="Are you working with a CISA regional representative on your domain request?" %} {% input_with_errors forms.0.has_cisa_representative %} {% endwith %} {# forms.0 is a small yes/no form that toggles the visibility of "cisa representative" formset #} @@ -26,7 +26,7 @@
- {% with add_class="usa-radio__input--tile" add_legend_label="Is there anything else you’d like us to know about your domain request?" %} + {% with add_class="usa-radio__input--tile" add_legend_heading="Is there anything else you’d like us to know about your domain request?" %} {% input_with_errors forms.2.has_anything_else_text %} {% endwith %} {# forms.2 is a small yes/no form that toggles the visibility of "cisa representative" formset #} @@ -34,7 +34,7 @@

Provide details below. *

- {% with attr_maxlength=2000 add_label_class="usa-sr-only" add_legend_class="usa-sr-only" add_legend_label="Is there anything else you’d like us to know about your domain request?" add_aria_label="Provide details below. You can enter up to 2000 characters" %} + {% with attr_maxlength=2000 add_label_class="usa-sr-only" add_legend_class="usa-sr-only" add_legend_heading="Is there anything else you’d like us to know about your domain request?" add_aria_label="Provide details below. You can enter up to 2000 characters" %} {% input_with_errors forms.3.anything_else %} {% endwith %} {# forms.3 is a form for inputting the e-mail of a cisa representative #} diff --git a/src/registrar/templates/domain_request_other_contacts.html b/src/registrar/templates/domain_request_other_contacts.html index 035fe442b..b3c1be8b4 100644 --- a/src/registrar/templates/domain_request_other_contacts.html +++ b/src/registrar/templates/domain_request_other_contacts.html @@ -18,7 +18,7 @@ {% block form_fields %}
- {% with add_class="usa-radio__input--tile" add_legend_label="Are there other employees who can help verify your request?" %} + {% with add_class="usa-radio__input--tile" add_legend_heading="Are there other employees who can help verify your request?" %} {% input_with_errors forms.0.has_other_contacts %} {% endwith %} {# forms.0 is a small yes/no form that toggles the visibility of "other contact" formset #} diff --git a/src/registrar/templatetags/field_helpers.py b/src/registrar/templatetags/field_helpers.py index 6cf671931..a1f662fba 100644 --- a/src/registrar/templatetags/field_helpers.py +++ b/src/registrar/templatetags/field_helpers.py @@ -57,7 +57,7 @@ def input_with_errors(context, field=None): # noqa: C901 legend_classes = [] group_classes = [] aria_labels = [] - legend_labels = [] + legend_headings = [] # this will be converted to an attribute string described_by = [] @@ -91,8 +91,8 @@ def input_with_errors(context, field=None): # noqa: C901 label_classes.append(value) elif key == "add_legend_class": legend_classes.append(value) - elif key == "add_legend_label": - legend_labels.append(value) + elif key == "add_legend_heading": + legend_headings.append(value) elif key == "add_group_class": group_classes.append(value) @@ -152,8 +152,8 @@ def input_with_errors(context, field=None): # noqa: C901 if legend_classes: context["legend_classes"] = " ".join(legend_classes) - if legend_labels: - context["legend_label"] = " ".join(legend_labels) + if legend_headings: + context["legend_heading"] = " ".join(legend_headings) if group_classes: context["group_classes"] = " ".join(group_classes)