Merge pull request #426 from cisagov/nmb/trim-field-labels

Remove field labels and change required text

src/registrar/templates/application_anything_else.html

@@ -5,9 +5,13 @@
   <p>Is there anything else we should know about your domain request?</p>
 {% endblock %}
 
+{% block form_required_fields_help_text %}
+{# commented out so it does not appear on this page #}
+{% endblock %}
+
 
 {% block form_fields %}
   {% with add_label_class="usa-sr-only" attr_maxlength=500 %}
     {% input_with_errors forms.0.anything_else %}
   {% endwith %}
-{% endblock %}
+{% endblock %}

src/registrar/templates/application_current_sites.html

@@ -2,16 +2,21 @@
 {% load static field_helpers %}
 
 {% block form_instructions %}
-  <p>Enter your organization’s public website, if you have one. For example,
+  <p>Enter your organization’s current public website, if you have one. For example,
   www.city.com.</p>
 {% endblock %}
 
+{% block form_required_fields_help_text %}
+{# empty this block so it doesn't show on this page #}
+{% endblock %}
 
 {% block form_fields %}
   {{ forms.0.management_form }}
 
   {% for form in forms.0 %}
+  {% with add_label_class="usa-sr-only" %}
     {% input_with_errors form.website %}
+  {% endwith %} 
   {% endfor %}
 
   <button type="submit" name="submit_button" value="save" class="usa-button usa-button--unstyled">
@@ -19,4 +24,4 @@
       <use xlink:href="{%static 'img/sprite.svg'%}#add_circle"></use>
     </svg><span class="margin-left-05">Add another site</span>
   </button>
-{% endblock %}
+{% endblock %}

src/registrar/templates/application_dotgov_domain.html

@@ -27,13 +27,18 @@
 {% endblock %}
 
 
+{% block form_required_fields_help_text %}
+{# empty this block so it doesn't show on this page #}
+{% endblock %}
+
+
 {% block form_fields %}
 
   {{ forms.0.management_form }}
 
   <fieldset class="usa-fieldset">
     <legend>
-      <h2>What .gov domain do you want?</h2>
+      <h2>What .gov domain do you want? <abbr class="usa-hint usa-hint--required" title="required">*</abbr></h2>
     </legend>
 
     <p id="domain_instructions">After you enter your domain, we’ll make sure it’s
@@ -41,9 +46,11 @@
     these initial checks, we’ll verify that it meets all of our requirements once you
     complete and submit the rest of this form.</p>
 
+    <p class="text-semibold"><abbr class="usa-hint usa-hint--required" title="required">*</abbr> This question is required.</p>
+
     {% with attr_aria_describedby="domain_instructions domain_instructions2" %}
       {# attr_validate / validate="domain" invokes code in get-gov.js #}
-      {% with www_gov=True attr_validate="domain" %}
+      {% with www_gov=True attr_validate="domain" add_label_class="usa-sr-only" %}
         {% input_with_errors forms.0.requested_domain %}
       {% endwith %}
     {% endwith %}

src/registrar/templates/application_org_election.html

@@ -3,14 +3,18 @@
 
 {% block form_instructions %}
   <h2 class="margin-bottom-05">
-    Is your organization an election office?
+    Is your organization an election office?  <abbr class="usa-hint usa-hint--required" title="required">*</abbr>
   </h2>
-<p>Answer “yes” if the primary purpose of your organization is to manage elections.</p>
+
+  <p>Answer “yes” if the primary purpose of your organization is to manage elections.</p>
 {% endblock %}
 
+{% block form_required_fields_help_text %}
+  <p class="text-semibold"><abbr class="usa-hint usa-hint--required" title="required">*</abbr> This question is required.</p>
+{% endblock %}
 
 {% block form_fields %}
-  {% with add_class="usa-radio__input--tile" %}
+  {% with add_class="usa-radio__input--tile" add_legend_class="usa-sr-only" %}
     {% input_with_errors forms.0.is_election_board %}
   {% endwith %}
 {% endblock %}

src/registrar/templates/application_org_federal.html

@@ -3,13 +3,17 @@
 
 {% block form_instructions %}
   <h2 class="margin-bottom-05">
-    Which federal branch is your organization in?
+    Which federal branch is your organization in? <abbr class="usa-hint usa-hint--required" title="required">*</abbr>
   </h2>
 {% endblock %}
 
+{% block form_required_fields_help_text %}
+<p class="text-semibold"><abbr class="usa-hint usa-hint--required" title="required">*</abbr> This question is required.</p>
+{% endblock %}
+
 
 {% block form_fields %}
-  {% with add_class="usa-radio__input--tile" %}
+  {% with add_class="usa-radio__input--tile"  add_legend_class="usa-sr-only" %}
     {% input_with_errors forms.0.federal_type %}
   {% endwith %}
 {% endblock %}

src/registrar/templates/application_org_type.html

@@ -3,13 +3,18 @@
 
 {% block form_instructions %}
   <h2 class="margin-bottom-05">
-    What kind of U.S.-based government organization do you represent?
+    What kind of U.S.-based government organization do you represent? <abbr class="usa-hint usa-hint--required" title="required">*</abbr>
   </h2>
+
+{% endblock %}
+
+{% block form_required_fields_help_text %}
+<p class="text-semibold"><abbr class="usa-hint usa-hint--required" title="required">*</abbr> This question is required.</p>
 {% endblock %}
 
 
 {% block form_fields %}
-  {% with add_class="usa-radio__input--tile" %}
+  {% with add_class="usa-radio__input--tile" add_legend_class="usa-sr-only" %}
     {% input_with_errors forms.0.organization_type %}
   {% endwith %}
-{% endblock %}
+{% endblock %}

src/registrar/templates/application_other_contacts.html

@@ -7,6 +7,11 @@
   <p>We’ll email these contacts to let them know that you made this request.</p>
 {% endblock %}
 
+{% block form_required_fields_help_text %}
+{# there are no required fields on this page so don't show this #}
+{% endblock %}
+
+
 
 {% block form_fields %}
   {{ forms.0.management_form }}

src/registrar/templates/application_purpose.html

@@ -9,11 +9,17 @@ domain name or for mainly internal use.</p>
 Who is your intended audience? Will you use it for a website and/or email? Are you moving 
 your website from another top-level domain (like .com or .org)? 
 Read about <a href="{% url 'todo' %}">activities that are prohibited on .gov domains.</a></p>
+
 {% endblock %}
 
+{% block form_required_fields_help_text %}
+  <p class="text-semibold"><abbr class="usa-hint usa-hint--required" title="required">*</abbr> This question is required.</p>
+{% endblock %}
+
+
 
 {% block form_fields %}
-    {% with attr_maxlength=500 %}
+    {% with attr_maxlength=500 add_label_class="usa-sr-only" %}
       {% input_with_errors forms.0.purpose %}
     {% endwith %}
 {% endblock %}

src/registrar/templates/application_review.html

@@ -1,6 +1,10 @@
 {% extends 'application_form.html' %}
 {% load static url_helpers %}
 
+{% block form_required_fields_help_text %}
+{# there are no required fields on this page so don't show this #}
+{% endblock %}
+
 {% block form_fields %}
   {% for step in steps.all|slice:":-1" %}
   <section class="review__step">
@@ -101,4 +105,4 @@
     </div>
   </section>
   {% endfor %}
-{% endblock %}
+{% endblock %}

src/registrar/templates/django/forms/label.html

@@ -1,9 +1,9 @@
 <{{ label_tag }}
-  class="{% if label_classes %} {{ label_classes }}{% endif %}"
+  class="{% if label_classes %} {{ label_classes }}{% endif %}{% if label_tag == 'legend' %} {{ legend_classes }}{% endif %}"
   {% if not field.use_fieldset %}for="{{ widget.attrs.id }}"{% endif %}
 >
 {{ field.label }}
 {% if widget.attrs.required %}
   <abbr class="usa-hint usa-hint--required" title="required">*</abbr>
 {% endif %}
-</{{ label_tag }}>
+</{{ label_tag }}>

src/registrar/templatetags/field_helpers.py

@@ -21,6 +21,7 @@ def input_with_errors(context, field=None):  # noqa: C901
         add_error_class: like `add_class` but only if field.errors is not empty
         add_required_class: like `add_class` but only if field is required
         add_label_class: append to input element's label's `class` attribute
+        add_legend_class: append to input element's legend's `class` attribute
         add_group_class: append to input element's surrounding tag's `class` attribute
         attr_* - adds or replaces any single html attribute for the input
         add_error_attr_* - like `attr_*` but only if field.errors is not empty
@@ -50,6 +51,7 @@ def input_with_errors(context, field=None):  # noqa: C901
     # these will be converted to CSS strings
     classes = []
     label_classes = []
+    legend_classes = []
     group_classes = []
 
     # this will be converted to an attribute string
@@ -82,6 +84,8 @@ def input_with_errors(context, field=None):  # noqa: C901
 
         elif key == "add_label_class":
             label_classes.append(value)
+        elif key == "add_legend_class":
+            legend_classes.append(value)
 
         elif key == "add_group_class":
             group_classes.append(value)
@@ -129,6 +133,9 @@ def input_with_errors(context, field=None):  # noqa: C901
     if label_classes:
         context["label_classes"] = " ".join(label_classes)
 
+    if legend_classes:
+        context["legend_classes"] = " ".join(legend_classes)
+
     if group_classes:
         context["group_classes"] = " ".join(group_classes)