polish JS, alg validation, polish layout

src/registrar/assets/js/get-gov.js

@@ -285,16 +285,13 @@ function handleValidationClick(e) {
       let newForm = serverForm2[0].cloneNode(true)
       let formNumberRegex = RegExp(`form-(\\d){1}-`,'g')
       let formLabelRegex = RegExp(`DS Data record (\\d){1}`, 'g')
-      // let formExampleRegex = RegExp(`ns(\\d){1}`, 'g')
 
       formNum++
       newForm.innerHTML = newForm.innerHTML.replace(formNumberRegex, `form-${formNum}-`)
       newForm.innerHTML = newForm.innerHTML.replace(formLabelRegex, `DS Data Record ${formNum+1}`)
-      // newForm.innerHTML = newForm.innerHTML.replace(formExampleRegex, `ns${formNum+1}`)
       container.insertBefore(newForm, addButton)
 
       let inputs = newForm.querySelectorAll("input");
-
       // Reset the values of each input to blank
       inputs.forEach((input) => {
         input.classList.remove("usa-input--error");
@@ -307,19 +304,16 @@ function handleValidationClick(e) {
       });
 
       let selects = newForm.querySelectorAll("select");
-
       selects.forEach((select) => {
         select.classList.remove("usa-input--error");
         select.selectedIndex = 0; // Set the value to an empty string
       });
 
-
       let labels = newForm.querySelectorAll("label");
       labels.forEach((label) => {
         label.classList.remove("usa-label--error");
       });
 
-
       let usaFormGroups = newForm.querySelectorAll(".usa-form-group");
       usaFormGroups.forEach((usaFormGroup) => {
         usaFormGroup.classList.remove("usa-form-group--error");

src/registrar/assets/sass/_theme/_buttons.scss

@@ -22,6 +22,27 @@ a.breadcrumb__back {
   }
 }
 
+a.usa-button {
+  text-decoration: none;
+}
+  
+a.usa-button--outline,
+a.usa-button--outline:visited {
+  box-shadow: inset 0 0 0 2px color('primary');
+  color: color('primary');
+}
+  
+a.usa-button--outline:hover,
+a.usa-button--outline:focus {
+  box-shadow: inset 0 0 0 2px color('primary-dark');
+  color: color('primary-dark');
+}
+  
+a.usa-button--outline:active {
+  box-shadow: inset 0 0 0 2px color('primary-darker');
+  color: color('primary-darker');
+}
+
 a.withdraw {
   background-color: color('error');
 }
@@ -60,7 +81,7 @@ a.usa-button--unstyled:visited {
   color: color('primary');
 }
   
-.dotgov-button--green {
+  .dotgov-button--green {
     background-color: color('success-dark');
   
     &:hover {
@@ -70,4 +91,4 @@ a.usa-button--unstyled:visited {
     &:active {
       background-color: color('green-80v');
     }
-}
+  }

src/registrar/assets/sass/_theme/_fieldsets.scss

@@ -5,7 +5,6 @@ fieldset {
     padding: units(3);
 }
 
-fieldset legend {
+fieldset:not(:first-child) {
-    font-weight: font-weight('bold');
+    margin-top: units(2);
-    color: color('primary')
 }

src/registrar/assets/sass/_theme/_forms.scss

@@ -13,3 +13,9 @@
     height: units('mobile');
   }
 }
+
+.usa-form-group--unstyled-error {
+  margin-left: 0;
+  padding-left: 0;
+  border-left: none;
+}

src/registrar/forms/common.py

@@ -1,10 +1,19 @@
 # common.py
-# Q: What are the options?
+# reference: https://www.iana.org/assignments/dns-sec-alg-numbers/dns-sec-alg-numbers.xhtml
 ALGORITHM_CHOICES = [
     (1, "ERSA/MD5 [RSAMD5]"),
     (2 , "Diffie-Hellman [DH]"),
     (3 ,"DSA/SHA-1 [DSA]"),
     (5 ,"RSA/SHA-1 [RSASHA1]"),
+    (6 ,"DSA-NSEC3-SHA1"),
+    (7 ,"RSASHA1-NSEC3-SHA1"),
+    (8 ,"RSA/SHA-256 [RSASHA256]"),
+    (10 ,"RSA/SHA-512 [RSASHA512]"),
+    (12 ,"GOST R 34.10-2001 [ECC-GOST]"),
+    (13 ,"ECDSA Curve P-256 with SHA-256 [ECDSAP256SHA256]"),
+    (14 ,"ECDSA Curve P-384 with SHA-384 [ECDSAP384SHA384]"),
+    (15 ,"Ed25519"),
+    (16 ,"Ed448"),
 ]
 # Q: What are the options?
 DIGEST_TYPE_CHOICES = [

src/registrar/forms/domain.py

@@ -179,14 +179,15 @@ class DomainDsdataForm(forms.Form):
     # Q: Is ChoiceFiled right? Or do we need to data types other than strings
     # (TypedChoiceField)
     digest_type = forms.TypedChoiceField(
+        required=True,
         label="Digest Type",
         choices=[(None, "--Select--")] + DIGEST_TYPE_CHOICES,
         # Q: Is this even needed or is a required=True sufficient?
-        error_messages={
+        # error_messages={
-            "required": (
+        #     "required": (
-                "You must select a Digest Type"
+        #         "You must select a Digest Type"
-            )
+        #     )
-        },
+        # },
     )
     digest = forms.CharField(
         required=True,
@@ -199,10 +200,10 @@ class DomainDsdataForm(forms.Form):
         # ],
     )
     
-    delete = forms.BooleanField(
+    # delete = forms.BooleanField(
-        required=False,
+    #     required=False,
-        label="Delete",
+    #     label="Delete",
-    )
+    # )
 
     # TODO: Conditional DS Key Data fields
     
@@ -249,10 +250,10 @@ class DomainKeydataForm(forms.Form):
         label="Pub key",
     )
     
-    delete = forms.BooleanField(
+    # delete = forms.BooleanField(
-        required=False,
+    #     required=False,
-        label="Delete",
+    #     label="Delete",
-    )
+    # )
 
     # TODO: Conditional DS Key Data fields
     

src/registrar/templates/domain_dnssec.html

@@ -30,7 +30,7 @@
       <a href="{% url 'domain-dns-dnssec-keydata' pk=domain.id %}" class="usa-button usa-button--outline">Add Key Data</a>
       <button
         type="submit"
-        class="usa-button"
+        class="usa-button usa-button--unstyled"
         name="cancel"
     >Cancel</button>
     </p>

src/registrar/templates/domain_dsdata.html

@@ -27,6 +27,8 @@
         >Add DS Data record</button>
     </form>
   {% else %}
+
+  <p>Enter the values given by your DNS provider for DS Data.</p>
   {% include "includes/required_fields.html" %}
 
   <form class="usa-form usa-form--extra-large" method="post" novalidate id="form-container">
@@ -36,21 +38,23 @@
     {% for form in formset %}
     <fieldset class="ds-record">
 
-      <legend>DS Data record {{forloop.counter}}</legend>
+      <legend class="sr-only">DS Data record {{forloop.counter}}</legend>
+
+      <h2 class="margin-top-0">DS Data record {{forloop.counter}}</h2>
 
       <div class="grid-row grid-gap-2 flex-end">
         <div class="tablet:grid-col-4">
-          {% with attr_required=True %}
+          {% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
             {% input_with_errors form.key_tag %}
           {% endwith %}
         </div>
         <div class="tablet:grid-col-4">
-          {% with attr_required=True %}
+          {% with attr_required=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 %}
+          {% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
             {% input_with_errors form.digest_type %}
           {% endwith %}
         </div>
@@ -58,7 +62,7 @@
 
       <div class="grid-row">
         <div class="grid-col">
-          {% with attr_required=True %}
+          {% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
             {% input_with_errors form.digest %}
           {% endwith %}
         </div>
@@ -66,9 +70,9 @@
 
       <div class="grid-row margin-top-2">
         <div class="grid-col">
-          {% with add_group_class="float-right-tablet" %}
+          {% comment %} {% with add_group_class="float-right-tablet" %}
             {% input_with_errors form.delete %}
-          {% endwith %}
+          {% endwith %} {% endcomment %}
         </div>
       </div>
 

src/registrar/templates/domain_keydata.html

@@ -27,6 +27,8 @@
         >Add DS Key record</button>
     </form>
   {% else %}
+
+  <p>Enter the values given by your DNS provider for DS Key Data.</p>
   {% include "includes/required_fields.html" %}
 
   <form class="usa-form usa-form--extra-large" method="post" novalidate id="form-container">
@@ -34,23 +36,25 @@
     {{ formset.management_form }}
 
     {% for form in formset %}
-    <fieldset class="key-record">
+    <fieldset class="ds-record">
 
-      <legend>Key Data record {{forloop.counter}}</legend>
+      <legend class="sr-only">Key Data record {{forloop.counter}}</legend>
+
+      <h2 class="margin-top-0">DS Data record {{forloop.counter}}</h2>
 
       <div class="grid-row grid-gap-2 flex-end">
         <div class="tablet:grid-col-4">
-          {% with attr_required=True %}
+          {% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
             {% input_with_errors form.flag %}
           {% endwith %}
         </div>
         <div class="tablet:grid-col-4">
-          {% with attr_required=True %}
+          {% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
             {% input_with_errors form.protocol %}
           {% endwith %}
         </div>
         <div class="tablet:grid-col-4">
-          {% with attr_required=True %}
+          {% with attr_required=True add_group_class="usa-form-group--unstyled-error" %}
             {% input_with_errors form.algorithm %}
           {% endwith %}
         </div>
@@ -59,16 +63,16 @@
       <div class="grid-row">
         <div class="grid-col">
           {% with attr_required=True %}
-            {% input_with_errors form.pub_key %}
+            {% input_with_errors form.pub_key add_group_class="usa-form-group--unstyled-error" %}
           {% endwith %}
         </div>
       </div>
 
       <div class="grid-row margin-top-2">
         <div class="grid-col">
-          {% with add_group_class="float-right-tablet" %}
+          {% comment %} {% with add_group_class="float-right-tablet" %}
             {% input_with_errors form.delete %}
-          {% endwith %}
+          {% endwith %} {% endcomment %}
         </div>
       </div>
 

src/registrar/views/domain.py

@@ -336,7 +336,7 @@ class DomainDsdataView(DomainPermissionView, FormMixin):
 
         for form in formset:
             try:
-                if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
+                # if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
                 dsrecord = {
                     "keyTag": form.cleaned_data["key_tag"],
                     "alg": form.cleaned_data["algorithm"],
@@ -428,7 +428,7 @@ class DomainKeydataView(DomainPermissionView, FormMixin):
 
         for form in formset:
             try:
-                if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
+                # if 'delete' not in form.cleaned_data or form.cleaned_data['delete'] == False:
                 keyrecord = {
                     "flags": form.cleaned_data["flag"],
                     "protocol": form.cleaned_data["protocol"],