From aa68f695fed2810409189a54dea1699ac712b9d2 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Wed, 3 Jun 2026 08:05:23 +0100
Subject: [PATCH 1/5] Adapt for container UI

---
 pom.xml                                       |   2 +-
 .../plugins/designlibrary/Home/index.jelly    | 132 +++++++++---------
 src/main/resources/lib/samples/layout.jelly   |  28 ++--
 3 files changed, 77 insertions(+), 85 deletions(-)

diff --git a/pom.xml b/pom.xml
index 1cc306b6..c257fb89 100644
--- a/pom.xml
+++ b/pom.xml
@@ -60,7 +60,7 @@ THE SOFTWARE.
     <gitHubRepo>jenkinsci/design-library-plugin</gitHubRepo>
     <!-- https://www.jenkins.io/doc/developer/plugin-development/choosing-jenkins-baseline/ -->
     <jenkins.baseline>2.541</jenkins.baseline>
-    <jenkins.version>2.560</jenkins.version>
+    <jenkins.version>2.567-rc38343.9c3f1c425c6d</jenkins.version>
     <node.version>22.15.0</node.version>
     <npm.version>11.12.1</npm.version>
     <spotless.check.skip>false</spotless.check.skip>
diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Home/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Home/index.jelly
index 35ec9efa..a633ccfe 100644
--- a/src/main/resources/io/jenkins/plugins/designlibrary/Home/index.jelly
+++ b/src/main/resources/io/jenkins/plugins/designlibrary/Home/index.jelly
@@ -7,85 +7,81 @@
       <s:sidepanel />
     </l:side-panel>
 
-    <l:main-panel>
+    <l:main-panel width="narrow">
       <style>
         :root {
           ${it.buildGradientVar()}
         }
       </style>
 
-      <div class="app-settings-container">
-        <div class="app-settings-container__inner">
-          <s:section hideBorder="true">
-            <div class="app-card__container app-card__container--large">
-              <div class="app-card__preview">
-                <div class="app-card__preview__introduction">
-                  <img src="${imagesURL}/svgs/logo.svg" alt="${%Jenkins illustration}" />
-                </div>
-              </div>
-              <p class="app-card__title">${%welcome}</p>
-              <p class="app-card__description">${%description}</p>
+      <s:section hideBorder="true">
+        <div class="app-card__container app-card__container--large">
+          <div class="app-card__preview">
+            <div class="app-card__preview__introduction">
+              <img src="${imagesURL}/svgs/logo.svg" alt="${%Jenkins illustration}" />
             </div>
-          </s:section>
-
-          <s:section title="${%topics}">
-            <div class="app-home__side-by-side">
-              <s:card icon="symbol-cards plugin-design-library"
-                      title="${%cards}"
-                      description="${%cards-description}"
-                      href="cards"
-                      tag="${%New}" />
-              <s:card icon="symbol-dropdown-menu plugin-design-library"
-                      title="${%menu}"
-                      description="${%menu-description}"
-                      href="menu"
-                      tag="${%New}" />
-              <s:card icon="symbol-buttons plugin-design-library"
-                      title="${%buttons}"
-                      description="${%buttons-description}"
-                      href="buttons" />
-              <s:card icon="symbol-star-outline plugin-ionicons-api"
-                      title="${%symbols}"
-                      description="${%symbols-description}"
-                      href="symbols" />
-            </div>
-          </s:section>
+          </div>
+          <p class="app-card__title">${%welcome}</p>
+          <p class="app-card__description">${%description}</p>
+        </div>
+      </s:section>
 
-          <s:section title="${%integrate}">
-            <div class="app-home__side-by-side">
-              <s:card icon="symbol-intellij plugin-design-library"
-                      title="${%get-plugin}"
-                      description="${%get-plugin-description}"
-                      href="https://plugins.jetbrains.com/plugin/1885-jenkins-development-support"
-                      tag="${%Updated}" />
-              <s:card icon="symbol-sparkles-outline plugin-ionicons-api"
-                      title="${%use-with-ai}"
-                      description="${%use-with-ai-description}"
-                      href="llms.txt"
-                      tag="${%New}" />
-            </div>
-          </s:section>
+      <s:section title="${%topics}">
+        <div class="app-home__side-by-side">
+          <s:card icon="symbol-cards plugin-design-library"
+                  title="${%cards}"
+                  description="${%cards-description}"
+                  href="cards"
+                  tag="${%New}" />
+          <s:card icon="symbol-dropdown-menu plugin-design-library"
+                  title="${%menu}"
+                  description="${%menu-description}"
+                  href="menu"
+                  tag="${%New}" />
+          <s:card icon="symbol-buttons plugin-design-library"
+                  title="${%buttons}"
+                  description="${%buttons-description}"
+                  href="buttons" />
+          <s:card icon="symbol-star-outline plugin-ionicons-api"
+                  title="${%symbols}"
+                  description="${%symbols-description}"
+                  href="symbols" />
+        </div>
+      </s:section>
 
-          <s:section title="${%get-involved}">
-            <div class="app-home__side-by-side">
-              <s:card icon="symbol-gitter plugin-design-library"
-                      title="${%gitter-description}"
-                      href="https://gitter.im/jenkinsci/ux-sig" />
-              <s:card icon="symbol-logo-youtube plugin-ionicons-api"
-                      title="${%ux-youtube}"
-                      href="https://www.youtube.com/playlist?list=PLN7ajX_VdyaOnsIIsZHsv_fM9QhOcajWe" />
-              <s:card icon="symbol-logo-github plugin-ionicons-api"
-                      title="${%ux-wip-core}"
-                      href="https://github.com/jenkinsci/jenkins/pulls?q=is%3Apr+is%3Aopen+label%3Aweb-ui" />
-              <s:card icon="symbol-heart-outline plugin-ionicons-api"
-                      title="${%contribute}"
-                      href="https://github.com/jenkinsci/design-library-plugin" />
-            </div>
-          </s:section>
+      <s:section title="${%integrate}">
+        <div class="app-home__side-by-side">
+          <s:card icon="symbol-intellij plugin-design-library"
+                  title="${%get-plugin}"
+                  description="${%get-plugin-description}"
+                  href="https://plugins.jetbrains.com/plugin/1885-jenkins-development-support"
+                  tag="${%Updated}" />
+          <s:card icon="symbol-sparkles-outline plugin-ionicons-api"
+                  title="${%use-with-ai}"
+                  description="${%use-with-ai-description}"
+                  href="llms.txt"
+                  tag="${%New}" />
+        </div>
+      </s:section>
 
-          <s:previous-next-controls previousPage="${null}" nextPage="${it.all.0}" />
+      <s:section title="${%get-involved}">
+        <div class="app-home__side-by-side">
+          <s:card icon="symbol-gitter plugin-design-library"
+                  title="${%gitter-description}"
+                  href="https://gitter.im/jenkinsci/ux-sig" />
+          <s:card icon="symbol-logo-youtube plugin-ionicons-api"
+                  title="${%ux-youtube}"
+                  href="https://www.youtube.com/playlist?list=PLN7ajX_VdyaOnsIIsZHsv_fM9QhOcajWe" />
+          <s:card icon="symbol-logo-github plugin-ionicons-api"
+                  title="${%ux-wip-core}"
+                  href="https://github.com/jenkinsci/jenkins/pulls?q=is%3Apr+is%3Aopen+label%3Aweb-ui" />
+          <s:card icon="symbol-heart-outline plugin-ionicons-api"
+                  title="${%contribute}"
+                  href="https://github.com/jenkinsci/design-library-plugin" />
         </div>
-      </div>
+      </s:section>
+
+      <s:previous-next-controls previousPage="${null}" nextPage="${it.all.0}" />
     </l:main-panel>
   </l:layout>
 </j:jelly>
diff --git a/src/main/resources/lib/samples/layout.jelly b/src/main/resources/lib/samples/layout.jelly
index 40134655..b5726594 100644
--- a/src/main/resources/lib/samples/layout.jelly
+++ b/src/main/resources/lib/samples/layout.jelly
@@ -53,25 +53,21 @@ THE SOFTWARE.
           <s:sidepanel />
         </l:side-panel>
 
-        <l:main-panel>
-          <div class="app-settings-container">
-            <div class="app-settings-container__inner">
-              <l:app-bar title="${it.displayName}">
-                <j:if test="${it.since != null}">
-                  <a href="https://www.jenkins.io/changelog/${it.since}" class="jenkins-button jdl-since-tag" target="_blank">
-                    <l:icon src="symbol-information-circle-outline plugin-ionicons-api" />
-                    Since ${it.since}
-                  </a>
-                </j:if>
-              </l:app-bar>
+        <l:main-panel width="narrow">
+          <l:app-bar title="${it.displayName}">
+            <j:if test="${it.since != null}">
+              <a href="https://www.jenkins.io/changelog/${it.since}" class="jenkins-button jdl-since-tag" target="_blank">
+                <l:icon src="symbol-information-circle-outline plugin-ionicons-api" />
+                Since ${it.since}
+              </a>
+            </j:if>
+          </l:app-bar>
 
-              <p class="jdl-subtitle">${it.description}</p>
+          <p class="jdl-subtitle">${it.description}</p>
 
-              <d:invokeBody/>
+          <d:invokeBody/>
 
-              <s:previous-next-controls previousPage="${it.previousPage}" nextPage="${it.nextPage}" />
-            </div>
-          </div>
+          <s:previous-next-controls previousPage="${it.previousPage}" nextPage="${it.nextPage}" />
         </l:main-panel>
       </l:layout>
     </j:otherwise>

From 8eed8fa432d267c821cdfcb3414c233379094b25 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Wed, 8 Jul 2026 08:34:13 +0100
Subject: [PATCH 2/5] Update pom.xml

---
 pom.xml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pom.xml b/pom.xml
index def9b147..95dafecd 100644
--- a/pom.xml
+++ b/pom.xml
@@ -60,7 +60,7 @@ THE SOFTWARE.
     <gitHubRepo>jenkinsci/design-library-plugin</gitHubRepo>
     <!-- https://www.jenkins.io/doc/developer/plugin-development/choosing-jenkins-baseline/ -->
     <jenkins.baseline>2.541</jenkins.baseline>
-    <jenkins.version>2.567-rc38343.9c3f1c425c6d</jenkins.version>
+    <jenkins.version>2.572-rc38500.cc4401deed77</jenkins.version>
     <node.version>22.23.1</node.version>
     <npm.version>11.17.0</npm.version>
     <spotless.check.skip>false</spotless.check.skip>

From 02f7cdc6c3430d3f01cdebb3a56e1b0814d56299 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 2 Aug 2026 10:17:34 +0100
Subject: [PATCH 3/5] Update pom.xml

---
 pom.xml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pom.xml b/pom.xml
index 95dafecd..58616a83 100644
--- a/pom.xml
+++ b/pom.xml
@@ -60,7 +60,7 @@ THE SOFTWARE.
     <gitHubRepo>jenkinsci/design-library-plugin</gitHubRepo>
     <!-- https://www.jenkins.io/doc/developer/plugin-development/choosing-jenkins-baseline/ -->
     <jenkins.baseline>2.541</jenkins.baseline>
-    <jenkins.version>2.572-rc38500.cc4401deed77</jenkins.version>
+    <jenkins.version>2.576</jenkins.version>
     <node.version>22.23.1</node.version>
     <npm.version>11.17.0</npm.version>
     <spotless.check.skip>false</spotless.check.skip>

From c2d5a225de3a7f865738de5bc869afd5df77dc55 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Mon, 10 Aug 2026 20:43:41 +0100
Subject: [PATCH 4/5] Update pom.xml

---
 pom.xml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pom.xml b/pom.xml
index e2bab572..5ba37311 100644
--- a/pom.xml
+++ b/pom.xml
@@ -60,7 +60,7 @@ THE SOFTWARE.
     <gitHubRepo>jenkinsci/design-library-plugin</gitHubRepo>
     <!-- https://www.jenkins.io/doc/developer/plugin-development/choosing-jenkins-baseline/ -->
     <jenkins.baseline>2.541</jenkins.baseline>
-    <jenkins.version>2.576</jenkins.version>
+    <jenkins.version>2.577</jenkins.version>
     <node.version>24.18.0</node.version>
     <npm.version>12.0.1</npm.version>
     <spotless.check.skip>false</spotless.check.skip>

From 046681e75259be7c7f4b3bbf385ede3bafbc187c Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Tue, 11 Aug 2026 18:24:19 +0100
Subject: [PATCH 5/5] Trigger Build