From c375656f9d1321c81f7183aa72e2df76a3bf7c1f Mon Sep 17 00:00:00 2001
From: David Kennedy <david.kennedy@associates.cisa.dhs.gov>
Date: Wed, 19 Mar 2025 07:27:58 -0400
Subject: [PATCH] move required fields display in ds data and nameservers

---
 src/registrar/templates/domain_dsdata.html    | 106 +++++++++---------
 .../templates/domain_nameservers.html         |  91 +++++++--------
 2 files changed, 100 insertions(+), 97 deletions(-)

diff --git a/src/registrar/templates/domain_dsdata.html b/src/registrar/templates/domain_dsdata.html
index 6a4e2cbed..5ed48d9d5 100644
--- a/src/registrar/templates/domain_dsdata.html
+++ b/src/registrar/templates/domain_dsdata.html
@@ -274,64 +274,66 @@
     DS records defined on the domain.
     {% endcomment %} 
 
-    <section class="add-dsdata-form display-none section-outlined">
+    <div class="add-dsdata-form display-none">
       {% include "includes/required_fields.html" %} 
-      <form class="usa-form usa-form--extra-large" method="post" novalidate>
-        <h2>Add DS record</h2>
-        {% csrf_token %}
-        {{ formset.management_form }}
-        {% for form in formset %}
-        <div class="repeatable-form">
-          <div class="grid-row grid-gap-2 flex-end">
-            <div class="tablet:grid-col-4">
-              {% with sublabel_text="Numbers (0-9) only." %}
-                {% with attr_required=True add_initial_value_attr=True add_group_class="usa-form-group--unstyled-error" %}
-                  {% input_with_errors form.key_tag %}
-                {% endwith %}
-              {% endwith %}
-            </div>
-            <div class="tablet:grid-col-4">
-              {% with attr_required=True add_initial_value_attr=True add_group_class="usa-form-group--unstyled-error" %}
-                {% input_with_errors form.algorithm %}
-              {% endwith %}
-            </div>
-            <div class="tablet:grid-col-4">
-              {% with attr_required=True add_initial_value_attr=True add_group_class="usa-form-group--unstyled-error" %}
-                {% input_with_errors form.digest_type %}
-              {% endwith %}
-            </div>
-          </div>
-    
-          <div class="grid-row">
-            <div class="grid-col">
-              {% with sublabel_text="Numbers (0-9) and letters (a-f) only. SHA-1: 40 chars, SHA-256: 64 chars." %}
-                {% with hide_character_count=True %}
+      <section class="section-outlined">
+        <form class="usa-form usa-form--extra-large" method="post" novalidate>
+          <h2>Add DS record</h2>
+          {% csrf_token %}
+          {{ formset.management_form }}
+          {% for form in formset %}
+          <div class="repeatable-form">
+            <div class="grid-row grid-gap-2 flex-end">
+              <div class="tablet:grid-col-4">
+                {% with sublabel_text="Numbers (0-9) only." %}
                   {% with attr_required=True add_initial_value_attr=True add_group_class="usa-form-group--unstyled-error" %}
-                    {% input_with_errors form.digest %}
+                    {% input_with_errors form.key_tag %}
                   {% endwith %}
                 {% endwith %}
-              {% endwith %}
+              </div>
+              <div class="tablet:grid-col-4">
+                {% with attr_required=True add_initial_value_attr=True add_group_class="usa-form-group--unstyled-error" %}
+                  {% input_with_errors form.algorithm %}
+                {% endwith %}
+              </div>
+              <div class="tablet:grid-col-4">
+                {% with attr_required=True add_initial_value_attr=True add_group_class="usa-form-group--unstyled-error" %}
+                  {% input_with_errors form.digest_type %}
+                {% endwith %}
+              </div>
+            </div>
+    
+            <div class="grid-row">
+              <div class="grid-col">
+                {% with sublabel_text="Numbers (0-9) and letters (a-f) only. SHA-1: 40 chars, SHA-256: 64 chars." %}
+                  {% with hide_character_count=True %}
+                    {% with attr_required=True add_initial_value_attr=True add_group_class="usa-form-group--unstyled-error" %}
+                      {% input_with_errors form.digest %}
+                    {% endwith %}
+                  {% endwith %}
+                {% endwith %}
+              </div>
             </div>
           </div>
-        </div>
-        {% endfor %}
-        <div class="margin-top-2">
-          <button
-            type="button"
-            class="usa-button usa-button--outline dsdata-cancel-add-form"
-            name="btn-cancel-click"
-            aria-label="Reset the data in the DS records to the registry state (undo changes)"
-          >Cancel
-          </button>
-          <button
-            id="save-ds-data"
-            type="submit"
-            class="usa-button"
-          >Save
-          </button>
-        </div>
-      </form>
-    </section>
+          {% endfor %}
+          <div class="margin-top-2">
+            <button
+              type="button"
+              class="usa-button usa-button--outline dsdata-cancel-add-form"
+              name="btn-cancel-click"
+              aria-label="Reset the data in the DS records to the registry state (undo changes)"
+            >Cancel
+            </button>
+            <button
+              id="save-ds-data"
+              type="submit"
+              class="usa-button"
+            >Save
+            </button>
+          </div>
+        </form>
+      </section>
+    </div>
   {% endif %}
 
   <a
diff --git a/src/registrar/templates/domain_nameservers.html b/src/registrar/templates/domain_nameservers.html
index b6314ea5f..a94ebbd82 100644
--- a/src/registrar/templates/domain_nameservers.html
+++ b/src/registrar/templates/domain_nameservers.html
@@ -240,57 +240,58 @@
     This section renders Add New Nameservers form which renders when there are no existing
     nameservers defined on the domain.
     {% endcomment %} 
-       
-    <section class="add-nameservers-form display-none section-outlined">
+    <div class="add-nameservers-form display-none">   
       {% include "includes/required_fields.html" %} 
-      <form class="usa-form usa-form--extra-large" method="post" novalidate>
-        <h2>Add name servers</h2>
-        {% csrf_token %}
-        {{ formset.management_form }}
-        {% for form in formset %}
-        {{ form.domain }}
-        <div class="repeatable-form">
-          <div class="grid-row grid-gap-2 flex-end minh-143px">
-            <div class="tablet:grid-col-6">
-              {% with sublabel_text="Example: ns"|concat:forloop.counter|concat:".example.com" add_group_class="usa-form-group--unstyled-error margin-top-2" %}
-                {% if forloop.counter <= 2 %}
-                  {# span_for_text will wrap the copy in s <span>, which we'll use in the JS for this component #}
-                  {% with attr_required=True add_initial_value_attr=True span_for_text=True %}
-                    {% input_with_errors form.server %}
-                  {% endwith %}
-                {% else %}
-                  {% with span_for_text=True add_initial_value_attr=True %}
-                    {% input_with_errors form.server %}
+      <section class="section-outlined">
+        <form class="usa-form usa-form--extra-large" method="post" novalidate>
+          <h2>Add name servers</h2>
+          {% csrf_token %}
+          {{ formset.management_form }}
+          {% for form in formset %}
+          {{ form.domain }}
+          <div class="repeatable-form">
+            <div class="grid-row grid-gap-2 flex-end minh-143px">
+              <div class="tablet:grid-col-6">
+                {% with sublabel_text="Example: ns"|concat:forloop.counter|concat:".example.com" add_group_class="usa-form-group--unstyled-error margin-top-2" %}
+                  {% if forloop.counter <= 2 %}
+                    {# span_for_text will wrap the copy in s <span>, which we'll use in the JS for this component #}
+                    {% with attr_required=True add_initial_value_attr=True span_for_text=True %}
+                      {% input_with_errors form.server %}
                     {% endwith %}
-                {% endif %}
-              {% endwith %}
-            </div>
-            <div class="tablet:grid-col-6">
-              {% with attr_required=True add_initial_value_attr=True label_text=form.ip.label sublabel_text="Example: 86.124.49.54 or 2001:db8::1234:5678" add_aria_label="Name server "|concat:forloop.counter|concat:" "|concat:form.ip.label add_group_class="usa-form-group--unstyled-error margin-top-2" %}
-                {% input_with_errors form.ip %}
-              {% endwith %}
+                  {% else %}
+                    {% with span_for_text=True add_initial_value_attr=True %}
+                      {% input_with_errors form.server %}
+                      {% endwith %}
+                  {% endif %}
+                {% endwith %}
+              </div>
+              <div class="tablet:grid-col-6">
+                {% with attr_required=True add_initial_value_attr=True label_text=form.ip.label sublabel_text="Example: 86.124.49.54 or 2001:db8::1234:5678" add_aria_label="Name server "|concat:forloop.counter|concat:" "|concat:form.ip.label add_group_class="usa-form-group--unstyled-error margin-top-2" %}
+                  {% input_with_errors form.ip %}
+                {% endwith %}
+              </div>
             </div>
           </div>
-        </div>
-        {% endfor %}
+          {% endfor %}
           
-        <div class="margin-top-2">
-          <button
-            type="button"
-            class="usa-button usa-button--outline nameserver-cancel-add-form"
-            name="btn-cancel-click"
-            aria-label="Reset the data in the name server form to the registry state (undo changes)"
-          >Cancel
-          </button>
-          <button
-                type="submit"
-                class="usa-button"
-            >Save
-          </button>
-        </div>
-      </form>
+          <div class="margin-top-2">
+            <button
+              type="button"
+              class="usa-button usa-button--outline nameserver-cancel-add-form"
+              name="btn-cancel-click"
+              aria-label="Reset the data in the name server form to the registry state (undo changes)"
+            >Cancel
+            </button>
+            <button
+                  type="submit"
+                  class="usa-button"
+              >Save
+            </button>
+          </div>
+        </form>
 
-    </section>
+      </section>
+    </div>
 
   {% endif %}