From 5327e6ebe7bbb95f58078d74b9b52ed9556d19e9 Mon Sep 17 00:00:00 2001
From: Lorenzo Spinelli <Spyna@users.noreply.github.com>
Date: Thu, 4 Jan 2024 09:34:49 +0100
Subject: [PATCH] improve the UIX promotions page (#271)

* improve the UIX promotions page

* add container div
---
 .../plugins/promoted_builds/PromotedBuildAction/index.jelly | 6 +++++-
 src/main/webapp/css/promoted-builds.css                     | 6 ++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/main/resources/hudson/plugins/promoted_builds/PromotedBuildAction/index.jelly b/src/main/resources/hudson/plugins/promoted_builds/PromotedBuildAction/index.jelly
index 4217a45b..6de2f062 100644
--- a/src/main/resources/hudson/plugins/promoted_builds/PromotedBuildAction/index.jelly
+++ b/src/main/resources/hudson/plugins/promoted_builds/PromotedBuildAction/index.jelly
@@ -16,6 +16,7 @@
         <!-- list promotions that are already attained -->
         <j:forEach var="p" items="${it.promotions}">
           <j:if test="${p.getProcess()!=null and p.getProcess().isVisible()}">
+            <div class="promotion">
             <h2>
               <img src="${resURL}/plugin/promoted-builds/icons/${p.getProcess().getIcon()}.svg" height="32px"/>
               <a href="../../promotion/process/${p.name}" class="model-link">${p.name}</a>
@@ -28,7 +29,7 @@
                   <td>
                     <a href="${p.name}/promotionBuild/${attempt.number}/console">
                       <l:icon class="${attempt.iconColor.iconClassName} icon-sm"
-                       alt="${attempt.iconColor.description}"/> ${attempt.displayName} (${attempt.timestamp.time})
+                        alt="${attempt.iconColor.description}"/> ${attempt.displayName} (${attempt.timestamp.time})
                     </a> by ${attempt.userName}
                   </td>
                 </tr>
@@ -86,11 +87,13 @@
               </j:choose>
             </div>
             <div style="clear:both" />
+            </div>
           </j:if>
         </j:forEach>
         <!-- list promotions that are not yet attained -->
         <j:forEach var="p" items="${it.pendingPromotions}">
           <j:if test="${p.isVisible()}">
+            <div class="promotion">
             <h2>
               <img src="${resURL}/plugin/promoted-builds/icons/${p.getIcon()}.svg" height="32px"/>
               <a href="../../promotion/process/${p.name}" class="model-link">${p.name}</a>
@@ -124,6 +127,7 @@
               <j:set var="pba" value="${it}"/>
               <st:include it="${c}" page="index.jelly" />
             </j:forEach>
+            </div>
           </j:if>
         </j:forEach>
       </div>
diff --git a/src/main/webapp/css/promoted-builds.css b/src/main/webapp/css/promoted-builds.css
index f5f6e4e6..f8750301 100644
--- a/src/main/webapp/css/promoted-builds.css
+++ b/src/main/webapp/css/promoted-builds.css
@@ -1,3 +1,9 @@
+.promotion {
+  box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px;
+  padding: 16px;
+  margin: 16px 4px;
+}
+
 .promoted-builds {
   overflow: hidden;
 }