Simplify SCSS

Author: janfaracik

core/src/main/resources/hudson/model/View/newJob.jelly

@@ -42,15 +42,15 @@ THE SOFTWARE.
 
           <form method="post" action="createItem" name="createItem" id="createItem">
             <div class="header">
-              <div class="jenkins-form-item jenkins-!-margin-bottom-0 add-item-name">
+              <div class="jenkins-form-item add-item-name">
                 <label for="name" class="jenkins-form-label">${%ItemName.label}</label>
                 <input name="name" class="jenkins-input" id="name" data-valid="false" type="text" tabindex="0" />
                 <div class="validation-error-area" />
               </div>
             </div>
 
             <fieldset class="jenkins-!-display-contents">
-              <div>
+              <div class="jenkins-form-item">
                 <legend class="jenkins-form-label">${%ItemType.label}</legend>
                 <div id="items" class="jenkins-choice-list categories" data-valid="false">
                   <template id="insertion-point">
@@ -70,7 +70,7 @@ THE SOFTWARE.
                         <div class="jenkins-choice-list__item__description">${%CopyOption.description}</div>
                       </label>
 
-                      <div class="categoryexport">
+                      <div class="jenkins-choice-list__item__conditional">
                         <j:set var="descriptor" value="${it.descriptor}" />
                         <s:textbox id="from" data-valid="false" name="from" placeholder="${%CopyOption.placeholder}" field="copyNewItemFrom"/>
                       </div>

src/main/js/add-item.scss

@@ -2,42 +2,18 @@
   max-width: 750px;
   margin: auto;
 
-  form {
-    display: flex;
-    flex-direction: column;
-    gap: var(--section-padding);
-
-    #bottom-sticker {
-      margin-top: calc(var(--section-padding) * -1);
-    }
-  }
-
-  .categories {
-    .jenkins-choice-list__item {
-      .categoryexport {
-        display: none;
-        margin-left: 4rem;
-        margin-top: -0.25rem;
-        margin-bottom: 0.875rem;
-      }
-
-      // Default icons' text placeholder don't appear unless z-index is set
-      .jenkins-choice-list__item__icon {
-        span {
-          z-index: 1;
-        }
-      }
-
-      &:has(input:checked) {
-        .categoryexport {
-          display: block;
-        }
+  .jenkins-choice-list__item {
+    // Default icons' text placeholder don't appear unless z-index is set
+    .jenkins-choice-list__item__icon {
+      span {
+        z-index: 1;
       }
+    }
 
-      input {
-        width: 100%;
-        max-width: 400px;
-      }
+    // Make 'Duplicate an existing item' input not full width
+    input {
+      width: 100%;
+      max-width: 400px;
     }
   }
 }

src/main/scss/components/_choice-list.scss

@@ -113,6 +113,10 @@
             inset 0 0 18px 18px var(--accent-color);
         }
       }
+
+      .jenkins-choice-list__item__conditional {
+        display: block;
+      }
     }
 
     &:first-of-type {
@@ -191,5 +195,12 @@
       grid-column: 2;
       padding-right: 2rem;
     }
+
+    &__conditional {
+      display: none;
+      margin-left: 4rem;
+      margin-top: -0.25rem;
+      margin-bottom: 0.875rem;
+    }
   }
 }