refine top button

Author: mawinter69

core/src/main/resources/lib/form/hetero-list.jelly

@@ -121,11 +121,11 @@ THE SOFTWARE.
   <div class="jenkins-form-item hetero-list-container ${hasHeader?'with-drag-drop':''} ${attrs.oneEach?'one-each':''} ${attrs.honorOrder?'honor-order':''}"
         enableTopButton="${attrs.enableTopButton}">
     <j:if test="${!readOnlyMode and attrs.enableTopButton}">
-      <div>
+      <span>
         <button type="button" class="jenkins-button hetero-list-add hetero-list-add-top ${empty(attrs.items)?'jenkins-hidden':''}"
                 menualign="${attrs.menuAlign}" suffix="${attrs.name}"><l:icon src="symbol-add"/>${attrs.addCaption?:'%Add'}
         </button>
-      </div>
+      </span>
     </j:if>
 
     <!-- display existing items -->

src/main/js/components/dropdowns/hetero-list.js

@@ -84,7 +84,7 @@ function generateButtons() {
       let btn = Array.from(c.querySelectorAll("BUTTON.hetero-list-add")).pop();
       let topButton = Array.from(
         c.querySelectorAll("BUTTON.hetero-list-add-top"),
-      ).pop();
+      ).shift();
 
       let prototypes = c.lastElementChild;
       while (!prototypes.classList.contains("prototypes")) {

src/main/scss/form/_reorderable-list.scss

@@ -221,7 +221,7 @@ div.repeated-chunk {
   }
 }
 
-.repeatable-add-top {
+.repeatable-add-top, .hetero-list-add-top {
   margin-bottom: 1rem;
 }