+
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
+
+
+
+ ${userName}
-
-
-
+
+ Configure
+
+
+
+
+
+ Sign out
+
+
+
+
- ![[${logoAlt}]](${imagesURL}/svgs/logo.svg)
- Jenkins
-
-
+
-
-
- 
-
-
-
-
-
-
-
-
- Jenkins
-
-
+ ${%Jenkins}
diff --git a/src/main/js/app.js b/src/main/js/app.js
index c59153608751..4428b0ee5a56 100644
--- a/src/main/js/app.js
+++ b/src/main/js/app.js
@@ -2,6 +2,7 @@ import Dropdowns from "@/components/dropdowns";
import CommandPalette from "@/components/command-palette";
import Notifications from "@/components/notifications";
import SearchBar from "@/components/search-bar";
+import Header from "@/components/header";
import Tooltips from "@/components/tooltips";
import StopButtonLink from "@/components/stop-button-link";
import ConfirmationLink from "@/components/confirmation-link";
@@ -11,6 +12,7 @@ Dropdowns.init();
CommandPalette.init();
Notifications.init();
SearchBar.init();
+Header.init();
Tooltips.init();
StopButtonLink.init();
ConfirmationLink.init();
diff --git a/src/main/js/components/header/index.js b/src/main/js/components/header/index.js
new file mode 100644
index 000000000000..ea79a6e2cfb7
--- /dev/null
+++ b/src/main/js/components/header/index.js
@@ -0,0 +1,10 @@
+function init() {
+ window.addEventListener("scroll", () => {
+ const navigation = document.querySelector("#page-header");
+ navigation.style.setProperty("--background-opacity", Math.min(70, window.scrollY) + "%");
+ navigation.style.setProperty("--background-blur", Math.min(40, window.scrollY) + "px");
+ navigation.style.setProperty("--border-opacity", Math.min(10, window.scrollY) + "%");
+ });
+}
+
+export default { init };
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index f50677846430..caaf51140f17 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -1,15 +1,10 @@
@use "../abstracts/mixins";
.jenkins-breadcrumbs {
- position: sticky;
- top: 0;
- z-index: 999;
display: flex;
align-items: center;
- padding: 0.55rem 0.7rem 0.55rem 0.75rem;
- backdrop-filter: blur(15px);
+ gap: 0.625rem;
overflow-x: auto;
- background: var(--breadcrumbs-bar-background);
&__list {
display: contents;
@@ -24,47 +19,36 @@
display: inline-flex;
align-items: center;
justify-content: center;
- color: var(--text-color);
font-weight: 500;
- font-size: 0.875rem;
- padding: 0.2rem 0.4rem;
+ font-size: 14px;
+ padding: 0;
- & > a {
- @include mixins.item;
+ &:first-of-type {
+ font-family: "Georgia";
+ font-weight: 600;
+ font-size: 1.125rem;
+ }
+ & > a {
display: inline-flex;
align-items: center;
justify-content: center;
+ gap: 1rem;
font-weight: inherit;
font-size: inherit;
margin: 0;
padding: 0;
- color: var(--text-color);
+ color: inherit;
text-decoration: none;
margin-right: 0 !important;
- transition: var(--standard-transition);
-
- &::before,
- &::after {
- inset: -0.25rem -0.6rem;
- }
-
- &:hover,
- &:active,
- &:focus,
- &:focus-visible {
- color: var(--text-color);
- }
- }
+ transition: opacity var(--standard-transition);
- & > .model-link {
- @media (hover: none) {
- margin-right: 30px !important;
+ &:hover {
+ opacity: 0.75;
}
- &:hover,
- &--open {
- margin-right: 30px !important;
+ &:active {
+ opacity: 0.5;
}
}
}
@@ -74,8 +58,7 @@
.separator {
position: relative;
width: 1rem;
- height: 1rem;
- margin: 0.375rem 0.2rem;
+ height: 1.25rem;
&::after {
content: "";
@@ -83,51 +66,20 @@
inset: 0;
transition: var(--standard-transition);
background: var(--text-color-secondary);
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E");
- opacity: 0.6;
+ mask-size: contain;
+ mask-position: center;
+ mask-repeat: no-repeat;
+ mask-image: url("data:image/svg+xml,%3Csvg width='10' height='20' viewBox='0 0 10 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 18L8 2' stroke='black' stroke-width='1.5px' stroke-linecap='round'/%3E%3C/svg%3E%0A");
+ opacity: 0.2;
+ scale: 1.1;
}
}
- .separator {
+ .separator, .children {
&:last-of-type {
display: none;
}
}
-
- .children {
- cursor: pointer;
-
- &:hover {
- &::after {
- opacity: 1;
- transform: rotate(90deg);
- }
- }
-
- &:active {
- &::after {
- transform: translateY(2px) rotate(90deg);
- opacity: 0.5;
- }
- }
-
- &:hover,
- &:active,
- &:focus,
- &:focus-visible {
- &::after {
- background: var(--text-color);
- }
- }
-
- // Increase the hit target
- &::before {
- content: "";
- position: absolute;
- inset: -14px -5px;
- background: transparent;
- }
- }
}
}
@@ -311,30 +263,3 @@
}
}
}
-
-// TODO: Remove when YUI dropdowns are removed
-
-#breadcrumb-menu .header {
- font-weight: bold;
- font-size: 0.875rem;
- pointer-events: none;
-}
-
-#breadcrumb-menu .separator {
- position: relative;
- display: block !important;
- color: transparent;
- overflow: hidden;
- width: 100%;
-
- &::after {
- content: "";
- position: absolute;
- top: 9px;
- left: -50vw;
- right: -50vw;
- background: var(--text-color);
- height: 2px;
- opacity: 0.1;
- }
-}
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 76c7fc9028e4..34cbaff5cdd2 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -1,207 +1,55 @@
@use "../abstracts/mixins";
.page-header {
+ --background-opacity: 0%;
+ --background-blur: 0;
+ --border-opacity: 0%;
+ position: sticky;
+ top: 0;
+ z-index: 20;
display: flex;
align-items: center;
- height: 3.5rem;
+ justify-content: space-between;
font-size: var(--font-size-base);
line-height: var(--line-height-base);
- background-color: var(--header-bg-classic);
-}
-
-.page-header > * {
- margin-right: 0.75rem;
-}
-
-.page-header__brand {
- display: inline-block;
- height: 3.5rem;
- position: relative;
- flex: 1; // push controls to the end of the block
-}
-
-// Need to use the element selector to increase weight otherwise it will be overriden by the
-// a:visited selector if it is declared later
-// Only styled by the overrides with the new UI enabled
-a.page-header__brand-link {
- display: none;
-}
-
-.page-header__brand-name {
- color: inherit;
-}
-
-.page-header__brand-image {
- height: 2rem;
- width: 1.5rem;
- margin-right: 0.75rem;
-}
-
-.page-header__am-wrapper {
- display: contents;
-}
-
-.page-header__hyperlinks {
- display: flex;
- align-items: center;
-}
-
-.page-header__hyperlinks > a,
-.page-header__hyperlinks > button,
-.am-container > a {
- @include mixins.item;
-
- --text-color: var(--header-link-color);
-
- display: inline-flex;
- align-items: center;
- appearance: none;
- background: transparent;
- outline: none;
- border: none;
- cursor: pointer;
- color: var(--text-color);
- text-decoration: none;
- padding: 0.5rem;
- margin-right: 0 !important;
-
- svg {
- width: 1.25rem;
- height: 1.25rem;
- }
-
- &::before,
- &::after {
- inset: 0 !important;
- }
-
- .jenkins-menu-dropdown-chevron {
- position: relative;
- top: unset !important;
- right: unset !important;
- margin-left: 0.5rem;
-
- &::after {
- opacity: 1;
+ margin-bottom: calc(var(--section-padding) * -1);
+ padding: calc(var(--section-padding) / 1.65) var(--section-padding);
+
+ &::before {
+ content: "";
+ position: absolute;
+ inset: 0;
+ backdrop-filter: blur(var(--background-blur));
+ background: color-mix(in srgb, var(--background) var(--background-opacity), transparent);
+ border-bottom: 1.5px solid color-mix(in srgb, var(--text-color-secondary) var(--border-opacity), transparent);
+ z-index: -1;
+ background-clip: padding-box;
+ }
+
+ #jenkins-head-icon {
+ height: 2rem;
+ margin-left: 0.15rem;
+ }
+
+ .page-header__actions {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 0.5rem;
+
+ .jenkins-button {
+ min-width: 2.375rem;
+ padding: 0.5rem;
+
+ svg {
+ width: 1.25rem;
+ height: 1.25rem;
+ }
}
}
-}
-
-.page-header__hyperlinks a span {
- &:not(:first-child) {
- margin-left: 0.25rem;
- }
-}
-
-/* Search box */
-
-// Style it through the id selector to override the YUI selectors set by
-// the YUI Autocomplete module
-#searchform {
- position: relative;
- font-family: var(--font-family-sans);
- display: inline-flex;
- height: 2.5rem;
-}
-
-// Need to add the id selector to override the ".yui-skin-sam .yui-ac-input" set by
-// the YUI Autocomplete module
-#search-box.main-search__input {
- position: static;
- padding: 0.25rem 2.5rem;
- margin: 0;
- font-size: var(--font-size-base);
- line-height: var(--line-height-base);
- font-weight: bold;
- color: var(--search-input-color);
- border-radius: var(--form-input-border-radius);
- border: 2px solid var(--header-search-border);
- outline: none;
- box-shadow: 0 0 0 10px transparent;
- transition: 0.2s ease;
-
- &::placeholder {
- font-weight: normal;
- }
-
- &:active,
- &:focus {
- border-color: var(--focus-input-border);
- box-shadow: 0 0 0 5px var(--focus-input-glow);
- }
-}
-
-.main-search__icon-leading,
-.main-search__icon-trailing {
- position: absolute;
- display: inline-flex;
- height: 2.5rem;
- width: 2.5rem;
- justify-content: center;
- align-items: center;
- background: transparent;
-}
-
-.main-search__icon-leading {
- left: 0;
- pointer-events: none;
-
- svg {
- width: 16px;
- height: 16px;
- }
-}
-
-.main-search__icon-trailing {
- right: 0;
- outline-color: var(--header-link-outline);
- &:link,
- &:visited {
- color: var(--search-input-color);
+ // TODO - Might not need this
+ .page-header__am-wrapper, .page-header__hyperlinks {
+ display: contents;
}
-
- &:hover,
- &:focus {
- color: var(--header-link-bg-classic-hover);
- }
-
- &:active {
- fill: var(--header-link-bg-classic-active);
- }
-
- svg {
- width: 20px;
- height: 20px;
- }
-}
-
-#search-box-completion {
- text-align: left;
- width: 25em;
- position: absolute;
- z-index: 1000;
-}
-
-#search-box-completion ul {
- padding: 0.75rem 0;
- width: 100%;
- margin: 0;
- list-style: none;
-}
-
-#search-box-completion li {
- white-space: nowrap;
- padding: 0.25rem 1.25rem;
- font-size: var(--font-size-base);
- line-height: var(--line-height-base);
- overflow: hidden;
- text-overflow: ellipsis;
-}
-
-#search-box-sizer {
- position: absolute;
- visibility: hidden;
- min-width: 15rem;
- max-width: calc(100vw - 500px);
}
From c9c8669d63fd66ab31258d03594d25c4732e31e1 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 10:41:21 +0000
Subject: [PATCH 02/96] Push
---
src/main/js/components/header/index.js | 4 +++-
src/main/scss/components/_app-bar.scss | 4 ++--
src/main/scss/components/_page-header.scss | 1 +
3 files changed, 6 insertions(+), 3 deletions(-)
diff --git a/src/main/js/components/header/index.js b/src/main/js/components/header/index.js
index ea79a6e2cfb7..dac6014af7a4 100644
--- a/src/main/js/components/header/index.js
+++ b/src/main/js/components/header/index.js
@@ -3,7 +3,9 @@ function init() {
const navigation = document.querySelector("#page-header");
navigation.style.setProperty("--background-opacity", Math.min(70, window.scrollY) + "%");
navigation.style.setProperty("--background-blur", Math.min(40, window.scrollY) + "px");
- navigation.style.setProperty("--border-opacity", Math.min(10, window.scrollY) + "%");
+ if (!document.querySelector(".jenkins-search--app-bar")) {
+ navigation.style.setProperty("--border-opacity", Math.min(10, window.scrollY) + "%");
+ }
});
}
diff --git a/src/main/scss/components/_app-bar.scss b/src/main/scss/components/_app-bar.scss
index bce8aa213a41..b944ddb1535c 100644
--- a/src/main/scss/components/_app-bar.scss
+++ b/src/main/scss/components/_app-bar.scss
@@ -51,10 +51,10 @@
&--sticky {
position: sticky;
- top: 40px;
+ top: 45px;
padding-top: var(--section-padding);
margin-top: calc(var(--section-padding) * -1);
- z-index: 2;
+ z-index: 21;
&::before,
&::after {
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 34cbaff5cdd2..0cd706d226aa 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -14,6 +14,7 @@
line-height: var(--line-height-base);
margin-bottom: calc(var(--section-padding) * -1);
padding: calc(var(--section-padding) / 1.65) var(--section-padding);
+ min-height: 70px;
&::before {
content: "";
From 82b85a2234564536194cfa4fccaf7af52517fff0 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 10:58:29 +0000
Subject: [PATCH 03/96] More responsive
---
.../views/JenkinsHeader/headerContent.jelly | 24 ++++++++++++++++++-
.../resources/lib/layout/header/login.jelly | 8 -------
.../images/symbols/person-circle.svg | 6 ++++-
3 files changed, 28 insertions(+), 10 deletions(-)
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index f7a2974500bc..122f1d5eb1c1 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,9 +1,31 @@
-
+
diff --git a/core/src/main/resources/lib/layout/header/login.jelly b/core/src/main/resources/lib/layout/header/login.jelly
index cdea47232ad3..be378dafcb5b 100644
--- a/core/src/main/resources/lib/layout/header/login.jelly
+++ b/core/src/main/resources/lib/layout/header/login.jelly
@@ -1,13 +1,5 @@
-
-
-
-
-
-
diff --git a/war/src/main/resources/images/symbols/person-circle.svg b/war/src/main/resources/images/symbols/person-circle.svg
index 7f79912a0c15..35773df54f77 100644
--- a/war/src/main/resources/images/symbols/person-circle.svg
+++ b/war/src/main/resources/images/symbols/person-circle.svg
@@ -1 +1,5 @@
-
\ No newline at end of file
+
+
From 3d08ab850a2d012895cdfe96941f7edde9e7d1f6 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 11:04:18 +0000
Subject: [PATCH 04/96] Update headerContent.jelly
---
.../jenkins/views/JenkinsHeader/headerContent.jelly | 7 +++++--
1 file changed, 5 insertions(+), 2 deletions(-)
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 122f1d5eb1c1..5697d353b218 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,7 +1,10 @@
-
+
-
+
-
diff --git a/core/src/main/resources/lib/layout/layout.jelly b/core/src/main/resources/lib/layout/layout.jelly
index 9de36e0c5e4c..cc22921daa0a 100644
--- a/core/src/main/resources/lib/layout/layout.jelly
+++ b/core/src/main/resources/lib/layout/layout.jelly
@@ -157,6 +157,11 @@ THE SOFTWARE.
Skip to content
+
+
+
Date: Thu, 16 Jan 2025 11:19:18 +0000
Subject: [PATCH 06/96] Update logo.jelly
---
core/src/main/resources/lib/layout/header/logo.jelly | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/core/src/main/resources/lib/layout/header/logo.jelly b/core/src/main/resources/lib/layout/header/logo.jelly
index 2ff5cacaeb09..8951a7451522 100644
--- a/core/src/main/resources/lib/layout/header/logo.jelly
+++ b/core/src/main/resources/lib/layout/header/logo.jelly
@@ -1,5 +1,5 @@
- ${%Jenkins}
+ Jenkins
From 6fbabad576bf968f72ee3ef3374ec136f3177f9f Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 11:22:11 +0000
Subject: [PATCH 07/96] Update _page-header.scss
---
src/main/scss/components/_page-header.scss | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 0cd706d226aa..e03599d95ad3 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -13,8 +13,8 @@
font-size: var(--font-size-base);
line-height: var(--line-height-base);
margin-bottom: calc(var(--section-padding) * -1);
- padding: calc(var(--section-padding) / 1.65) var(--section-padding);
- min-height: 70px;
+ padding: 0 var(--section-padding);
+ min-height: 8rem;
&::before {
content: "";
From 363b63adb6fe72ad54c96813ecd6c8263f52e290 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 11:25:10 +0000
Subject: [PATCH 08/96] Update _page-header.scss
---
src/main/scss/components/_page-header.scss | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index e03599d95ad3..30a624029a86 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -14,7 +14,7 @@
line-height: var(--line-height-base);
margin-bottom: calc(var(--section-padding) * -1);
padding: 0 var(--section-padding);
- min-height: 8rem;
+ min-height: 4.375rem;
&::before {
content: "";
From 278f8c52689e7ee1d0cdc0dac99ce73338b3aa7e Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 11:37:32 +0000
Subject: [PATCH 09/96] Update header
---
src/main/scss/abstracts/_theme.scss | 13 +------------
src/main/scss/components/_breadcrumbs.scss | 13 ++++++++++++-
src/main/scss/components/_page-header.scss | 15 ++++-----------
3 files changed, 17 insertions(+), 24 deletions(-)
diff --git a/src/main/scss/abstracts/_theme.scss b/src/main/scss/abstracts/_theme.scss
index 9013839fb804..162c188d984c 100644
--- a/src/main/scss/abstracts/_theme.scss
+++ b/src/main/scss/abstracts/_theme.scss
@@ -76,18 +76,7 @@ $semantics: (
--background: var(--white);
// Header
- --brand-link-color: var(--secondary);
- --header-link-color: var(--white);
- --header-link-color-active: #f5f5f5;
- --header-search-border: var(--white);
- --search-input-color: var(--brand-link-color);
- --search-bg: var(--white);
- --search-box-completion-bg: var(--primary-hover);
- --search-box-shadow: 0 1px 7px 0 rgb(0 0 0 / 0.3);
- --header-bg-classic: var(--black);
- --header-link-bg-classic-hover: #404040;
- --header-link-bg-classic-active: #404040;
- --header-item-border-radius: 4px;
+ --header-background: var(--background);
// Breadcrumbs bar
--breadcrumbs-bar-background: oklch(
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index caaf51140f17..24db68040e17 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -4,7 +4,6 @@
display: flex;
align-items: center;
gap: 0.625rem;
- overflow-x: auto;
&__list {
display: contents;
@@ -27,6 +26,18 @@
font-family: "Georgia";
font-weight: 600;
font-size: 1.125rem;
+
+ // Increase the hit-box for the Jenkins logo for Fitts’s Law
+ a {
+ &::before {
+ content: "";
+ position: absolute;
+ top: -30px;
+ left: -100px;
+ bottom: -18px;
+ right: -15px;
+ }
+ }
}
& > a {
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 30a624029a86..b953ab8b90e9 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -15,17 +15,10 @@
margin-bottom: calc(var(--section-padding) * -1);
padding: 0 var(--section-padding);
min-height: 4.375rem;
-
- &::before {
- content: "";
- position: absolute;
- inset: 0;
- backdrop-filter: blur(var(--background-blur));
- background: color-mix(in srgb, var(--background) var(--background-opacity), transparent);
- border-bottom: 1.5px solid color-mix(in srgb, var(--text-color-secondary) var(--border-opacity), transparent);
- z-index: -1;
- background-clip: padding-box;
- }
+ backdrop-filter: blur(var(--background-blur));
+ background: color-mix(in srgb, var(--header-background) var(--background-opacity), transparent);
+ border-bottom: 1.5px solid color-mix(in srgb, var(--text-color-secondary) var(--border-opacity), transparent);
+ background-clip: padding-box;
#jenkins-head-icon {
height: 2rem;
From 53d1f7202a79dfdeb5edd1fea9c6acae4d0e4a9d Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 11:36:49 +0000
Subject: [PATCH 10/96] Tidy up breadcrumbs
---
.../resources/lib/layout/breadcrumb.jelly | 2 +-
.../resources/lib/layout/breadcrumbBar.jelly | 1 -
src/main/scss/components/_breadcrumbs.scss | 71 ++++++++-----------
3 files changed, 32 insertions(+), 42 deletions(-)
diff --git a/core/src/main/resources/lib/layout/breadcrumb.jelly b/core/src/main/resources/lib/layout/breadcrumb.jelly
index d3fc7208fbb3..5de96cb10a8e 100644
--- a/core/src/main/resources/lib/layout/breadcrumb.jelly
+++ b/core/src/main/resources/lib/layout/breadcrumb.jelly
@@ -47,7 +47,7 @@ THE SOFTWARE.
- ${attrs.title}
+ ${attrs.title}
diff --git a/core/src/main/resources/lib/layout/breadcrumbBar.jelly b/core/src/main/resources/lib/layout/breadcrumbBar.jelly
index be6bbc25cba3..2707f3c30a00 100644
--- a/core/src/main/resources/lib/layout/breadcrumbBar.jelly
+++ b/core/src/main/resources/lib/layout/breadcrumbBar.jelly
@@ -59,7 +59,6 @@ THE SOFTWARE.
hasMenu="${h.isModelWithContextMenu(anc.object)}" />
-
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index 24db68040e17..5dbcf4bf6f35 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -4,31 +4,22 @@
display: flex;
align-items: center;
gap: 0.625rem;
+ overflow-y: hidden;
+ overflow-x: auto;
&__list {
display: contents;
- list-style-type: none;
-
- & > * {
- flex-shrink: 0;
- }
&-item {
- position: relative;
- display: inline-flex;
- align-items: center;
- justify-content: center;
- font-weight: 500;
- font-size: 14px;
- padding: 0;
+ display: contents;
&:first-of-type {
- font-family: "Georgia";
- font-weight: 600;
- font-size: 1.125rem;
-
- // Increase the hit-box for the Jenkins logo for Fitts’s Law
a {
+ font-family: "Georgia";
+ font-weight: 600;
+ font-size: 1.125rem;
+
+ // Increase the hit-box for the Jenkins logo for Fitts’s Law
&::before {
content: "";
position: absolute;
@@ -40,41 +31,41 @@
}
}
- & > a {
+ & > a, span {
+ position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 1rem;
- font-weight: inherit;
- font-size: inherit;
+ font-weight: 500;
+ font-size: var(--font-size-sm);
margin: 0;
padding: 0;
color: inherit;
text-decoration: none;
- margin-right: 0 !important;
- transition: opacity var(--standard-transition);
+ text-wrap: nowrap;
+ flex-shrink: 0;
- &:hover {
- opacity: 0.75;
- }
+ &:link {
+ transition: opacity var(--standard-transition);
- &:active {
- opacity: 0.5;
+ &:hover {
+ opacity: 0.75;
+ }
+
+ &:active {
+ opacity: 0.5;
+ }
}
}
- }
-
- // '>' separator between two items
- .children,
- .separator {
- position: relative;
- width: 1rem;
- height: 1.25rem;
+ // '/' separator between two items
&::after {
content: "";
- position: absolute;
- inset: 0;
+ position: relative;
+ width: 1rem;
+ height: 1.25rem;
+ flex-shrink: 0;
transition: var(--standard-transition);
background: var(--text-color-secondary);
mask-size: contain;
@@ -84,11 +75,11 @@
opacity: 0.2;
scale: 1.1;
}
- }
- .separator, .children {
&:last-of-type {
- display: none;
+ &::after {
+ display: none;
+ }
}
}
}
From ae239df3e145aebe5e05f91eb4dc74ec9d7c4f82 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 11:56:24 +0000
Subject: [PATCH 11/96] Tidy up focus
---
src/main/scss/components/_breadcrumbs.scss | 27 +++++++++++++++-------
src/main/scss/components/_page-header.scss | 8 +++----
2 files changed, 23 insertions(+), 12 deletions(-)
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index 5dbcf4bf6f35..7452a8008c51 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -6,6 +6,7 @@
gap: 0.625rem;
overflow-y: hidden;
overflow-x: auto;
+ padding-left: var(--section-padding);
&__list {
display: contents;
@@ -45,17 +46,27 @@
text-decoration: none;
text-wrap: nowrap;
flex-shrink: 0;
+ }
- &:link {
- transition: opacity var(--standard-transition);
+ & > a {
+ @include mixins.item;
- &:hover {
- opacity: 0.75;
- }
+ --item-background--hover: transparent;
+ --item-background--active: transparent;
+ --item-box-shadow--focus: transparent;
- &:active {
- opacity: 0.5;
- }
+ transition: opacity var(--standard-transition);
+
+ &::before, &::after {
+ inset: -2px -6px;
+ }
+
+ &:hover {
+ opacity: 0.75;
+ }
+
+ &:active {
+ opacity: 0.5;
}
}
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index b953ab8b90e9..5d2d24a7c5d4 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -7,13 +7,12 @@
position: sticky;
top: 0;
z-index: 20;
- display: flex;
- align-items: center;
- justify-content: space-between;
+ display: grid;
+ grid-template-columns: 1fr auto;
+ gap: var(--section-padding);
font-size: var(--font-size-base);
line-height: var(--line-height-base);
margin-bottom: calc(var(--section-padding) * -1);
- padding: 0 var(--section-padding);
min-height: 4.375rem;
backdrop-filter: blur(var(--background-blur));
background: color-mix(in srgb, var(--header-background) var(--background-opacity), transparent);
@@ -30,6 +29,7 @@
align-items: center;
justify-content: center;
gap: 0.5rem;
+ padding-right: var(--section-padding);
.jenkins-button {
min-width: 2.375rem;
From d85458f937d0638985e10dafcf1e6e0b3d460195 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 12:12:25 +0000
Subject: [PATCH 12/96] Update _breadcrumbs.scss
---
src/main/scss/components/_breadcrumbs.scss | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index 7452a8008c51..3bbb2d484b1e 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -62,11 +62,11 @@
}
&:hover {
- opacity: 0.75;
+ opacity: 0.7;
}
&:active {
- opacity: 0.5;
+ opacity: 0.4;
}
}
From cd3c38448428a0182a1dc2705681f071686a7e88 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 17:59:14 +0000
Subject: [PATCH 13/96] Update configure.jelly
---
core/src/main/resources/jenkins/model/Jenkins/configure.jelly | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/core/src/main/resources/jenkins/model/Jenkins/configure.jelly b/core/src/main/resources/jenkins/model/Jenkins/configure.jelly
index 91d01c69f549..7b7ce31aed11 100644
--- a/core/src/main/resources/jenkins/model/Jenkins/configure.jelly
+++ b/core/src/main/resources/jenkins/model/Jenkins/configure.jelly
@@ -29,7 +29,7 @@ THE SOFTWARE.
activeAdministrativeMonitors = Optional.ofNullable(decorator.getMonitorsToDisplay()).orElse(Collections.emptyList());
+ boolean anySecurity = activeAdministrativeMonitors.stream().anyMatch(AdministrativeMonitor::isSecurity);
+
+ if (activeAdministrativeMonitors.isEmpty()) {
+ return null;
+ }
+
+ String suffix = activeAdministrativeMonitors.size() > 1 ? "notifications" : "notification";
+
+ return new Badge(String.valueOf(activeAdministrativeMonitors.size()),
+ activeAdministrativeMonitors.size() + " " + suffix,
+ anySecurity ? Badge.Severity.DANGER : Badge.Severity.WARNING);
+ }
}
diff --git a/core/src/main/java/hudson/model/RootAction.java b/core/src/main/java/hudson/model/RootAction.java
index 9c431ee635ff..f9659fef5903 100644
--- a/core/src/main/java/hudson/model/RootAction.java
+++ b/core/src/main/java/hudson/model/RootAction.java
@@ -24,8 +24,10 @@
package hudson.model;
+import edu.umd.cs.findbugs.annotations.CheckForNull;
import hudson.Extension;
import hudson.ExtensionPoint;
+import jenkins.management.Badge;
/**
* Marker interface for actions that are added to {@link jenkins.model.Jenkins}.
@@ -38,4 +40,14 @@
* @since 1.311
*/
public interface RootAction extends Action, ExtensionPoint {
+
+ /**
+ * A {@link Badge} shown as overlay over the icon on "Manage Jenkins".
+ *
+ * @return badge or {@code null} if no badge should be shown.
+ * @since 2.385
+ */
+ default @CheckForNull Badge getBadge() {
+ return null;
+ }
}
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly
index ff40bc54365c..933aa774f50f 100644
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly
+++ b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly
@@ -23,49 +23,49 @@ THE SOFTWARE.
-->
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index bd153607329f..60aee5488f96 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,5 +1,5 @@
-
+
From 5b340a8739c175c20b1002735964df2669eb260d Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 18:30:57 +0000
Subject: [PATCH 15/96] Add badges
---
.../hudson/model/ManageJenkinsAction.java | 11 ++++------
.../views/JenkinsHeader/headerContent.jelly | 20 +++++++++++++++++--
src/main/scss/components/_page-header.scss | 9 +++++++++
3 files changed, 31 insertions(+), 9 deletions(-)
diff --git a/core/src/main/java/hudson/model/ManageJenkinsAction.java b/core/src/main/java/hudson/model/ManageJenkinsAction.java
index 19cffdba8036..4cd1e1f9686f 100644
--- a/core/src/main/java/hudson/model/ManageJenkinsAction.java
+++ b/core/src/main/java/hudson/model/ManageJenkinsAction.java
@@ -27,10 +27,6 @@
import hudson.Extension;
import hudson.Util;
import java.io.IOException;
-import java.util.Collection;
-import java.util.Collections;
-import java.util.Optional;
-import jenkins.management.AdministrativeMonitorsDecorator;
import jenkins.management.Badge;
import jenkins.model.Jenkins;
import jenkins.model.ModelObjectWithContextMenu;
@@ -105,10 +101,11 @@ public Badge getBadge() {
return null;
}
- String suffix = activeAdministrativeMonitors.size() > 1 ? "notifications" : "notification";
+ int size = activeAdministrativeMonitors.size();
+ String suffix = size > 1 ? "notifications" : "notification";
- return new Badge(String.valueOf(activeAdministrativeMonitors.size()),
- activeAdministrativeMonitors.size() + " " + suffix,
+ return new Badge(String.valueOf(size),
+ size + " " + suffix,
anySecurity ? Badge.Severity.DANGER : Badge.Severity.WARNING);
}
}
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 60aee5488f96..67bf9243a8c7 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -21,10 +21,26 @@
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 5d2d24a7c5d4..392ab6271a02 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -39,6 +39,15 @@
width: 1.25rem;
height: 1.25rem;
}
+
+ .jenkins-badge {
+ position: absolute;
+ top: calc(15%);
+ right: calc(15%);
+ min-width: 5px;
+ min-height: 5px;
+ padding: 0;
+ }
}
}
From 73b81a387542e4a8826101da99458fe900772641 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 18:32:16 +0000
Subject: [PATCH 16/96] Tidy
---
core/src/main/java/hudson/model/ManageJenkinsAction.java | 6 +++++-
src/main/scss/components/_page-header.scss | 4 ++--
2 files changed, 7 insertions(+), 3 deletions(-)
diff --git a/core/src/main/java/hudson/model/ManageJenkinsAction.java b/core/src/main/java/hudson/model/ManageJenkinsAction.java
index 4cd1e1f9686f..6f633bd0574c 100644
--- a/core/src/main/java/hudson/model/ManageJenkinsAction.java
+++ b/core/src/main/java/hudson/model/ManageJenkinsAction.java
@@ -27,6 +27,10 @@
import hudson.Extension;
import hudson.Util;
import java.io.IOException;
+import java.util.Collection;
+import java.util.Collections;
+import java.util.Optional;
+import jenkins.management.AdministrativeMonitorsDecorator;
import jenkins.management.Badge;
import jenkins.model.Jenkins;
import jenkins.model.ModelObjectWithContextMenu;
@@ -40,7 +44,7 @@
import org.kohsuke.stapler.StaplerResponse2;
/**
- * Adds the "Manage Jenkins" link to the top page.
+ * Adds the "Manage Jenkins" link to the navigation bar.
*
* @author Kohsuke Kawaguchi
*/
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 392ab6271a02..c44e3cc70c8f 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -42,8 +42,8 @@
.jenkins-badge {
position: absolute;
- top: calc(15%);
- right: calc(15%);
+ top: calc(16%);
+ right: calc(16%);
min-width: 5px;
min-height: 5px;
padding: 0;
From a04b8f216e5935d71df2a29549cf5c29d68886ea Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 18:33:34 +0000
Subject: [PATCH 17/96] Push
---
core/src/main/java/hudson/model/ManageJenkinsAction.java | 2 ++
.../resources/hudson/model/ManageJenkinsAction/index.jelly | 7 -------
2 files changed, 2 insertions(+), 7 deletions(-)
diff --git a/core/src/main/java/hudson/model/ManageJenkinsAction.java b/core/src/main/java/hudson/model/ManageJenkinsAction.java
index 6f633bd0574c..6f562da0e354 100644
--- a/core/src/main/java/hudson/model/ManageJenkinsAction.java
+++ b/core/src/main/java/hudson/model/ManageJenkinsAction.java
@@ -105,6 +105,8 @@ public Badge getBadge() {
return null;
}
+ // TODO - should this include plugin updates?
+
int size = activeAdministrativeMonitors.size();
String suffix = size > 1 ? "notifications" : "notification";
diff --git a/core/src/main/resources/hudson/model/ManageJenkinsAction/index.jelly b/core/src/main/resources/hudson/model/ManageJenkinsAction/index.jelly
index eb76bed16c43..2d95ffc577b1 100644
--- a/core/src/main/resources/hudson/model/ManageJenkinsAction/index.jelly
+++ b/core/src/main/resources/hudson/model/ManageJenkinsAction/index.jelly
@@ -28,11 +28,6 @@ THE SOFTWARE.
-
-
-
@@ -61,7 +55,6 @@ THE SOFTWARE.
- ${taskTags!=null and attrs.contextMenu!='false' ? it.addContextMenuItem(taskTags, m.urlName, iconSrc, iconXml, m.displayName, m.requiresPOST, m.requiresConfirmation, m.badge, sure) : null}
From 82a3d809ec8dc826f039a225a59a31f63d4d8f71 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 18:36:04 +0000
Subject: [PATCH 18/96] Update headerContent.jelly
---
.../resources/jenkins/views/JenkinsHeader/headerContent.jelly | 2 ++
1 file changed, 2 insertions(+)
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 67bf9243a8c7..577d43cf5b90 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -18,6 +18,8 @@
+
+
From 1123309ab592469f7e89ffb0d15b718606ef148c Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 20:52:38 +0000
Subject: [PATCH 19/96] Update ManageJenkinsAction.java
---
.../hudson/model/ManageJenkinsAction.java | 36 +++++++++----------
1 file changed, 17 insertions(+), 19 deletions(-)
diff --git a/core/src/main/java/hudson/model/ManageJenkinsAction.java b/core/src/main/java/hudson/model/ManageJenkinsAction.java
index 6f562da0e354..6fd000d15322 100644
--- a/core/src/main/java/hudson/model/ManageJenkinsAction.java
+++ b/core/src/main/java/hudson/model/ManageJenkinsAction.java
@@ -27,11 +27,8 @@
import hudson.Extension;
import hudson.Util;
import java.io.IOException;
-import java.util.Collection;
-import java.util.Collections;
-import java.util.Optional;
-import jenkins.management.AdministrativeMonitorsDecorator;
import jenkins.management.Badge;
+import jenkins.management.PluginsLink;
import jenkins.model.Jenkins;
import jenkins.model.ModelObjectWithContextMenu;
import org.apache.commons.jelly.JellyException;
@@ -95,23 +92,24 @@ public void addContextMenuItem(ContextMenu menu, String url, String icon, String
@Override
public Badge getBadge() {
- Jenkins jenkins = Jenkins.get();
- AdministrativeMonitorsDecorator decorator = jenkins.getExtensionList(PageDecorator.class)
- .get(AdministrativeMonitorsDecorator.class);
- Collection activeAdministrativeMonitors = Optional.ofNullable(decorator.getMonitorsToDisplay()).orElse(Collections.emptyList());
- boolean anySecurity = activeAdministrativeMonitors.stream().anyMatch(AdministrativeMonitor::isSecurity);
-
- if (activeAdministrativeMonitors.isEmpty()) {
- return null;
- }
+// Jenkins jenkins = Jenkins.get();
+// AdministrativeMonitorsDecorator decorator = jenkins.getExtensionList(PageDecorator.class)
+// .get(AdministrativeMonitorsDecorator.class);
+// Collection activeAdministrativeMonitors = Optional.ofNullable(decorator.getMonitorsToDisplay()).orElse(Collections.emptyList());
+// boolean anySecurity = activeAdministrativeMonitors.stream().anyMatch(AdministrativeMonitor::isSecurity);
+//
+// if (activeAdministrativeMonitors.isEmpty()) {
+// return null;
+// }
// TODO - should this include plugin updates?
+ return new PluginsLink().getBadge();
- int size = activeAdministrativeMonitors.size();
- String suffix = size > 1 ? "notifications" : "notification";
-
- return new Badge(String.valueOf(size),
- size + " " + suffix,
- anySecurity ? Badge.Severity.DANGER : Badge.Severity.WARNING);
+// int size = activeAdministrativeMonitors.size();
+// String suffix = size > 1 ? "notifications" : "notification";
+//
+// return new Badge(String.valueOf(size),
+// size + " " + suffix,
+// anySecurity ? Badge.Severity.DANGER : Badge.Severity.WARNING);
}
}
From d5c986ff405233f714c78de3fa0e746050a4358b Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 20:56:27 +0000
Subject: [PATCH 20/96] Update headerContent.jelly
---
.../views/JenkinsHeader/headerContent.jelly | 21 +++++++++++--------
1 file changed, 12 insertions(+), 9 deletions(-)
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 577d43cf5b90..184eb2cb4cfc 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,5 +1,5 @@
-
+
-
-
+
+
+
+
+
+
-
-
-
From 25f04d9920db8a855ab397ce20a9a6e430123306 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 21:03:42 +0000
Subject: [PATCH 21/96] Working!
---
core/src/main/java/hudson/model/ManageJenkinsAction.java | 8 +++++++-
.../jenkins/views/JenkinsHeader/headerContent.jelly | 5 ++---
2 files changed, 9 insertions(+), 4 deletions(-)
diff --git a/core/src/main/java/hudson/model/ManageJenkinsAction.java b/core/src/main/java/hudson/model/ManageJenkinsAction.java
index 6fd000d15322..19f7f01cdfcd 100644
--- a/core/src/main/java/hudson/model/ManageJenkinsAction.java
+++ b/core/src/main/java/hudson/model/ManageJenkinsAction.java
@@ -25,6 +25,7 @@
package hudson.model;
import hudson.Extension;
+import hudson.Functions;
import hudson.Util;
import java.io.IOException;
import jenkins.management.Badge;
@@ -103,7 +104,12 @@ public Badge getBadge() {
// }
// TODO - should this include plugin updates?
- return new PluginsLink().getBadge();
+ return ManagementLink.all()
+ .stream()
+ .filter(e -> e.getClass().equals(PluginsLink.class))
+ .findFirst()
+ .map(ManagementLink::getBadge)
+ .orElse(null);
// int size = activeAdministrativeMonitors.size();
// String suffix = size > 1 ? "notifications" : "notification";
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 184eb2cb4cfc..a8886f9df264 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -23,8 +23,7 @@
-
-
@@ -39,7 +38,7 @@
From 244f48df860e477b11e3fe943878061402043c9f Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 21:32:23 +0000
Subject: [PATCH 22/96] WB
---
.../hudson/model/ManageJenkinsAction.java | 1 -
.../java/hudson/model/MyViewsProperty.java | 3 +-
.../model/navigation/SearchAction.java | 50 +++++++++++++++
.../jenkins/model/navigation/UserAction.java | 64 +++++++++++++++++++
.../navigation/UserAction/jumplist.jelly | 26 ++++++++
.../views/JenkinsHeader/headerContent.jelly | 20 ++++--
.../resources/lib/layout/header/login.jelly | 53 ++-------------
src/main/js/api/search.js | 2 +-
.../js/components/command-palette/index.js | 2 +-
src/main/js/components/tooltips/index.js | 11 ++++
src/main/js/keyboard-shortcuts.js | 2 +-
.../test/java/hudson/search/SearchTest.java | 2 +-
12 files changed, 175 insertions(+), 61 deletions(-)
create mode 100644 core/src/main/java/jenkins/model/navigation/SearchAction.java
create mode 100644 core/src/main/java/jenkins/model/navigation/UserAction.java
create mode 100644 core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
diff --git a/core/src/main/java/hudson/model/ManageJenkinsAction.java b/core/src/main/java/hudson/model/ManageJenkinsAction.java
index 19f7f01cdfcd..07a8b30168ba 100644
--- a/core/src/main/java/hudson/model/ManageJenkinsAction.java
+++ b/core/src/main/java/hudson/model/ManageJenkinsAction.java
@@ -25,7 +25,6 @@
package hudson.model;
import hudson.Extension;
-import hudson.Functions;
import hudson.Util;
import java.io.IOException;
import jenkins.management.Badge;
diff --git a/core/src/main/java/hudson/model/MyViewsProperty.java b/core/src/main/java/hudson/model/MyViewsProperty.java
index 32ef03f73ecd..ec2c826a6d83 100644
--- a/core/src/main/java/hudson/model/MyViewsProperty.java
+++ b/core/src/main/java/hudson/model/MyViewsProperty.java
@@ -301,7 +301,8 @@ public MyViewsTabBar getMyViewsTabBar() {
return Jenkins.get().getMyViewsTabBar();
}
- @Extension @Symbol("myView")
+ // TODO - Do we want this?
+ @Symbol("myView")
public static class GlobalAction implements RootAction {
@Override
diff --git a/core/src/main/java/jenkins/model/navigation/SearchAction.java b/core/src/main/java/jenkins/model/navigation/SearchAction.java
new file mode 100644
index 000000000000..36a56bda2f53
--- /dev/null
+++ b/core/src/main/java/jenkins/model/navigation/SearchAction.java
@@ -0,0 +1,50 @@
+/*
+ * The MIT License
+ *
+ * Copyright (c) 2025, Jan Faracik
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+package jenkins.model.navigation;
+
+import hudson.Extension;
+import hudson.model.RootAction;
+
+/**
+ * TODO
+ */
+@Extension(ordinal = 999)
+public class SearchAction implements RootAction {
+
+ @Override
+ public String getIconFileName() {
+ return "symbol-search";
+ }
+
+ @Override
+ public String getDisplayName() {
+ return "Search";
+ }
+
+ @Override
+ public String getUrlName() {
+ return null;
+ }
+}
diff --git a/core/src/main/java/jenkins/model/navigation/UserAction.java b/core/src/main/java/jenkins/model/navigation/UserAction.java
new file mode 100644
index 000000000000..eb5cd6f43ccc
--- /dev/null
+++ b/core/src/main/java/jenkins/model/navigation/UserAction.java
@@ -0,0 +1,64 @@
+/*
+ * The MIT License
+ *
+ * Copyright (c) 2025, Jan Faracik
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+package jenkins.model.navigation;
+
+import static hudson.Functions.getAvatar;
+
+import hudson.Extension;
+import hudson.model.RootAction;
+import hudson.model.User;
+import org.kohsuke.accmod.Restricted;
+import org.kohsuke.accmod.restrictions.NoExternalUse;
+
+/**
+ * TODO
+ */
+@Extension(ordinal = -1)
+public class UserAction implements RootAction {
+
+ @Override
+ public String getIconFileName() {
+ if (User.current() == null) {
+ return null;
+ }
+
+ return getAvatar(User.current(), "48x48");
+ }
+
+ @Override
+ public String getDisplayName() {
+ return User.current().getFullName();
+ }
+
+ @Override
+ public String getUrlName() {
+ return User.current().getUrl();
+ }
+
+ @Restricted(NoExternalUse.class)
+ public User getUser() {
+ return User.current();
+ }
+}
diff --git a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
new file mode 100644
index 000000000000..1bc3e0aad4cf
--- /dev/null
+++ b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
@@ -0,0 +1,26 @@
+
+
+
+
\ No newline at end of file
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index a8886f9df264..8ffbc67c4832 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,12 +1,12 @@
-
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
diff --git a/src/main/js/api/search.js b/src/main/js/api/search.js
index ebe5f89df1bd..a864817db224 100644
--- a/src/main/js/api/search.js
+++ b/src/main/js/api/search.js
@@ -2,7 +2,7 @@
* @param {string} searchTerm
*/
function search(searchTerm) {
- const address = document.getElementById("button-open-command-palette").dataset
+ const address = document.getElementById("root-action-SearchAction").dataset
.searchUrl;
return fetch(`${address}?query=${encodeURIComponent(searchTerm)}`);
}
diff --git a/src/main/js/components/command-palette/index.js b/src/main/js/components/command-palette/index.js
index 56ed7347fb72..acf63a85d991 100644
--- a/src/main/js/components/command-palette/index.js
+++ b/src/main/js/components/command-palette/index.js
@@ -11,7 +11,7 @@ const datasources = [JenkinsSearchSource];
function init() {
const i18n = document.getElementById("command-palette-i18n");
const headerCommandPaletteButton = document.getElementById(
- "button-open-command-palette",
+ "root-action-SearchAction",
);
if (headerCommandPaletteButton === null) {
return; // no JenkinsHeader, no h:searchbox
diff --git a/src/main/js/components/tooltips/index.js b/src/main/js/components/tooltips/index.js
index 443c4179ed14..8a5db05567b3 100644
--- a/src/main/js/components/tooltips/index.js
+++ b/src/main/js/components/tooltips/index.js
@@ -5,6 +5,17 @@ const TOOLTIP_BASE = {
arrow: false,
theme: "tooltip",
animation: "tooltip",
+ popperOptions: {
+ modifiers: [
+ {
+ name: 'preventOverflow',
+ options: {
+ boundary: 'viewport',
+ padding: parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--section-padding')) * 16
+ },
+ },
+ ],
+ },
};
/**
diff --git a/src/main/js/keyboard-shortcuts.js b/src/main/js/keyboard-shortcuts.js
index d22c023121ea..ef372b7f7114 100644
--- a/src/main/js/keyboard-shortcuts.js
+++ b/src/main/js/keyboard-shortcuts.js
@@ -2,7 +2,7 @@ import hotkeys from "hotkeys-js";
window.addEventListener("load", () => {
const openCommandPaletteButton = document.querySelector(
- "#button-open-command-palette",
+ "#root-action-SearchAction",
);
if (openCommandPaletteButton) {
hotkeys(translateModifierKeysForUsersPlatform("CMD+K"), () => {
diff --git a/test/src/test/java/hudson/search/SearchTest.java b/test/src/test/java/hudson/search/SearchTest.java
index 31660090eba2..270263379ce3 100644
--- a/test/src/test/java/hudson/search/SearchTest.java
+++ b/test/src/test/java/hudson/search/SearchTest.java
@@ -67,7 +67,7 @@ public class SearchTest {
@Rule public JenkinsRule j = new JenkinsRule();
private void searchWithoutNavigating(HtmlPage page, String query) throws IOException {
- HtmlButton button = page.querySelector("#button-open-command-palette");
+ HtmlButton button = page.querySelector("#root-action-SearchAction");
button.click();
HtmlInput search = page.querySelector("#command-bar");
From abe47708f4e759eee296646847c7a297c7880956 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 18 Jan 2025 21:45:08 +0000
Subject: [PATCH 23/96] Tidy up
---
.../navigation/SearchAction/tooltip.jelly | 9 +++++++
.../navigation/UserAction/jumplist.jelly | 6 ++---
.../views/JenkinsHeader/headerContent.jelly | 12 +++++----
.../lib/layout/header/searchbox.jelly | 25 -------------------
.../main/resources/lib/layout/layout.jelly | 4 ++-
.../resources/lib/layout/pageHeader.jelly | 1 +
src/main/js/api/search.js | 2 +-
.../js/components/command-palette/index.js | 2 +-
8 files changed, 25 insertions(+), 36 deletions(-)
create mode 100644 core/src/main/resources/jenkins/model/navigation/SearchAction/tooltip.jelly
diff --git a/core/src/main/resources/jenkins/model/navigation/SearchAction/tooltip.jelly b/core/src/main/resources/jenkins/model/navigation/SearchAction/tooltip.jelly
new file mode 100644
index 000000000000..400875cd3d5d
--- /dev/null
+++ b/core/src/main/resources/jenkins/model/navigation/SearchAction/tooltip.jelly
@@ -0,0 +1,9 @@
+
+
+
diff --git a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
index 1bc3e0aad4cf..18fa9cb32570 100644
--- a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
+++ b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
@@ -3,7 +3,7 @@
- Sign out
+ ${%Sign out}
\ No newline at end of file
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 8ffbc67c4832..b807db6fba4c 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -6,8 +6,6 @@
- ${%Jenkins}
+ Jenkins
-
-
-
-
-
-
-
-
-
-
-
-
-
- ${category.key.label}
- ${taskTags!=null and attrs.contextMenu!='false' ? taskTags.addHeader(category.key.label) : null}${action.displayName}
- ${action.badge.tooltip}
+ ${action.badge.tooltip}
+
-
@@ -24,7 +24,10 @@
+
@@ -37,14 +40,19 @@
-
+
+ root-action-${action.class.simpleName}
+ ${h.getActionUrl(app.url, action)}
+ ${interactive}
+ false
+ jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
-
+
diff --git a/core/src/main/resources/lib/layout/header/login.jelly b/core/src/main/resources/lib/layout/header/login.jelly
index be378dafcb5b..04aebf0306b8 100644
--- a/core/src/main/resources/lib/layout/header/login.jelly
+++ b/core/src/main/resources/lib/layout/header/login.jelly
@@ -1,54 +1,9 @@
-
+
+ ${%Search}
+
+
+
-
-
@@ -18,19 +16,23 @@
-
-
+
+
+
+
+
-
diff --git a/core/src/main/resources/lib/layout/layout.jelly b/core/src/main/resources/lib/layout/layout.jelly
index cc22921daa0a..7fdf49895c23 100644
--- a/core/src/main/resources/lib/layout/layout.jelly
+++ b/core/src/main/resources/lib/layout/layout.jelly
@@ -150,7 +150,9 @@ THE SOFTWARE.
-
+
diff --git a/core/src/main/resources/lib/layout/pageHeader.jelly b/core/src/main/resources/lib/layout/pageHeader.jelly
index d44de7d7b69a..d2b80c80335a 100644
--- a/core/src/main/resources/lib/layout/pageHeader.jelly
+++ b/core/src/main/resources/lib/layout/pageHeader.jelly
@@ -27,4 +27,5 @@
getActions() {
+ return Jenkins.get()
+ .getActions()
+ .stream()
+ .filter(e -> e.getIconFileName() != null)
+ .toList();
+ }
}
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index b807db6fba4c..34f2b3f79618 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -7,7 +7,7 @@
-
+
${action.displayName}
diff --git a/core/src/main/resources/lib/layout/header/searchbox.jelly b/core/src/main/resources/lib/layout/header/searchbox.jelly
index f97a32094fe6..0e9f6e62570f 100644
--- a/core/src/main/resources/lib/layout/header/searchbox.jelly
+++ b/core/src/main/resources/lib/layout/header/searchbox.jelly
@@ -1,28 +1,3 @@
-
-
-
-
-
-
-
-
-
-
- ${%Search}
-
-
-
-
-
-
+
+
+
+
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
- root-action-${action.class.simpleName}
- ${h.getActionUrl(app.url, action)}
- ${interactive}
- false
- jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
-
+
+
-
+
-
+
+
+
+ root-action-${action.class.simpleName}
+ ${h.getActionUrl(app.url, action)}
+ ${interactive}
+ false
+ jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
+
+
+
+
From 5ddd415dfaa0bd52455f4c7b6f33ac25bb86f4cf Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 19 Jan 2025 12:08:19 +0000
Subject: [PATCH 30/96] Update _side-panel-tasks.scss
---
src/main/scss/components/_side-panel-tasks.scss | 8 +-------
1 file changed, 1 insertion(+), 7 deletions(-)
diff --git a/src/main/scss/components/_side-panel-tasks.scss b/src/main/scss/components/_side-panel-tasks.scss
index c8c3ddc0e4e9..4bd112a0ce9e 100644
--- a/src/main/scss/components/_side-panel-tasks.scss
+++ b/src/main/scss/components/_side-panel-tasks.scss
@@ -31,9 +31,7 @@ $background-outset: 0.7rem;
}
& > #tasks > .jenkins-search-container {
- margin-left: -$background-outset;
- margin-right: -$background-outset;
- margin-bottom: calc(var(--section-padding) / 2);
+ margin: calc(var(--section-padding) * -0.5) -$background-outset calc(var(--section-padding) / 2);
.jenkins-search__icon {
width: 2.8rem;
@@ -46,10 +44,6 @@ $background-outset: 0.7rem;
}
}
-#side-panel .jenkins-search__results-container--visible .task-link {
- opacity: 0.3;
-}
-
#tasks .task {
margin: 0 calc($background-outset * -1);
}
From 181d9d26e4718398979afaa3c284ce15f2d9317e Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 19 Jan 2025 12:09:19 +0000
Subject: [PATCH 31/96] Update _side-panel-tasks.scss
---
src/main/scss/components/_side-panel-tasks.scss | 5 ++++-
1 file changed, 4 insertions(+), 1 deletion(-)
diff --git a/src/main/scss/components/_side-panel-tasks.scss b/src/main/scss/components/_side-panel-tasks.scss
index ee24cdd5f068..60439dd98839 100644
--- a/src/main/scss/components/_side-panel-tasks.scss
+++ b/src/main/scss/components/_side-panel-tasks.scss
@@ -31,7 +31,10 @@ $background-outset: 0.7rem;
}
& > #tasks > .jenkins-search-container {
- margin: calc(var(--section-padding) * -0.5) -$background-outset calc(var(--section-padding) / 2);
+ margin-top: calc(var(--section-padding) * -0.5);
+ margin-left: -$background-outset;
+ margin-right: -$background-outset;
+ margin-bottom: calc(var(--section-padding) / 2);
.jenkins-search__icon {
width: 2.8rem;
From 46a9c35047c2572260d7ba7ef62fbba40b7e99c6 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 19 Jan 2025 12:12:26 +0000
Subject: [PATCH 32/96] Update UserAction.java
---
.../main/java/jenkins/model/navigation/UserAction.java | 8 ++++++++
1 file changed, 8 insertions(+)
diff --git a/core/src/main/java/jenkins/model/navigation/UserAction.java b/core/src/main/java/jenkins/model/navigation/UserAction.java
index eb5cd6f43ccc..87465148eedf 100644
--- a/core/src/main/java/jenkins/model/navigation/UserAction.java
+++ b/core/src/main/java/jenkins/model/navigation/UserAction.java
@@ -49,11 +49,19 @@ public String getIconFileName() {
@Override
public String getDisplayName() {
+ if (User.current() == null) {
+ return null;
+ }
+
return User.current().getFullName();
}
@Override
public String getUrlName() {
+ if (User.current() == null) {
+ return null;
+ }
+
return User.current().getUrl();
}
From bb7b73f38d0c40ae883d58d74795d93dc38ec04d Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 19 Jan 2025 12:31:29 +0000
Subject: [PATCH 33/96] Update Jenkins.java
---
core/src/main/java/jenkins/model/Jenkins.java | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/core/src/main/java/jenkins/model/Jenkins.java b/core/src/main/java/jenkins/model/Jenkins.java
index 66adc45f82e8..677ae234ddf8 100644
--- a/core/src/main/java/jenkins/model/Jenkins.java
+++ b/core/src/main/java/jenkins/model/Jenkins.java
@@ -2347,7 +2347,7 @@ public String getSearchUrl() {
public SearchIndexBuilder makeSearchIndex() {
SearchIndexBuilder builder = super.makeSearchIndex();
- this.actions.stream().filter(e -> e.getIconFileName() != null).forEach(action -> builder.add(new SearchItem() {
+ this.actions.stream().filter(e -> !(e.getIconFileName() == null || e.getUrlName() == null)).forEach(action -> builder.add(new SearchItem() {
@Override
public String getSearchName() {
return action.getDisplayName();
From 7131e9a1aff7e9d3ee235792dfb48b6e03c00c4c Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 19 Jan 2025 21:34:22 +0000
Subject: [PATCH 34/96] Add border to account image
---
src/main/js/components/header/index.js | 7 ++++---
src/main/scss/components/_dropdowns.scss | 7 +++++++
src/main/scss/components/_page-header.scss | 10 ++++++++++
3 files changed, 21 insertions(+), 3 deletions(-)
diff --git a/src/main/js/components/header/index.js b/src/main/js/components/header/index.js
index 449ad85ab7a5..cf48717a4757 100644
--- a/src/main/js/components/header/index.js
+++ b/src/main/js/components/header/index.js
@@ -1,13 +1,14 @@
function init() {
window.addEventListener("scroll", () => {
const navigation = document.querySelector("#page-header");
+ const scrollY = Math.max(0, window.scrollY);
navigation.style.setProperty(
"--background-opacity",
- Math.min(70, window.scrollY) + "%",
+ Math.min(70, scrollY) + "%",
);
navigation.style.setProperty(
"--background-blur",
- Math.min(40, window.scrollY) + "px",
+ Math.min(40, scrollY) + "px",
);
if (
!document.querySelector(".jenkins-search--app-bar") &&
@@ -15,7 +16,7 @@ function init() {
) {
navigation.style.setProperty(
"--border-opacity",
- Math.min(10, window.scrollY) + "%",
+ Math.min(10, scrollY) + "%",
);
}
});
diff --git a/src/main/scss/components/_dropdowns.scss b/src/main/scss/components/_dropdowns.scss
index 390867ccaf23..5b4dc695e73c 100644
--- a/src/main/scss/components/_dropdowns.scss
+++ b/src/main/scss/components/_dropdowns.scss
@@ -160,6 +160,13 @@ $dropdown-padding: 0.4rem;
height: 1.125rem;
color: inherit;
}
+
+ img {
+ border-radius: 100px;
+ outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
+ background: color-mix(in srgb, var(--text-color) 5%, transparent);
+ outline-offset: -1px;
+ }
}
&:disabled {
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 20fa0013c521..90a22ff2a7af 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -48,6 +48,7 @@
.jenkins-button {
min-width: 2.375rem;
+ min-height: 2.375rem;
padding: 0.5rem;
svg {
@@ -55,6 +56,15 @@
height: 1.25rem;
}
+ img {
+ border-radius: 100px;
+ width: 1.375rem;
+ height: 1.375rem;
+ outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
+ background: color-mix(in srgb, var(--text-color) 5%, transparent);
+ outline-offset: -1px;
+ }
+
.jenkins-badge {
position: absolute;
top: calc(16%);
From 15fc210c97eccb688b6ef037c09e2ef4a049d1c2 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 19 Jan 2025 21:56:00 +0000
Subject: [PATCH 35/96] Tidy up avatars
---
core/src/main/java/jenkins/model/navigation/UserAction.java | 2 +-
core/src/main/resources/hudson/model/User/index.jelly | 4 +---
2 files changed, 2 insertions(+), 4 deletions(-)
diff --git a/core/src/main/java/jenkins/model/navigation/UserAction.java b/core/src/main/java/jenkins/model/navigation/UserAction.java
index 87465148eedf..96f33db95220 100644
--- a/core/src/main/java/jenkins/model/navigation/UserAction.java
+++ b/core/src/main/java/jenkins/model/navigation/UserAction.java
@@ -44,7 +44,7 @@ public String getIconFileName() {
return null;
}
- return getAvatar(User.current(), "48x48");
+ return getAvatar(User.current(), "96x96");
}
@Override
diff --git a/core/src/main/resources/hudson/model/User/index.jelly b/core/src/main/resources/hudson/model/User/index.jelly
index a85c46b1a945..e42122ee8b8f 100644
--- a/core/src/main/resources/hudson/model/User/index.jelly
+++ b/core/src/main/resources/hudson/model/User/index.jelly
@@ -30,9 +30,7 @@ THE SOFTWARE.
${action.displayName}
- ${action.badge.tooltip}
- ${action.displayName}
${action.badge.tooltip}
From a30968755144f67fa0d4581074eee3bb24c7ecee Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Mon, 20 Jan 2025 11:49:01 +0000
Subject: [PATCH 36/96] Update _side-panel-tasks.scss
---
src/main/scss/components/_side-panel-tasks.scss | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/main/scss/components/_side-panel-tasks.scss b/src/main/scss/components/_side-panel-tasks.scss
index 4ce83faeb965..da3166d3d37c 100644
--- a/src/main/scss/components/_side-panel-tasks.scss
+++ b/src/main/scss/components/_side-panel-tasks.scss
@@ -34,7 +34,7 @@ $background-outset: 0.7rem;
margin-top: calc(var(--section-padding) * -0.5);
margin-left: -$background-outset;
margin-right: -$background-outset;
- margin-bottom: calc(var(--section-padding) / 2);
+ margin-bottom: 1rem;
.jenkins-search__icon {
width: 2.8rem;
From 564f05021920d853afd53fb66b7d76e66158b6c9 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Mon, 20 Jan 2025 12:08:00 +0000
Subject: [PATCH 37/96] Init
---
core/src/main/resources/hudson/model/User/index.jelly | 6 ++----
.../src/main/resources/hudson/model/User/sidepanel.jelly | 2 +-
src/main/scss/components/_app-bar.scss | 9 +++++++++
src/main/scss/components/_command-palette.scss | 7 +++++++
4 files changed, 19 insertions(+), 5 deletions(-)
diff --git a/core/src/main/resources/hudson/model/User/index.jelly b/core/src/main/resources/hudson/model/User/index.jelly
index a85c46b1a945..cbf818e9be5c 100644
--- a/core/src/main/resources/hudson/model/User/index.jelly
+++ b/core/src/main/resources/hudson/model/User/index.jelly
@@ -28,11 +28,9 @@ THE SOFTWARE.
-
+
diff --git a/core/src/main/resources/hudson/model/User/sidepanel.jelly b/core/src/main/resources/hudson/model/User/sidepanel.jelly
index f8024b0c21b8..787309d8a8e2 100644
--- a/core/src/main/resources/hudson/model/User/sidepanel.jelly
+++ b/core/src/main/resources/hudson/model/User/sidepanel.jelly
@@ -31,7 +31,7 @@ THE SOFTWARE.
-
-
diff --git a/src/main/scss/components/_app-bar.scss b/src/main/scss/components/_app-bar.scss
index 48ce77baa372..6ccc36be80f5 100644
--- a/src/main/scss/components/_app-bar.scss
+++ b/src/main/scss/components/_app-bar.scss
@@ -112,10 +112,6 @@
img {
width: 2.375rem;
height: 2.375rem;
- border-radius: 100px;
- outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
- background: color-mix(in srgb, var(--text-color) 5%, transparent);
- outline-offset: -1px;
}
}
diff --git a/src/main/scss/components/_avatar.scss b/src/main/scss/components/_avatar.scss
new file mode 100644
index 000000000000..d1aa785b8b30
--- /dev/null
+++ b/src/main/scss/components/_avatar.scss
@@ -0,0 +1,8 @@
+.jenkins-avatar {
+ &[src] {
+ border-radius: 100px;
+ outline: 1px solid color-mix(in sRGB, var(--text-color) 10%, transparent);
+ background: color-mix(in sRGB, var(--text-color) 5%, transparent);
+ outline-offset: -1px;
+ }
+}
diff --git a/src/main/scss/components/_command-palette.scss b/src/main/scss/components/_command-palette.scss
index c463c2336a98..10f71c10531b 100644
--- a/src/main/scss/components/_command-palette.scss
+++ b/src/main/scss/components/_command-palette.scss
@@ -183,8 +183,9 @@
&[src] {
border-radius: 100px;
- outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
- background: color-mix(in srgb, var(--text-color) 5%, transparent);
+ outline: 1px solid
+ color-mix(in sRGB, var(--text-color) 10%, transparent);
+ background: color-mix(in sRGB, var(--text-color) 5%, transparent);
outline-offset: -1px;
}
}
diff --git a/src/main/scss/components/_index.scss b/src/main/scss/components/_index.scss
index 821805c17c57..684c31aa0e28 100644
--- a/src/main/scss/components/_index.scss
+++ b/src/main/scss/components/_index.scss
@@ -1,5 +1,6 @@
-@use "app-bar";
@use "alert";
+@use "app-bar";
+@use "avatar";
@use "badges";
@use "breadcrumbs";
@use "buttons";
From 60e0a00c660daae2ae07f73e2c2e813001ac1544 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 23 Jan 2025 18:38:57 +0000
Subject: [PATCH 39/96] Hide behind flag
---
.../NewHeaderUserExperimentalFlag.java | 49 ++++++
.../views/ExperimentalJenkinsHeader.java | 23 +++
.../headerContent.jelly | 87 ++++++++++
.../views/JenkinsHeader/headerContent.jelly | 63 +-------
.../resources/lib/layout/breadcrumb.jelly | 52 ++++--
.../resources/lib/layout/breadcrumbBar.jelly | 19 ++-
.../resources/lib/layout/header/login.jelly | 55 ++++++-
.../resources/lib/layout/header/logo.jelly | 28 +++-
.../lib/layout/header/searchbox.jelly | 24 +++
.../main/resources/lib/layout/layout.jelly | 8 +
src/main/scss/abstracts/_theme.scss | 7 +
.../scss/components/_breadcrumbs-new.scss | 95 +++++++++++
src/main/scss/components/_breadcrumbs.scss | 147 ++++++++++-------
src/main/scss/components/_header.scss | 85 ++++++++++
src/main/scss/components/_index.scss | 2 +
src/main/scss/components/_page-header.scss | 149 ++++++++++--------
16 files changed, 674 insertions(+), 219 deletions(-)
create mode 100644 core/src/main/java/jenkins/model/experimentalflags/NewHeaderUserExperimentalFlag.java
create mode 100644 core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java
create mode 100644 core/src/main/resources/jenkins/views/ExperimentalJenkinsHeader/headerContent.jelly
create mode 100644 src/main/scss/components/_breadcrumbs-new.scss
create mode 100644 src/main/scss/components/_header.scss
diff --git a/core/src/main/java/jenkins/model/experimentalflags/NewHeaderUserExperimentalFlag.java b/core/src/main/java/jenkins/model/experimentalflags/NewHeaderUserExperimentalFlag.java
new file mode 100644
index 000000000000..ebcd2a60d9b3
--- /dev/null
+++ b/core/src/main/java/jenkins/model/experimentalflags/NewHeaderUserExperimentalFlag.java
@@ -0,0 +1,49 @@
+/*
+ * The MIT License
+ *
+ * Copyright (c) 2025, Jan Faracik
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+package jenkins.model.experimentalflags;
+
+import edu.umd.cs.findbugs.annotations.Nullable;
+import hudson.Extension;
+import org.kohsuke.accmod.Restricted;
+import org.kohsuke.accmod.restrictions.NoExternalUse;
+
+@Extension
+@Restricted(NoExternalUse.class)
+public class NewHeaderUserExperimentalFlag extends BooleanUserExperimentalFlag {
+ public NewHeaderUserExperimentalFlag() {
+ super("new-header.flag");
+ }
+
+ @Override
+ public String getDisplayName() {
+ return "New header";
+ }
+
+ @Nullable
+ @Override
+ public String getShortDescription() {
+ return "Enables a new header for Jenkins. This feature is still a work in progress, so some things might not work perfectly yet.";
+ }
+}
diff --git a/core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java b/core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java
new file mode 100644
index 000000000000..3dc1a56d40c3
--- /dev/null
+++ b/core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java
@@ -0,0 +1,23 @@
+package jenkins.views;
+
+import hudson.Extension;
+import jenkins.model.experimentalflags.UserExperimentalFlag;
+
+/**
+ * Experimental {@link Header} provided by Jenkins
+ *
+ * @see Header
+ */
+@Extension(ordinal = Integer.MIN_VALUE)
+public class ExperimentalJenkinsHeader extends FullHeader {
+
+ @Override
+ public boolean isEnabled() {
+ return true;
+ }
+
+ @Override
+ public boolean isAvailable() {
+ return UserExperimentalFlag.getFlagValueForCurrentUser("jenkins.model.experimentalflags.NewHeaderUserExperimentalFlag");
+ }
+}
diff --git a/core/src/main/resources/jenkins/views/ExperimentalJenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/ExperimentalJenkinsHeader/headerContent.jelly
new file mode 100644
index 000000000000..51ef0417bf1b
--- /dev/null
+++ b/core/src/main/resources/jenkins/views/ExperimentalJenkinsHeader/headerContent.jelly
@@ -0,0 +1,87 @@
+
+
+
+
+
+
+
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 34f2b3f79618..1f22ef506358 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,63 +1,8 @@
-
+
-
-
-
-
diff --git a/core/src/main/resources/lib/layout/breadcrumb.jelly b/core/src/main/resources/lib/layout/breadcrumb.jelly
index 5de96cb10a8e..180ddec5e1ff 100644
--- a/core/src/main/resources/lib/layout/breadcrumb.jelly
+++ b/core/src/main/resources/lib/layout/breadcrumb.jelly
@@ -42,19 +42,41 @@ THE SOFTWARE.
-
-
-
-
- ${attrs.title}
-
-
-
- ${attrs.title}
-
-
-
-
-
+
+
+
+
+
+
+ ${attrs.title}
+
+
+
+ ${attrs.title}
+
+
+
+
+
+
+
+
+
+
+
+ ${attrs.title}
+
+
+
+ ${attrs.title}
+
+
+
+
+
+
+
diff --git a/core/src/main/resources/lib/layout/breadcrumbBar.jelly b/core/src/main/resources/lib/layout/breadcrumbBar.jelly
index 2707f3c30a00..a77723e50f98 100644
--- a/core/src/main/resources/lib/layout/breadcrumbBar.jelly
+++ b/core/src/main/resources/lib/layout/breadcrumbBar.jelly
@@ -24,7 +24,7 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
-->
-
+
-
-
-
-
+
+
-
+
diff --git a/core/src/main/resources/lib/layout/header/login.jelly b/core/src/main/resources/lib/layout/header/login.jelly
index 04aebf0306b8..edd929d65a95 100644
--- a/core/src/main/resources/lib/layout/header/login.jelly
+++ b/core/src/main/resources/lib/layout/header/login.jelly
@@ -1,9 +1,50 @@
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/core/src/main/resources/lib/layout/header/logo.jelly b/core/src/main/resources/lib/layout/header/logo.jelly
index 8951a7451522..b743be666895 100644
--- a/core/src/main/resources/lib/layout/header/logo.jelly
+++ b/core/src/main/resources/lib/layout/header/logo.jelly
@@ -1,5 +1,27 @@
-
-
- Jenkins
+
+
+
+
+
+
+ Jenkins
+
+
diff --git a/core/src/main/resources/lib/layout/header/searchbox.jelly b/core/src/main/resources/lib/layout/header/searchbox.jelly
index 0e9f6e62570f..033dc2ab0407 100644
--- a/core/src/main/resources/lib/layout/header/searchbox.jelly
+++ b/core/src/main/resources/lib/layout/header/searchbox.jelly
@@ -1,3 +1,27 @@
+
diff --git a/core/src/main/resources/lib/layout/layout.jelly b/core/src/main/resources/lib/layout/layout.jelly
index 8ed4d311b922..0fefc2df532d 100644
--- a/core/src/main/resources/lib/layout/layout.jelly
+++ b/core/src/main/resources/lib/layout/layout.jelly
@@ -169,6 +169,14 @@ THE SOFTWARE.
searchPlaceholder="${%search}"
searchHelpUrl="${%searchBox.url}"
logout="${%logout}"/>
+
+
+
+
+
-
+
Jenkins
From 1becb2641dea99249b76c64f33130950d0c73a62 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 26 Jan 2025 12:44:13 +0000
Subject: [PATCH 44/96] Accessibility
---
src/main/js/widgets/add/addform.scss | 3 +-
src/main/scss/abstracts/_mixins.scss | 25 ++-
src/main/scss/abstracts/_theme.scss | 86 +++++++++--
src/main/scss/base/_style.scss | 17 +--
src/main/scss/components/_alert.scss | 8 +-
src/main/scss/components/_app-bar.scss | 2 +-
.../scss/components/_breadcrumbs-new.scss | 2 +-
src/main/scss/components/_breadcrumbs.scss | 3 +-
src/main/scss/components/_buttons.scss | 143 ++++--------------
src/main/scss/components/_cards.scss | 16 +-
.../scss/components/_command-palette.scss | 9 +-
src/main/scss/components/_dropdowns.scss | 39 ++---
src/main/scss/components/_notice.scss | 1 +
src/main/scss/components/_notifications.scss | 4 +-
.../components/_row-selection-controller.scss | 12 +-
src/main/scss/components/_section.scss | 5 +-
.../scss/components/_side-panel-tasks.scss | 18 +--
src/main/scss/components/_spinner.scss | 3 +-
src/main/scss/components/_table.scss | 60 +++-----
src/main/scss/components/_tabs.scss | 63 ++++----
src/main/scss/components/_tooltips.scss | 6 +-
src/main/scss/form/_checkbox.scss | 22 +--
src/main/scss/form/_codemirror.scss | 5 +-
src/main/scss/form/_file-upload.scss | 8 +-
src/main/scss/form/_input.scss | 23 ++-
src/main/scss/form/_layout.scss | 52 +------
src/main/scss/form/_radio.scss | 9 +-
src/main/scss/form/_search-bar.scss | 2 +-
src/main/scss/form/_select.scss | 22 ++-
src/main/scss/form/_textarea.scss | 3 +-
src/main/scss/form/_toggle-switch.scss | 22 ++-
src/main/scss/pages/_about.scss | 17 ++-
src/main/scss/pages/_dashboard.scss | 2 +-
src/main/scss/pages/_job.scss | 2 +-
34 files changed, 348 insertions(+), 366 deletions(-)
diff --git a/src/main/js/widgets/add/addform.scss b/src/main/js/widgets/add/addform.scss
index 6270004b00f9..140657ec88fe 100644
--- a/src/main/js/widgets/add/addform.scss
+++ b/src/main/js/widgets/add/addform.scss
@@ -183,13 +183,12 @@
}
li {
- @include mixins.item;
+ @include mixins.item($border: false);
-webkit-touch-callout: none;
user-select: none;
padding: 0.75rem 1rem;
min-height: 68px;
- cursor: pointer;
display: grid;
grid-template-columns: auto 1fr;
gap: 0.25rem 1rem;
diff --git a/src/main/scss/abstracts/_mixins.scss b/src/main/scss/abstracts/_mixins.scss
index 10448172bf7f..c45bb66133aa 100644
--- a/src/main/scss/abstracts/_mixins.scss
+++ b/src/main/scss/abstracts/_mixins.scss
@@ -56,11 +56,17 @@
}
}
-@mixin item {
+@mixin item($border: true) {
position: relative;
+ appearance: none;
z-index: 0;
text-decoration: none !important;
- border-radius: 0.66rem;
+ font-weight: normal;
+ border-radius: var(--form-input-border-radius);
+ cursor: pointer;
+ background: transparent;
+ outline: none;
+ border: none;
&::before,
&::after {
@@ -74,11 +80,12 @@
}
&::before {
- background-color: transparent;
+ background-color: var(--item-background);
+ border: var(--jenkins-border--subtle);
}
&::after {
- box-shadow: 0 0 0 0.66rem transparent;
+ box-shadow: 0 0 0 0.5rem transparent;
}
&:focus-visible {
@@ -104,7 +111,7 @@
}
&::after {
- box-shadow: 0 0 0 0.33rem var(--item-box-shadow--focus);
+ box-shadow: 0 0 0 0.25rem var(--item-box-shadow--focus);
}
}
@@ -115,4 +122,12 @@
}
}
}
+
+ @if $border == false {
+ &:not(:hover, &:active, &:focus) {
+ &::before {
+ border-color: transparent;
+ }
+ }
+ }
}
diff --git a/src/main/scss/abstracts/_theme.scss b/src/main/scss/abstracts/_theme.scss
index 458d01244161..b4a8cf3496e5 100644
--- a/src/main/scss/abstracts/_theme.scss
+++ b/src/main/scss/abstracts/_theme.scss
@@ -83,6 +83,13 @@ $semantics: (
from var(--text-color) 96.8% 0.005 h / 0.8
);
+ // App bar
+ --bottom-app-bar-shadow: color-mix(
+ in sRGB,
+ var(--text-color-secondary) 7.5%,
+ transparent
+ );
+
// Alert call outs
--alert-success-text-color: var(--success-color);
--alert-success-bg-color: color-mix(
@@ -128,8 +135,41 @@ $semantics: (
// Typography
--text-color-secondary: var(--secondary);
+ // Borders
+ --jenkins-border-width: 1.5px;
+ --jenkins-border-color: color-mix(
+ in sRGB,
+ var(--text-color-secondary) 12%,
+ var(--card-background)
+ );
+ --jenkins-border-color--subtle: color-mix(
+ in sRGB,
+ currentColor 1.5%,
+ transparent
+ );
+
+ /* This is a harsher border - for dividers, content blocks and more */
+ --jenkins-border: var(--jenkins-border-width) solid
+ var(--jenkins-border-color);
+
+ /* This is a subtle border - for increasing contrast on elements, such as buttons, menu and more */
+ --jenkins-border--subtle: var(--jenkins-border-width) solid
+ var(--jenkins-border-color--subtle);
+ --jenkins-border--subtle-shadow: 0 0 0 1.5px
+ var(--jenkins-border-color--subtle);
+
+ @media (resolution <= 1x) {
+ --jenkins-border-width: 2px;
+ }
+
+ @media (prefers-contrast: more) {
+ --focus-input-border: var(--text-color);
+ --jenkins-border-color: var(--text-color);
+ --jenkins-border-color--subtle: var(--text-color);
+ }
+
// Table
- --table-background: oklch(from var(--text-color-secondary) l c h / 0.1);
+ --table-background: oklch(from var(--text-color-secondary) l c h / 0.075);
--table-header-foreground: var(--text-color);
--table-body-background: var(--background);
--table-body-foreground: var(--text-color);
@@ -161,7 +201,8 @@ $semantics: (
// Command Palette
--command-palette-results-backdrop-filter: contrast(0.7) brightness(1.5)
saturate(1.4) blur(20px);
- --command-palette-inset-shadow: inset 0 0 2px 2px rgb(255 255 255 / 0.1);
+ --command-palette-inset-shadow: inset 0 0 2px 2px rgb(255 255 255 / 0.1),
+ var(--jenkins-border--subtle-shadow);
::backdrop {
--command-palette-backdrop-background: radial-gradient(
@@ -174,21 +215,23 @@ $semantics: (
// Tooltips
--tooltip-backdrop-filter: saturate(2) blur(20px);
--tooltip-color: var(--text-color);
- --tooltip-box-shadow: 0 0 8px 2px rgb(0 0 30 / 0.05),
- 0 0 1px 1px rgb(0 0 20 / 0.025), 0 10px 20px rgb(0 0 20 / 0.15);
+ --tooltip-box-shadow: 0 0 8px 2px rgb(0 0 50 / 0.05),
+ var(--jenkins-border--subtle-shadow), 0 10px 50px rgb(0 0 20 / 0.1);
// Dropdowns
--dropdown-backdrop-filter: saturate(1.5) blur(20px);
- --dropdown-box-shadow: 0 10px 30px rgb(0 0 20 / 0.2),
- 0 2px 10px rgb(0 0 20 / 0.05), inset 0 -1px 2px rgb(255 255 255 / 0.025);
+ --dropdown-box-shadow: var(--jenkins-border--subtle-shadow),
+ 0 10px 30px rgb(0 0 20 / 0.1), 0 2px 10px rgb(0 0 20 / 0.05),
+ inset 0 -1px 2px rgb(255 255 255 / 0.025);
// Dialogs
::backdrop {
--dialog-backdrop-background: hsl(240 10% 20% / 0.8);
}
- --dialog-box-shadow: 0 10px 40px rgb(0 0 20 / 0.15),
- 0 2px 15px rgb(0 0 20 / 0.05), inset 0 0 2px 2px rgb(255 255 255 / 0.025);
+ --dialog-box-shadow: var(--jenkins-border--subtle-shadow),
+ 0 10px 40px rgb(0 0 20 / 0.15), 0 2px 15px rgb(0 0 20 / 0.05),
+ inset 0 0 2px 2px rgb(255 255 255 / 0.025);
// Dark link
--link-dark-color: var(--text-color);
@@ -222,12 +265,20 @@ $semantics: (
--card-border-color--active: oklch(
from var(--text-color-secondary) l c h / 0.5
);
- --card-border-width: 2px;
+ --card-border-width: var(--jenkins-border-width);
+
+ @media (prefers-contrast: more) {
+ --card-border-color: var(--text-color);
+ }
// Tab bar
--tabs-background: oklch(from var(--text-color-secondary) l c h / 0.1);
--tabs-item-background: transparent;
- --tabs-item-foreground: var(--text-color);
+ --tabs-item-foreground: color-mix(
+ in sRGB,
+ var(--text-color-secondary),
+ var(--text-color)
+ );
--tabs-item-background--hover: rgb(0 0 0 / 0.05);
--tabs-item-foreground--hover: var(--text-color);
--tabs-item-background--active: rgb(0 0 0 / 0.1);
@@ -271,14 +322,21 @@ $semantics: (
}
--form-label-font-weight: var(--font-bold-weight);
- --form-input-padding: 0.625rem;
+ --form-input-padding: 0.5rem 0.625rem;
--form-input-border-radius: 0.625rem;
- --form-input-glow: 0 0 0 10px transparent;
- --form-input-glow--focus: 0 0 0 5px var(--focus-input-glow);
- --pre-background: rgb(0 0 0 / 0.05);
+ --form-input-glow: 0 0 0 0.5rem transparent;
+ --form-input-glow--focus: 0 0 0 0.25rem var(--focus-input-glow);
+ --pre-background: var(--button-background);
--pre-color: var(--text-color);
--selection-color: oklch(from var(--accent-color) l c h / 0.2);
+ @media (prefers-contrast: more) {
+ --input-border: var(--text-color) !important;
+ --input-border-hover: var(--text-color) !important;
+ --form-input-glow--focus: 0 0 0 4px
+ color-mix(in sRGB, var(--text-color), transparent);
+ }
+
// Animations
--standard-transition: 0.3s ease;
--elastic-transition: 0.3s cubic-bezier(0, 0.68, 0.5, 1.5);
diff --git a/src/main/scss/base/_style.scss b/src/main/scss/base/_style.scss
index d0a8e4223701..001a44c73c98 100644
--- a/src/main/scss/base/_style.scss
+++ b/src/main/scss/base/_style.scss
@@ -152,6 +152,7 @@ pre {
margin: 0 0 var(--section-padding);
padding: 0.8rem 1rem;
border-radius: var(--form-input-border-radius);
+ border: var(--jenkins-border--subtle);
background-color: var(--pre-background);
color: var(--pre-color);
font-family: var(--font-family-mono);
@@ -290,21 +291,13 @@ pre.console {
padding: 1rem;
margin: 1rem 0;
word-break: break-word;
- border-radius: 6px;
+ border-radius: var(--form-input-border-radius);
+ background-color: var(--button-background);
+ border: var(--jenkins-border--subtle);
z-index: 0;
--section-padding: 0.8rem;
- &::before {
- content: "";
- position: absolute;
- inset: 0;
- background: var(--text-color);
- opacity: 0.05;
- z-index: -1;
- border-radius: inherit;
- }
-
p:first-of-type {
margin-top: 0;
}
@@ -536,7 +529,7 @@ table.fingerprint-in-build td {
top: 0;
left: 10px;
bottom: 0;
- width: 2px;
+ width: var(--jenkins-border-width);
background: var(--input-border);
border-radius: 2px;
transition: var(--standard-transition);
diff --git a/src/main/scss/components/_alert.scss b/src/main/scss/components/_alert.scss
index 7ae9bbedd5e5..7380a4321777 100644
--- a/src/main/scss/components/_alert.scss
+++ b/src/main/scss/components/_alert.scss
@@ -2,8 +2,8 @@
.jenkins-alert {
font-size: var(--font-size-sm);
padding: 15px;
- margin-bottom: 20px;
- border: 1px solid transparent;
+ margin-bottom: var(--section-padding);
+ border: var(--jenkins-border-width) solid transparent;
border-radius: var(--form-input-border-radius);
strong {
@@ -52,4 +52,8 @@
color: var(--alert-danger-text-color);
}
}
+
+ @media (prefers-contrast: more) {
+ border-color: var(--text-color);
+ }
}
diff --git a/src/main/scss/components/_app-bar.scss b/src/main/scss/components/_app-bar.scss
index d259770e022d..2c7d2f6fb168 100644
--- a/src/main/scss/components/_app-bar.scss
+++ b/src/main/scss/components/_app-bar.scss
@@ -124,7 +124,7 @@
top: -30px;
left: 0;
right: 0;
- background: linear-gradient(transparent, rgba(#556, 0.075) 110%);
+ background: linear-gradient(transparent, var(--bottom-app-bar-shadow) 110%);
max-width: 100%;
height: 30px;
opacity: 0;
diff --git a/src/main/scss/components/_breadcrumbs-new.scss b/src/main/scss/components/_breadcrumbs-new.scss
index 0fa6bdd0cf94..18ea2ac26f3b 100644
--- a/src/main/scss/components/_breadcrumbs-new.scss
+++ b/src/main/scss/components/_breadcrumbs-new.scss
@@ -46,7 +46,7 @@
}
& > a {
- @include mixins.item;
+ @include mixins.item($border: false);
--item-background--hover: transparent;
--item-background--active: transparent;
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index fe380b831e8d..79260cbe2efb 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -31,7 +31,7 @@
padding: 0.2rem 0.4rem;
& > a {
- @include mixins.item;
+ @include mixins.item($border: false);
display: inline-flex;
align-items: center;
@@ -41,7 +41,6 @@
margin: 0;
padding: 0;
color: var(--text-color);
- text-decoration: none;
margin-right: 0 !important;
transition: var(--standard-transition);
diff --git a/src/main/scss/components/_buttons.scss b/src/main/scss/components/_buttons.scss
index 0ffc8e65a64e..113933bfd875 100644
--- a/src/main/scss/components/_buttons.scss
+++ b/src/main/scss/components/_buttons.scss
@@ -1,34 +1,24 @@
@use "../abstracts/mixins";
.jenkins-button {
+ --item-background: var(--button-background);
--item-background--hover: var(--button-background--hover);
--item-background--active: var(--button-background--active);
--item-box-shadow--focus: var(--button-box-shadow--focus);
@include mixins.item;
- appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
- border: none;
- outline: none;
margin: 0;
- padding: 0.5rem 0.9rem;
+ padding: 0.5rem 1rem;
font-size: var(--font-size-sm);
- font-weight: normal;
- text-decoration: none !important;
- background: transparent;
color: var(--text-color) !important;
- cursor: pointer;
- min-height: 2.25rem;
+ min-height: 2.375rem;
white-space: nowrap;
gap: 1ch;
- &::before {
- background: var(--button-background);
- }
-
svg {
width: 1.125rem;
height: 1.125rem;
@@ -42,121 +32,44 @@
}
.jenkins-button--primary {
- color: var(--button-color--primary) !important;
-
- &::before {
- background: var(--accent-color) !important;
- }
-
- &::after {
- box-shadow: 0 0 0 0.66rem var(--accent-color);
- opacity: 0;
- }
-
- &:not(:disabled) {
- &:hover {
- &::before {
- opacity: 0.9;
- }
- }
-
- &:active,
- &:focus-visible {
- &::before {
- opacity: 0.8;
- }
+ --button-background: oklch(from var(--accent-color) l c h);
+ --button-background--hover: oklch(from var(--accent-color) l c h / 0.9);
+ --button-background--active: oklch(from var(--accent-color) l c h / 0.8);
+ --button-box-shadow--focus: oklch(from var(--accent-color) l c h / 0.4);
- &::after {
- box-shadow: 0 0 0 0.33rem var(--accent-color);
- opacity: 0.2;
- }
- }
- }
-}
-
-.jenkins-button--tertiary {
- &::before {
- background: transparent;
- }
+ color: var(--button-color--primary) !important;
}
// Support for custom colors
// Modifier classes must include 'color' in name to work
.jenkins-button[class*="color"] {
- background: transparent;
- color: var(--color) !important;
-
- &::before {
- background: currentColor !important;
- opacity: 0.1;
- }
-
- &::after {
- box-shadow: 0 0 0 0.66rem currentColor;
- opacity: 0;
- }
-
- &:not(:disabled) {
- &:hover {
- &::before {
- opacity: 0.15;
- }
- }
-
- &:active {
- &::before {
- opacity: 0.2;
- }
+ --button-background: oklch(from currentColor l c h / 0.1);
+ --button-background--hover: oklch(from currentColor l c h / 0.15);
+ --button-background--active: oklch(from currentColor l c h / 0.25);
+ --button-box-shadow--focus: oklch(from currentColor l c h / 0.125);
- &::after {
- box-shadow: 0 0 0 0.33rem currentColor;
- opacity: 0.1;
- }
- }
- }
+ color: var(--color) !important;
}
.jenkins-button--primary[class*="color"] {
- background: transparent;
- color: var(--background) !important;
-
- &::before {
- background: var(--color) !important;
- opacity: 1;
- }
-
- &::after {
- box-shadow: 0 0 0 0.66rem var(--color);
- opacity: 0;
- }
+ --button-background: oklch(from var(--color) l c h);
+ --button-background--hover: oklch(from var(--color) l c h / 0.9);
+ --button-background--active: oklch(from var(--color) l c h / 0.8);
+ --button-box-shadow--focus: oklch(from var(--color) l c h / 0.4);
- &:not(:disabled) {
- &:hover {
- &::before {
- opacity: 0.9;
- }
- }
+ color: var(--background) !important;
+}
- &:active,
- &:focus-visible {
- &::before {
- opacity: 0.8;
- }
+.jenkins-button--tertiary {
+ --button-background: transparent !important;
- &::after {
- box-shadow: 0 0 0 0.33rem var(--color);
- opacity: 0.3;
- }
+ &:not(:hover, &:active, &:focus) {
+ &::before {
+ border-color: transparent;
}
}
}
-.jenkins-button--tertiary[class*="color"] {
- &::before {
- opacity: 0;
- }
-}
-
// Additional button related classes
.jenkins-buttons-row {
display: flex;
@@ -249,7 +162,7 @@
in sRGB,
var(--success-color) 10%,
transparent
- );
+ ) !important;
--button-background--hover: var(--button-background);
--button-background--active: var(--button-background);
@@ -352,13 +265,13 @@ $jenkins-split-button-border-radius: 0.2rem;
}
.stop-button-link {
+ --item-background: color-mix(in sRGB, var(--red) 15%, transparent);
--item-background--hover: color-mix(in sRGB, var(--red) 20%, transparent);
--item-background--active: color-mix(in sRGB, var(--red) 25%, transparent);
--item-box-shadow--focus: transparent;
@include mixins.item;
- position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
@@ -366,10 +279,6 @@ $jenkins-split-button-border-radius: 0.2rem;
height: 1rem;
border-radius: 0.25rem;
- &::before {
- background: color-mix(in sRGB, var(--red) 15%, transparent);
- }
-
svg {
width: 87.5%;
height: 87.5%;
diff --git a/src/main/scss/components/_cards.scss b/src/main/scss/components/_cards.scss
index 9a73b4f5bbec..4de565b1c2a8 100644
--- a/src/main/scss/components/_cards.scss
+++ b/src/main/scss/components/_cards.scss
@@ -27,22 +27,29 @@ $card-padding: 1rem;
}
&:not(:hover) {
- .jenkins-card__unveil {
- color: var(--text-color-secondary) !important;
+ .jenkins-card__unveil,
+ .jenkins-card__reveal {
+ color: var(--text-color-secondary);
}
}
- &:hover {
+ @media (prefers-contrast: more) {
+ .jenkins-card__unveil,
.jenkins-card__reveal {
color: var(--text-color) !important;
}
}
+ &:hover {
+ .jenkins-card__reveal {
+ color: var(--text-color);
+ }
+ }
+
&__content {
display: flex;
flex-direction: column;
padding: 0 $card-padding $card-padding;
- color: var(--text-color-secondary);
&:empty {
display: none;
@@ -69,7 +76,6 @@ $card-padding: 1rem;
width: 26px;
height: 26px;
border-radius: 0.33rem;
- color: var(--text-color-secondary) !important;
transition:
scale var(--standard-transition),
opacity var(--standard-transition);
diff --git a/src/main/scss/components/_command-palette.scss b/src/main/scss/components/_command-palette.scss
index bc3aca71cd7b..1d487915e9f4 100644
--- a/src/main/scss/components/_command-palette.scss
+++ b/src/main/scss/components/_command-palette.scss
@@ -86,6 +86,7 @@
max-width: unset;
input {
+ padding: 0 0.5rem 0 45px;
background: transparent !important;
--input-border: transparent;
@@ -136,7 +137,7 @@
}
&__item {
- @include mixins.item;
+ @include mixins.item($border: false);
--item-background--hover: color-mix(
in sRGB,
@@ -152,19 +153,15 @@
display: flex;
align-items: center;
justify-content: flex-start;
- background: transparent;
padding: 0.75rem;
border-radius: 0.5rem;
- cursor: pointer;
color: var(--text-color) !important;
transition: var(--standard-transition);
- box-shadow: 0 0 0 10px transparent;
- border: none;
- outline: none;
&--hover {
&::before {
background-color: var(--item-background--hover);
+ border: var(--jenkins-border--subtle) !important;
}
}
diff --git a/src/main/scss/components/_dropdowns.scss b/src/main/scss/components/_dropdowns.scss
index f619556f7a9d..e182631d2a6f 100644
--- a/src/main/scss/components/_dropdowns.scss
+++ b/src/main/scss/components/_dropdowns.scss
@@ -1,9 +1,10 @@
@use "../abstracts/mixins";
-$dropdown-padding: 0.4rem;
+$dropdown-border-radius: 1rem;
+$dropdown-padding: 0.375rem;
.tippy-box[data-theme~="dropdown"] {
- border-radius: 15px;
+ border-radius: $dropdown-border-radius;
box-shadow: var(--dropdown-box-shadow);
outline: none !important;
background: color-mix(in sRGB, var(--background) 85%, transparent);
@@ -76,22 +77,15 @@ $dropdown-padding: 0.4rem;
&__separator {
position: relative;
- height: 0.125rem;
+ height: var(--jenkins-border-width);
margin: $dropdown-padding calc($dropdown-padding * -1);
border: none;
-
- &::before {
- content: "";
- position: absolute;
- inset: 0;
- background-color: var(--text-color-secondary);
- opacity: 0.1;
- }
+ background-color: var(--jenkins-border-color);
}
&__heading {
color: var(--text-color-secondary) !important;
- margin: $dropdown-padding 0.55rem;
+ margin: $dropdown-padding 0.65rem;
font-size: 0.8125rem;
font-weight: var(--font-bold-weight);
opacity: 0.8;
@@ -123,7 +117,7 @@ $dropdown-padding: 0.4rem;
--item-background--active: var(--button-background--active);
--item-box-shadow--focus: var(--button-box-shadow--focus);
- @include mixins.item;
+ @include mixins.item($border: false);
appearance: none;
display: inline-flex;
@@ -138,7 +132,7 @@ $dropdown-padding: 0.4rem;
text-decoration: none !important;
background: transparent;
color: var(--text-color) !important;
- border-radius: 0.66rem;
+ border-radius: calc($dropdown-border-radius - $dropdown-padding);
cursor: pointer;
min-height: 36px;
white-space: nowrap;
@@ -230,14 +224,25 @@ $dropdown-padding: 0.4rem;
&:hover {
.jenkins-dropdown__item--selected {
- background: transparent;
+ &::before {
+ opacity: 0;
+ }
}
}
}
.jenkins-dropdown__item--selected {
- background: var(--item-background--hover);
- animation: pulse 1s ease-in-out forwards;
+ &::before {
+ background: var(--item-background--hover);
+ border: var(--jenkins-border--subtle) !important;
+ animation: pulse 1s ease-in-out forwards;
+ }
+
+ &:hover {
+ &::before {
+ opacity: 1 !important;
+ }
+ }
@keyframes pulse {
50% {
diff --git a/src/main/scss/components/_notice.scss b/src/main/scss/components/_notice.scss
index 812e933f6c10..aa58c1cb2a37 100644
--- a/src/main/scss/components/_notice.scss
+++ b/src/main/scss/components/_notice.scss
@@ -6,6 +6,7 @@
gap: 1rem;
min-height: 15rem;
background: var(--button-background);
+ border: var(--jenkins-border--subtle);
border-radius: var(--form-input-border-radius);
font-size: var(--font-size-base);
margin-bottom: var(--section-padding);
diff --git a/src/main/scss/components/_notifications.scss b/src/main/scss/components/_notifications.scss
index 1f474b106330..8e8ea554e2ec 100644
--- a/src/main/scss/components/_notifications.scss
+++ b/src/main/scss/components/_notifications.scss
@@ -36,8 +36,8 @@
inset: 0;
border-radius: inherit;
z-index: -1;
- background: var(--background);
- opacity: 0.3;
+ background: oklch(from var(--background) l c h / 0.3);
+ border: var(--jenkins-border--subtle);
}
@supports not (backdrop-filter: blur(15px)) {
diff --git a/src/main/scss/components/_row-selection-controller.scss b/src/main/scss/components/_row-selection-controller.scss
index 1eee5ab1b630..cd984bc29e7d 100644
--- a/src/main/scss/components/_row-selection-controller.scss
+++ b/src/main/scss/components/_row-selection-controller.scss
@@ -12,7 +12,7 @@
outline: none;
border: none;
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 0.125rem var(--input-border);
border-radius: 6px;
transition: var(--standard-transition);
@@ -21,14 +21,14 @@
&:hover {
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 0.3125rem var(--input-border-hover);
}
&:active,
&:focus {
box-shadow:
- 0 0 0 5px var(--focus-input-glow),
+ 0 0 0 4px var(--focus-input-glow),
inset 0 0 0 0.3125rem var(--focus-input-border);
}
@@ -61,19 +61,19 @@
&--all {
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 0.6875rem var(--focus-input-border);
&:hover {
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 1.375rem var(--focus-input-border);
}
&:active,
&:focus {
box-shadow:
- 0 0 0 5px var(--focus-input-glow),
+ 0 0 0 4px var(--focus-input-glow),
inset 0 0 0 1.375rem var(--focus-input-border);
}
diff --git a/src/main/scss/components/_section.scss b/src/main/scss/components/_section.scss
index 160655ed176a..410fafb18c01 100644
--- a/src/main/scss/components/_section.scss
+++ b/src/main/scss/components/_section.scss
@@ -1,7 +1,7 @@
@use "../abstracts/mixins";
.jenkins-section {
- border-top: 2px solid var(--panel-border-color);
+ border-top: var(--jenkins-border);
padding: var(--section-padding) 0 0 0;
max-width: 1800px;
@@ -55,7 +55,7 @@
}
.jenkins-section__item a {
- @include mixins.item;
+ @include mixins.item($border: false);
display: flex;
text-decoration: none;
@@ -90,6 +90,7 @@
border-radius: 100%;
pointer-events: none;
background: var(--item-background--active);
+ border: var(--jenkins-border--subtle);
}
img,
diff --git a/src/main/scss/components/_side-panel-tasks.scss b/src/main/scss/components/_side-panel-tasks.scss
index 46e562ee50c7..94d270980b1e 100644
--- a/src/main/scss/components/_side-panel-tasks.scss
+++ b/src/main/scss/components/_side-panel-tasks.scss
@@ -57,17 +57,11 @@ $background-outset: 0.7rem;
display: flex;
align-items: center;
justify-content: flex-start;
- padding: 0.55rem $background-outset;
+ padding: 0.5rem $background-outset;
gap: 0.65rem;
width: 100%;
- cursor: pointer;
- font-weight: normal !important;
font-size: var(--font-size-sm);
- color: var(--text-color) !important;
- background: transparent;
- outline: none;
- border: none;
- text-decoration: none;
+ color: var(--text-color);
margin: 0;
transition: opacity var(--standard-transition);
@@ -96,7 +90,7 @@ $background-outset: 0.7rem;
}
&--active {
- font-weight: 500 !important;
+ font-weight: 450;
cursor: default;
svg * {
@@ -111,4 +105,10 @@ $background-outset: 0.7rem;
box-shadow: none !important;
}
}
+
+ &:not(:hover, &:active, &:focus, &--active) {
+ &::before {
+ border-color: transparent;
+ }
+ }
}
diff --git a/src/main/scss/components/_spinner.scss b/src/main/scss/components/_spinner.scss
index 3454dc8d48ec..9654c18ce30f 100644
--- a/src/main/scss/components/_spinner.scss
+++ b/src/main/scss/components/_spinner.scss
@@ -19,7 +19,8 @@
&::before {
position: relative;
margin-right: 0.5lh;
- opacity: 0.2;
+ opacity: 0.3;
+ border-color: var(--text-color-secondary);
}
&::after {
diff --git a/src/main/scss/components/_table.scss b/src/main/scss/components/_table.scss
index 00ef3b3656bb..a860eeab7576 100644
--- a/src/main/scss/components/_table.scss
+++ b/src/main/scss/components/_table.scss
@@ -6,10 +6,12 @@
position: relative;
width: 100%;
background: var(--table-background);
- border-radius: calc(var(--table-border-radius) + 4px);
- border: 4px solid var(--table-background);
- border-bottom-width: 2px;
- border-spacing: 0 2px;
+ border-radius: calc(
+ var(--table-border-radius) + (var(--card-border-width) * 2)
+ );
+ border: calc(var(--card-border-width) * 2) solid var(--table-background);
+ border-bottom-width: var(--card-border-width);
+ border-spacing: 0 var(--card-border-width);
background-clip: padding-box;
margin-bottom: var(--section-padding);
@@ -18,8 +20,8 @@
&::before {
content: "";
position: absolute;
- inset: -4px -4px -2px;
- border: var(--card-border-width) solid var(--table-border-color);
+ inset: -3px -3px -2px;
+ border: var(--jenkins-border--subtle);
border-radius: inherit;
pointer-events: none;
}
@@ -38,8 +40,8 @@
padding-top: calc(var(--table-padding) * 0.9);
padding-bottom: calc((var(--table-padding) * 0.9) + 2px);
padding-left: 1.6rem;
- font-weight: var(--font-bold-weight);
font-size: var(--font-size-sm);
+ font-weight: var(--font-bold-weight);
&[align="center"] {
text-align: center;
@@ -257,7 +259,7 @@
&__button,
.sortheader,
&__link {
- @include mixins.item;
+ @include mixins.item($border: false);
align-items: center;
justify-content: center;
@@ -283,39 +285,23 @@
}
&__badge {
- margin-left: 1rem !important;
+ @include mixins.item;
- &::before {
- inset: -5px -8px;
- border-radius: 13px;
- background: currentColor;
- opacity: 0.05;
- }
+ --item-background: color-mix(in sRGB, currentColor 5%, transparent);
+ --item-background--hover: color-mix(in sRGB, currentColor 10%, transparent);
+ --item-background--active: color-mix(
+ in sRGB,
+ currentColor 15%,
+ transparent
+ );
+ --item-box-shadow--focus: color-mix(in sRGB, currentColor 5%, transparent);
+
+ margin-left: 1rem !important;
+ border-radius: 13px;
+ &::before,
&::after {
inset: -5px -8px;
- box-shadow: 0 0 0 10px currentColor;
- opacity: 0;
- }
-
- &:hover {
- &::before {
- background: currentColor;
- border-radius: 6px;
- }
- }
-
- &:active,
- &:focus {
- &::before {
- background: currentColor;
- border-radius: 6px;
- }
-
- &::after {
- box-shadow: 0 0 0 5px currentColor;
- opacity: 0.025;
- }
}
}
}
diff --git a/src/main/scss/components/_tabs.scss b/src/main/scss/components/_tabs.scss
index 3fc440d3dc6e..b7ac90c23789 100644
--- a/src/main/scss/components/_tabs.scss
+++ b/src/main/scss/components/_tabs.scss
@@ -1,3 +1,7 @@
+@use "../abstracts/mixins";
+
+$border-radius: 100px;
+
.tabBarFrame {
position: relative;
}
@@ -7,8 +11,8 @@
display: inline-flex;
align-items: center;
flex-wrap: wrap;
- background: var(--tabs-background);
- border-radius: var(--tabs-border-radius);
+ background: var(--button-background);
+ border-radius: $border-radius;
padding: 2px;
margin-bottom: var(--section-padding);
@@ -16,7 +20,7 @@
content: "";
position: absolute;
inset: 0;
- border: var(--card-border-width) solid var(--tabs-border-color);
+ border: var(--jenkins-border--subtle);
border-radius: inherit;
pointer-events: none;
}
@@ -27,38 +31,28 @@
}
.tabBar .tab a {
- position: relative;
+ @include mixins.item($border: false);
+
display: flex;
align-items: center;
justify-content: center;
- min-width: 3rem;
- text-decoration: none;
- margin: 2px;
- padding: 0.4rem 1.2rem;
- border-radius: 100px;
- background: var(--tabs-item-background);
+ min-height: 36px;
+ padding: 0 1.2rem;
+ border-radius: $border-radius;
color: var(--tabs-item-foreground);
- font-weight: var(--font-bold-weight);
+ font-weight: normal;
font-size: var(--font-size-sm);
- transition: var(--standard-transition);
- cursor: pointer;
+ min-width: 3.75rem;
- &:hover {
- background: var(--tabs-item-background--hover);
- color: var(--tabs-item-foreground--hover);
- }
-
- &:active,
- &:focus {
- outline: none;
- background: var(--tabs-item-background--active);
- color: var(--tabs-item-foreground--active);
+ &::before,
+ &::after {
+ inset: 2px;
}
}
.tabBar .tab .addTab svg {
- width: 1.25rem;
- height: 1.25rem;
+ width: 1.125rem;
+ height: 1.125rem;
}
.tabBar .tab [type="radio"] {
@@ -66,10 +60,25 @@
}
.tabBar .tab.active a {
- background: var(--tabs-item-background--selected);
- color: var(--tabs-item-foreground--selected);
z-index: 2;
cursor: default;
+ font-weight: 450;
+ color: var(--tabs-item-foreground--active);
+
+ &::before {
+ background-clip: padding-box;
+ background-color: var(--tabs-item-background--selected) !important;
+ border: var(--jenkins-border--subtle) !important;
+ }
+
+ &::after {
+ display: none;
+ }
+
+ &::before,
+ &::after {
+ inset: 0;
+ }
}
.jenkins-tab-pane__title {
diff --git a/src/main/scss/components/_tooltips.scss b/src/main/scss/components/_tooltips.scss
index dabd16e1ef0c..90570a7ce301 100644
--- a/src/main/scss/components/_tooltips.scss
+++ b/src/main/scss/components/_tooltips.scss
@@ -36,7 +36,7 @@
position: absolute;
inset: 0;
border-radius: 0.375rem;
- border: 0.1rem solid var(--text-color-secondary);
+ border: var(--jenkins-border-width) solid var(--text-color-secondary);
opacity: 0.3;
mask-image: linear-gradient(
-45deg,
@@ -101,8 +101,8 @@
position: absolute;
inset: 0;
border-radius: 0.375rem;
- border: 0.1rem solid var(--text-color-secondary);
- opacity: 0.3;
+ border: var(--jenkins-border-width) solid var(--text-color-secondary);
+ opacity: 0.2;
}
svg {
diff --git a/src/main/scss/form/_checkbox.scss b/src/main/scss/form/_checkbox.scss
index 6e5633dd991f..92614fefe50c 100644
--- a/src/main/scss/form/_checkbox.scss
+++ b/src/main/scss/form/_checkbox.scss
@@ -32,7 +32,7 @@
& + label {
&::before {
box-shadow:
- 0 0 0 5px var(--focus-input-glow),
+ var(--form-input-glow--focus),
inset 0 0 0 5px var(--focus-input-border);
}
}
@@ -44,7 +44,7 @@
& + label {
&::before {
box-shadow:
- 0 0 0 5px var(--focus-input-glow),
+ var(--form-input-glow--focus),
inset 0 0 0 12px var(--focus-input-border);
}
}
@@ -58,7 +58,7 @@
& + label {
&::before {
box-shadow:
- 0 0 0 5px var(--focus-input-glow),
+ var(--form-input-glow--focus),
inset 0 0 0 12px var(--focus-input-border);
}
}
@@ -71,7 +71,7 @@
&:focus {
&::before {
box-shadow:
- 0 0 0 5px var(--focus-input-glow),
+ var(--form-input-glow--focus),
inset 0 0 0 12px var(--focus-input-border);
}
}
@@ -80,7 +80,7 @@
& + label {
&::before {
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 12px var(--focus-input-border);
}
@@ -97,7 +97,7 @@
&::before {
opacity: 0.35 !important;
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 2px var(--input-border) !important;
}
}
@@ -106,7 +106,7 @@
& + label {
&::before {
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 12px var(--focus-input-border) !important;
}
@@ -138,8 +138,8 @@
transition: var(--standard-transition);
margin-right: 11px;
box-shadow:
- 0 0 0 10px transparent,
- inset 0 0 0 2px var(--input-border);
+ var(--form-input-glow),
+ inset 0 0 0 var(--jenkins-border-width) var(--input-border);
background: var(--input-color);
}
@@ -171,7 +171,7 @@
&:hover {
&::before {
box-shadow:
- 0 0 0 10px transparent,
+ var(--form-input-glow),
inset 0 0 0 5px var(--input-border-hover);
}
}
@@ -180,7 +180,7 @@
&:focus {
&::before {
box-shadow:
- 0 0 0 5px var(--focus-input-glow),
+ var(--form-input-glow--focus),
inset 0 0 0 5px var(--focus-input-border);
}
}
diff --git a/src/main/scss/form/_codemirror.scss b/src/main/scss/form/_codemirror.scss
index a34165e8ba57..fb14e6bb9fe6 100644
--- a/src/main/scss/form/_codemirror.scss
+++ b/src/main/scss/form/_codemirror.scss
@@ -1,7 +1,7 @@
.CodeMirror {
display: block;
background: var(--input-color);
- border: 2px solid var(--input-border);
+ border: var(--jenkins-border-width) solid var(--input-border);
border-radius: var(--form-input-border-radius);
width: 100%;
box-shadow: var(--form-input-glow);
@@ -48,8 +48,7 @@
}
.CodeMirror-gutter-text {
- padding: var(--form-input-padding) calc(var(--form-input-padding) * 0.5)
- var(--form-input-padding) var(--form-input-padding);
+ padding: 0.5rem calc(0.625rem * 0.5) 0.625rem 0.5rem;
color: var(--text-color-secondary);
}
}
diff --git a/src/main/scss/form/_file-upload.scss b/src/main/scss/form/_file-upload.scss
index 1969d823ec76..5c5f82f6c08c 100644
--- a/src/main/scss/form/_file-upload.scss
+++ b/src/main/scss/form/_file-upload.scss
@@ -24,7 +24,6 @@
display: inline-flex;
align-items: center;
justify-content: center;
- border: none;
outline: none;
margin: 0 1rem 0 0;
padding: 0.5rem 0.85rem 0.5rem 2.5rem;
@@ -34,7 +33,7 @@
padding: 0.5rem 0.85rem;
}
- font-size: 0.8rem;
+ font-size: var(--font-size-sm);
font-weight: normal;
color: var(--text-color);
border-radius: var(--form-input-border-radius);
@@ -43,7 +42,8 @@
white-space: nowrap;
background: var(--button-background);
transition: var(--standard-transition);
- box-shadow: 0 0 0 10px transparent;
+ box-shadow: var(--form-input-glow);
+ border: var(--jenkins-border--subtle);
&:hover {
background: var(--button-background--hover);
@@ -51,7 +51,7 @@
&:active {
background: var(--button-background--active);
- box-shadow: 0 0 0 5px var(--button-box-shadow--focus);
+ box-shadow: 0 0 0 4px var(--button-box-shadow--focus);
}
}
diff --git a/src/main/scss/form/_input.scss b/src/main/scss/form/_input.scss
index 0d97b0816211..d81ffb2cf740 100644
--- a/src/main/scss/form/_input.scss
+++ b/src/main/scss/form/_input.scss
@@ -1,10 +1,11 @@
.jenkins-input {
display: block;
background: var(--input-color);
- border: 2px solid var(--input-border);
+ border: var(--jenkins-border-width) solid var(--input-border);
padding: var(--form-input-padding);
border-radius: var(--form-input-border-radius);
width: 100%;
+ min-height: 2.375rem;
box-shadow: var(--form-input-glow);
// Set height transition to 0s as vertical resizing has a delay/lag otherwise
@@ -13,15 +14,21 @@
height 0s,
padding 0s;
- &:hover {
- border-color: var(--input-border-hover);
+ &:not(:disabled) {
+ &:hover {
+ border-color: var(--input-border-hover);
+ }
+
+ &:active,
+ &:focus {
+ outline: none;
+ border-color: var(--focus-input-border);
+ box-shadow: var(--form-input-glow--focus);
+ }
}
- &:active,
- &:focus {
- outline: none;
- border-color: var(--focus-input-border);
- box-shadow: var(--form-input-glow--focus);
+ &:disabled {
+ cursor: not-allowed;
}
}
diff --git a/src/main/scss/form/_layout.scss b/src/main/scss/form/_layout.scss
index 2b0706f53749..77e5dd58af66 100644
--- a/src/main/scss/form/_layout.scss
+++ b/src/main/scss/form/_layout.scss
@@ -1,3 +1,5 @@
+@use "../abstracts/mixins";
+
.jenkins-form {
max-width: var(--form-item-max-width);
}
@@ -70,6 +72,8 @@
align-items: center;
background-color: var(--button-background);
border-radius: var(--form-input-border-radius);
+ outline: var(--jenkins-border--subtle);
+ outline-offset: calc(var(--jenkins-border-width) * -1);
padding: 0 1rem;
gap: 1.5rem;
@@ -89,12 +93,14 @@
}
.jenkins-help-button {
- position: relative;
+ @include mixins.item;
+
+ --item-background: var(--button-background);
+
display: inline-flex;
justify-content: center;
align-items: center;
margin-left: 1ch;
- color: var(--text-color) !important;
border-radius: 100%;
span {
@@ -110,47 +116,6 @@
mask-position: center;
mask-repeat: no-repeat;
}
-
- &::before {
- content: "";
- position: absolute;
- inset: 0;
- background: var(--text-color-secondary);
- opacity: 0.1;
- border-radius: inherit;
- transition: var(--standard-transition);
- }
-
- &::after {
- content: "";
- position: absolute;
- inset: 0;
- border: 1px solid
- color-mix(in sRGB, var(--text-color-secondary), transparent);
- box-shadow: var(--form-input-glow);
- border-radius: inherit;
- opacity: 0.1;
- transition: var(--standard-transition);
- }
-
- &:hover {
- &::before {
- opacity: 0.2;
- }
- }
-
- &:active,
- &:focus {
- outline: none;
-
- &::before {
- opacity: 0.3;
- }
-
- &::after {
- box-shadow: 0 0 0 5px var(--text-color);
- }
- }
}
.jenkins-select-help {
@@ -170,7 +135,6 @@
gap: 0.45rem;
margin-left: 0.4rem;
font-size: 0.8rem;
- font-weight: var(--font-bold-weight);
cursor: default;
svg {
diff --git a/src/main/scss/form/_radio.scss b/src/main/scss/form/_radio.scss
index 00a4e52615eb..6c4828cf5930 100644
--- a/src/main/scss/form/_radio.scss
+++ b/src/main/scss/form/_radio.scss
@@ -1,10 +1,9 @@
$jenkins-radio-size: 1.375rem;
-$jenkins-radio-border-size: 0.125rem;
+$jenkins-radio-border-size: 1.5px;
$jenkins-radio-border-hover-size: 0.3125rem;
$jenkins-radio-border-active-size: 0.5rem;
$jenkins-radio-border-checked-size: 0.4rem;
-$jenkins-radio-glow-size: 0.625rem;
-$jenkins-radio-glow-active-size: 0.3125rem;
+$jenkins-radio-glow-size: 0.5rem;
.jenkins-radio-help-wrapper {
display: flex;
@@ -37,7 +36,7 @@ $jenkins-radio-glow-active-size: 0.3125rem;
&:active {
& + label::before {
box-shadow:
- 0 0 0 $jenkins-radio-glow-active-size var(--focus-input-glow),
+ var(--form-input-glow--focus),
inset 0 0 0 $jenkins-radio-border-active-size
var(--focus-input-border);
}
@@ -62,7 +61,7 @@ $jenkins-radio-glow-active-size: 0.3125rem;
&:active {
& + label::before {
box-shadow:
- 0 0 0 $jenkins-radio-glow-active-size var(--focus-input-glow),
+ var(--form-input-glow--focus),
inset 0 0 0 $jenkins-radio-border-active-size
var(--focus-input-border);
}
diff --git a/src/main/scss/form/_search-bar.scss b/src/main/scss/form/_search-bar.scss
index 79d6bfd899bc..e8b25e63f953 100644
--- a/src/main/scss/form/_search-bar.scss
+++ b/src/main/scss/form/_search-bar.scss
@@ -153,7 +153,7 @@
--search-bar-height: 3rem;
width: 100%;
- margin-block: -6px;
+ margin-block: -5px;
@media (min-width: breakpoints.$tablet-breakpoint) {
max-width: 50vw;
diff --git a/src/main/scss/form/_select.scss b/src/main/scss/form/_select.scss
index e8b2b2973b94..12f7377bb61e 100644
--- a/src/main/scss/form/_select.scss
+++ b/src/main/scss/form/_select.scss
@@ -8,26 +8,28 @@
top: 0;
right: 13px;
bottom: 0;
- width: 12px;
+ width: 0.625rem;
background-color: currentColor;
mask-image: url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='UTF-8'?%3e%3csvg width='336px' height='192px' viewBox='0 0 336 192' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3ePath%3c/title%3e%3cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3e%3cg id='arrow' transform='translate(0.000000, 0.000000)' fill='%23FF0000' fill-rule='nonzero'%3e%3cpath d='M7.02943725,7.02943725 C16.3053957,-2.24652118 31.2852799,-2.34214962 40.6788451,6.74255194 L40.9705627,7.02943725 L168,134.059 L295.029437,7.02943725 C304.305396,-2.24652118 319.28528,-2.34214962 328.678845,6.74255194 L328.970563,7.02943725 C338.246521,16.3053957 338.34215,31.2852799 329.257448,40.6788451 L328.970563,40.9705627 L184.970563,184.970563 C175.694604,194.246521 160.71472,194.34215 151.321155,185.257448 L151.029437,184.970563 L7.02943725,40.9705627 C-2.34314575,31.5979797 -2.34314575,16.4020203 7.02943725,7.02943725 Z' id='Path'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e");
mask-size: contain;
mask-repeat: no-repeat;
mask-position: center;
pointer-events: none;
+ transition: translate var(--elastic-transition);
}
&__input {
appearance: none;
display: block;
- border: 2px solid var(--input-border);
+ border: var(--jenkins-border-width) solid var(--input-border);
padding: var(--form-input-padding);
width: 100% !important; // TODO remove important after https://github.com/jenkinsci/credentials-plugin/pull/255
max-width: 100% !important; // TODO remove important after https://github.com/jenkinsci/credentials-plugin/pull/255
border-radius: var(--form-input-border-radius);
- box-shadow: 0 0 0 10px transparent;
+ box-shadow: var(--form-input-glow);
transition: var(--standard-transition);
min-height: 38px;
+ cursor: pointer;
&:hover {
border-color: var(--input-border-hover);
@@ -37,27 +39,33 @@
&:focus {
outline: none;
border-color: var(--focus-input-border);
- box-shadow: 0 0 0 5px var(--focus-input-glow);
+ box-shadow: var(--form-input-glow--focus);
}
&:disabled {
pointer-events: none;
}
}
+
+ &:hover {
+ &::after {
+ translate: 0 1px;
+ }
+ }
}
.jenkins-multi-select {
position: relative;
width: 100%;
- border: 2px solid var(--input-border);
+ border: var(--jenkins-border-width) solid var(--input-border);
border-radius: var(--form-input-border-radius);
- box-shadow: 0 0 0 10px transparent;
+ box-shadow: var(--form-input-glow);
transition: var(--standard-transition);
outline: none;
&:focus {
border-color: var(--focus-input-border);
- box-shadow: 0 0 0 5px var(--focus-input-glow);
+ box-shadow: var(--form-input-glow--focus);
}
&:disabled {
diff --git a/src/main/scss/form/_textarea.scss b/src/main/scss/form/_textarea.scss
index db5931407349..94af18dd057a 100644
--- a/src/main/scss/form/_textarea.scss
+++ b/src/main/scss/form/_textarea.scss
@@ -6,7 +6,8 @@
}
.textarea-preview {
- background-color: var(--very-light-grey);
+ background-color: var(--button-background);
+ border: var(--jenkins-border--subtle);
padding: var(--form-input-padding);
margin-top: 0.5rem;
border-radius: var(--form-input-border-radius);
diff --git a/src/main/scss/form/_toggle-switch.scss b/src/main/scss/form/_toggle-switch.scss
index 5f7f46a7f53a..33efe7d23ca7 100644
--- a/src/main/scss/form/_toggle-switch.scss
+++ b/src/main/scss/form/_toggle-switch.scss
@@ -69,6 +69,13 @@
&:active,
&:focus {
+ &::before {
+ box-shadow:
+ inset 0 0 0 1.5px
+ color-mix(in sRGB, var(--text-color-secondary) 9%, transparent),
+ var(--form-input-glow--focus);
+ }
+
&::after {
left: 20px;
width: 25px;
@@ -101,6 +108,7 @@
cursor: pointer;
line-height: 30px;
font-weight: var(--form-label-font-weight);
+ user-select: none;
&::before {
display: inline-block;
@@ -113,8 +121,9 @@
transition: var(--standard-transition);
margin-right: 1rem;
box-shadow:
- inset 0 0 0 1px rgb(0 0 0 / 0.05),
- 0 0 0 10px transparent;
+ inset 0 0 0 1.5px
+ color-mix(in sRGB, var(--text-color-secondary) 9%, transparent),
+ var(--form-input-glow);
}
&::after {
@@ -132,7 +141,8 @@
mask-position: center;
border-radius: 100px;
transition: var(--standard-transition);
- box-shadow: 0 1px 0 rgb(0 0 0 / 0.1);
+ box-shadow: 0 0 0 1.5px
+ color-mix(in sRGB, var(--text-color-secondary) 9%, transparent);
}
&:hover::before {
@@ -143,8 +153,10 @@
&:focus {
&::before {
box-shadow:
- inset 0 0 0 1px rgb(0 0 0 / 0.05),
- 0 0 0 5px var(--focus-input-glow);
+ inset 0 0 0 1.5px
+ color-mix(in sRGB, var(--text-color-secondary) 9%, transparent),
+ 0 0 0 4px
+ color-mix(in sRGB, var(--text-color-secondary) 25%, transparent);
}
&::after {
diff --git a/src/main/scss/pages/_about.scss b/src/main/scss/pages/_about.scss
index 99eb40d9338f..4879090b290e 100644
--- a/src/main/scss/pages/_about.scss
+++ b/src/main/scss/pages/_about.scss
@@ -7,15 +7,18 @@
pointer-events: none;
margin-bottom: var(--section-padding);
overflow: hidden;
- mask-border-source: url("data:image/svg+xml,%3Csvg width='45' height='45' viewBox='0 0 45 45' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 22.5C0 15.5109 0 12.0163 1.14181 9.25975C2.66422 5.58433 5.58433 2.66422 9.25975 1.14181C12.0163 0 15.5109 0 22.5 0C29.4891 0 32.9837 0 35.7402 1.14181C39.4157 2.66422 42.3358 5.58433 43.8582 9.25975C45 12.0163 45 15.5109 45 22.5C45 29.4891 45 32.9837 43.8582 35.7402C42.3358 39.4157 39.4157 42.3358 35.7402 43.8582C32.9837 45 29.4891 45 22.5 45C15.5109 45 12.0163 45 9.25975 43.8582C5.58433 42.3358 2.66422 39.4157 1.14181 35.7402C0 32.9837 0 29.4891 0 22.5Z' fill='%23D9D9D9'/%3E%3C/svg%3E%0A");
- mask-border-slice: 49% fill;
+ border-radius: 1rem;
- &::before {
+ &::before,
+ &::after {
content: "";
position: absolute;
+ z-index: 1;
+ }
+
+ &::before {
width: 120%;
aspect-ratio: 1;
- z-index: 1;
background: repeating-conic-gradient(
var(--background) 0deg,
rgb(100 100 100 / 0.25) 20deg
@@ -24,6 +27,12 @@
opacity: 0.25;
}
+ &::after {
+ inset: 0;
+ border: var(--jenkins-border--subtle);
+ border-radius: inherit;
+ }
+
img {
height: 7.5rem;
z-index: 1;
diff --git a/src/main/scss/pages/_dashboard.scss b/src/main/scss/pages/_dashboard.scss
index c66b39e4508a..e8251c2dad76 100644
--- a/src/main/scss/pages/_dashboard.scss
+++ b/src/main/scss/pages/_dashboard.scss
@@ -1,6 +1,6 @@
@use "../abstracts/mixins";
-$min-button-size: 36px;
+$min-button-size: 2.375rem;
.jenkins-icon-size {
display: flex;
diff --git a/src/main/scss/pages/_job.scss b/src/main/scss/pages/_job.scss
index b9675ee8a6d5..105817790a16 100644
--- a/src/main/scss/pages/_job.scss
+++ b/src/main/scss/pages/_job.scss
@@ -94,7 +94,7 @@
}
.app-builds-container__item {
- @include mixins.item;
+ @include mixins.item($border: false);
display: grid;
grid-template-columns: auto 1fr auto;
From 7a42953e9d752297a931a2a7a511fa39e881f7b6 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 26 Jan 2025 12:49:36 +0000
Subject: [PATCH 45/96] Update _breadcrumbs-new.scss
---
src/main/scss/components/_breadcrumbs-new.scss | 1 +
1 file changed, 1 insertion(+)
diff --git a/src/main/scss/components/_breadcrumbs-new.scss b/src/main/scss/components/_breadcrumbs-new.scss
index 18ea2ac26f3b..0fb7966d6b06 100644
--- a/src/main/scss/components/_breadcrumbs-new.scss
+++ b/src/main/scss/components/_breadcrumbs-new.scss
@@ -57,6 +57,7 @@
&::before,
&::after {
inset: -2px -6px;
+ border: none;
}
&:hover {
From f76088be10829a1d367e17504fdfbd932b8f9903 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Mon, 27 Jan 2025 12:30:54 +0000
Subject: [PATCH 46/96] Fix dropdown theme
---
.../jenkins/model/navigation/UserAction/jumplist.jelly | 2 +-
.../jenkins/views/ExperimentalJenkinsHeader/headerContent.jelly | 1 +
2 files changed, 2 insertions(+), 1 deletion(-)
diff --git a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
index 18fa9cb32570..1c222a5e8427 100644
--- a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
+++ b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
@@ -1,6 +1,6 @@
-
${it.fullName}
diff --git a/core/src/main/resources/hudson/security/HudsonPrivateSecurityRealm/index.jelly b/core/src/main/resources/hudson/security/HudsonPrivateSecurityRealm/index.jelly index 559e2370a720..4c0900b5ecde 100644 --- a/core/src/main/resources/hudson/security/HudsonPrivateSecurityRealm/index.jelly +++ b/core/src/main/resources/hudson/security/HudsonPrivateSecurityRealm/index.jelly @@ -52,7 +52,7 @@ THE SOFTWARE.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ root-action-${action.class.simpleName}
+ ${h.getActionUrl(app.url, action)}
+ ${interactive}
+ false
+ jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
+
+
+
+
+
+
+
+ ${action.displayName}
+ ${action.badge.tooltip}
+
-
-
-
-
-
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- root-action-${action.class.simpleName}
- ${h.getActionUrl(app.url, action)}
- ${interactive}
- false
- jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
-
-
-
-
-
-
-
- ${action.displayName}
- ${action.badge.tooltip}
-
- Jenkins
+
+
+ Jenkins
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Jenkins
+
+
+ Jenkins
+
+
+
+
+
+
+
+
+
+
+
+ ${%Search}
+
+
+
diff --git a/src/main/scss/abstracts/_theme.scss b/src/main/scss/abstracts/_theme.scss
index e972b494eb3a..458d01244161 100644
--- a/src/main/scss/abstracts/_theme.scss
+++ b/src/main/scss/abstracts/_theme.scss
@@ -71,6 +71,13 @@ $semantics: (
// Header
--header-background: var(--background);
+ // Header - deprecated
+ --brand-link-color: var(--secondary);
+ --header-link-color: var(--white);
+ --header-bg-classic: var(--black);
+ --header-link-bg-classic-hover: #404040;
+ --header-link-bg-classic-active: #404040;
+
// Breadcrumbs bar
--breadcrumbs-bar-background: oklch(
from var(--text-color) 96.8% 0.005 h / 0.8
diff --git a/src/main/scss/components/_breadcrumbs-new.scss b/src/main/scss/components/_breadcrumbs-new.scss
new file mode 100644
index 000000000000..0fa6bdd0cf94
--- /dev/null
+++ b/src/main/scss/components/_breadcrumbs-new.scss
@@ -0,0 +1,95 @@
+@use "../abstracts/mixins";
+
+.jenkins-header__breadcrumbs {
+ display: flex;
+ align-items: center;
+ gap: 0.625rem;
+ overflow: auto hidden;
+ padding-left: var(--section-padding);
+
+ &__list {
+ display: contents;
+
+ &-item {
+ display: contents;
+
+ &:first-of-type {
+ a {
+ font-family: Georgia, serif;
+ font-weight: 600;
+ font-size: 1.125rem;
+
+ // Increase the hit-box for the Jenkins logo for Fitts’s Law
+ &::before {
+ content: "";
+ position: absolute;
+ inset: -30px -15px -18px -100px;
+ }
+ }
+ }
+
+ & > a,
+ span {
+ position: relative;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ gap: 1rem;
+ font-weight: 500;
+ font-size: var(--font-size-sm);
+ margin: 0;
+ padding: 0;
+ color: inherit;
+ text-decoration: none;
+ text-wrap: nowrap;
+ flex-shrink: 0;
+ }
+
+ & > a {
+ @include mixins.item;
+
+ --item-background--hover: transparent;
+ --item-background--active: transparent;
+ --item-box-shadow--focus: transparent;
+
+ transition: opacity var(--standard-transition);
+
+ &::before,
+ &::after {
+ inset: -2px -6px;
+ }
+
+ &:hover {
+ opacity: 0.7;
+ }
+
+ &:active {
+ opacity: 0.4;
+ }
+ }
+
+ // '/' separator between two items
+ &::after {
+ content: "";
+ position: relative;
+ width: 1rem;
+ height: 1.25rem;
+ flex-shrink: 0;
+ transition: var(--standard-transition);
+ background: var(--text-color-secondary);
+ mask-size: contain;
+ mask-position: center;
+ mask-repeat: no-repeat;
+ mask-image: url("data:image/svg+xml,%3Csvg width='10' height='20' viewBox='0 0 10 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 18L8 2' stroke='black' stroke-width='1.5px' stroke-linecap='round'/%3E%3C/svg%3E%0A");
+ opacity: 0.2;
+ scale: 1.1;
+ }
+
+ &:last-of-type {
+ &::after {
+ display: none;
+ }
+ }
+ }
+ }
+}
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index 3ac0afef5c99..609737acefb3 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -1,95 +1,132 @@
@use "../abstracts/mixins";
.jenkins-breadcrumbs {
+ position: sticky;
+ top: 0;
+ z-index: 999;
display: flex;
align-items: center;
- gap: 0.625rem;
- overflow: auto hidden;
- padding-left: var(--section-padding);
+ padding: 0.55rem 0.7rem 0.55rem 0.75rem;
+ backdrop-filter: blur(15px);
+ overflow-x: auto;
+ background: var(--breadcrumbs-bar-background);
&__list {
display: contents;
+ list-style-type: none;
+
+ & > * {
+ flex-shrink: 0;
+ }
&-item {
- display: contents;
-
- &:first-of-type {
- a {
- font-family: Georgia, serif;
- font-weight: 600;
- font-size: 1.125rem;
-
- // Increase the hit-box for the Jenkins logo for Fitts’s Law
- &::before {
- content: "";
- position: absolute;
- inset: -30px -15px -18px -100px;
- }
- }
- }
+ position: relative;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ color: var(--text-color);
+ font-weight: normal;
+ font-size: var(--font-size-sm);
+ padding: 0.2rem 0.4rem;
+
+ & > a {
+ @include mixins.item;
- & > a,
- span {
- position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
- gap: 1rem;
- font-weight: 500;
- font-size: var(--font-size-sm);
+ font-weight: inherit;
+ font-size: inherit;
margin: 0;
padding: 0;
- color: inherit;
+ color: var(--text-color);
text-decoration: none;
- text-wrap: nowrap;
- flex-shrink: 0;
- }
-
- & > a {
- @include mixins.item;
-
- --item-background--hover: transparent;
- --item-background--active: transparent;
- --item-box-shadow--focus: transparent;
-
- transition: opacity var(--standard-transition);
+ margin-right: 0 !important;
+ transition: var(--standard-transition);
&::before,
&::after {
- inset: -2px -6px;
+ inset: -0.25rem -0.6rem;
}
- &:hover {
- opacity: 0.7;
+ &:hover,
+ &:active,
+ &:focus,
+ &:focus-visible {
+ color: var(--text-color);
}
+ }
- &:active {
- opacity: 0.4;
+ & > .model-link {
+ @media (hover: none) {
+ margin-right: 30px !important;
+ }
+
+ &:hover,
+ &--open {
+ margin-right: 30px !important;
}
}
+ }
+
+ // '>' separator between two items
+ .children,
+ .separator {
+ position: relative;
+ width: 1rem;
+ height: 1rem;
+ margin: 0.375rem 0.2rem;
- // '/' separator between two items
&::after {
content: "";
- position: relative;
- width: 1rem;
- height: 1.25rem;
- flex-shrink: 0;
+ position: absolute;
+ inset: 0;
transition: var(--standard-transition);
background: var(--text-color-secondary);
- mask-size: contain;
- mask-position: center;
- mask-repeat: no-repeat;
- mask-image: url("data:image/svg+xml,%3Csvg width='10' height='20' viewBox='0 0 10 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 18L8 2' stroke='black' stroke-width='1.5px' stroke-linecap='round'/%3E%3C/svg%3E%0A");
- opacity: 0.2;
- scale: 1.1;
+ mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E");
+ opacity: 0.6;
}
+ }
+ .separator {
&:last-of-type {
+ display: none;
+ }
+ }
+
+ .children {
+ cursor: pointer;
+
+ &:hover {
+ &::after {
+ opacity: 1;
+ transform: rotate(90deg);
+ }
+ }
+
+ &:active {
&::after {
- display: none;
+ transform: translateY(2px) rotate(90deg);
+ opacity: 0.5;
+ }
+ }
+
+ &:hover,
+ &:active,
+ &:focus,
+ &:focus-visible {
+ &::after {
+ background: var(--text-color);
}
}
+
+ // Increase the hit target
+ &::before {
+ content: "";
+ position: absolute;
+ inset: -14px -5px;
+ background: transparent;
+ }
}
}
}
diff --git a/src/main/scss/components/_header.scss b/src/main/scss/components/_header.scss
new file mode 100644
index 000000000000..2f2b1bef3a99
--- /dev/null
+++ b/src/main/scss/components/_header.scss
@@ -0,0 +1,85 @@
+@use "../abstracts/mixins";
+
+.jenkins-header {
+ --background-opacity: 0%;
+ --background-blur: 0;
+ --border-opacity: 0%;
+
+ position: sticky;
+ top: 0;
+ z-index: 20;
+ display: grid;
+ grid-template-columns: 1fr auto;
+ gap: var(--section-padding);
+ font-size: var(--font-size-base);
+ line-height: var(--line-height-base);
+ min-height: 4.375rem;
+
+ &::before {
+ content: "";
+ position: absolute;
+ inset: 0;
+ backdrop-filter: blur(var(--background-blur));
+ background: color-mix(
+ in sRGB,
+ var(--header-background) var(--background-opacity),
+ transparent
+ );
+ border-bottom: 1.5px solid
+ color-mix(
+ in sRGB,
+ var(--text-color-secondary) var(--border-opacity),
+ transparent
+ );
+ background-clip: padding-box;
+ }
+
+ #jenkins-head-icon {
+ height: 2rem;
+ margin-left: 0.15rem;
+ }
+
+ &__actions {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 0.5rem;
+ padding-right: var(--section-padding);
+
+ .jenkins-button {
+ min-width: 2.375rem;
+ min-height: 2.375rem;
+ padding: 0.5rem;
+
+ svg {
+ width: 1.25rem;
+ height: 1.25rem;
+ }
+
+ img {
+ border-radius: 100px;
+ width: 1.375rem;
+ height: 1.375rem;
+ outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
+ background: color-mix(in srgb, var(--text-color) 5%, transparent);
+ outline-offset: -1px;
+ }
+
+ .jenkins-badge {
+ position: absolute;
+ top: calc(16%);
+ right: calc(16%);
+ min-width: 5px;
+ min-height: 5px;
+ padding: 0;
+ }
+ }
+ }
+}
+
+body:has(.jenkins-app-bar--sticky) {
+ .jenkins-header::before {
+ bottom: -4rem;
+ mask-image: linear-gradient(black 50%, transparent);
+ }
+}
diff --git a/src/main/scss/components/_index.scss b/src/main/scss/components/_index.scss
index 684c31aa0e28..121f4a35e437 100644
--- a/src/main/scss/components/_index.scss
+++ b/src/main/scss/components/_index.scss
@@ -3,12 +3,14 @@
@use "avatar";
@use "badges";
@use "breadcrumbs";
+@use "breadcrumbs-new"; // Experimental
@use "buttons";
@use "cards";
@use "command-palette";
@use "content-blocks";
@use "dialogs";
@use "dropdowns";
+@use "header"; // Experimental
@use "icons";
@use "notice";
@use "notifications";
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 90a22ff2a7af..85c4cca0f71b 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -1,85 +1,94 @@
@use "../abstracts/mixins";
.page-header {
- --background-opacity: 0%;
- --background-blur: 0;
- --border-opacity: 0%;
-
- position: sticky;
- top: 0;
- z-index: 20;
- display: grid;
- grid-template-columns: 1fr auto;
- gap: var(--section-padding);
+ display: flex;
+ align-items: center;
+ height: 3.5rem;
font-size: var(--font-size-base);
line-height: var(--line-height-base);
- min-height: 4.375rem;
-
- &::before {
- content: "";
- position: absolute;
- inset: 0;
- backdrop-filter: blur(var(--background-blur));
- background: color-mix(
- in sRGB,
- var(--header-background) var(--background-opacity),
- transparent
- );
- border-bottom: 1.5px solid
- color-mix(
- in sRGB,
- var(--text-color-secondary) var(--border-opacity),
- transparent
- );
- background-clip: padding-box;
+ background-color: var(--header-bg-classic);
+}
+
+.page-header > * {
+ margin-right: 0.75rem;
+}
+
+.page-header__brand {
+ display: inline-block;
+ height: 3.5rem;
+ position: relative;
+ flex: 1; // push controls to the end of the block
+}
+
+// Need to use the element selector to increase weight otherwise it will be overriden by the
+// a:visited selector if it is declared later
+// Only styled by the overrides with the new UI enabled
+a.page-header__brand-link {
+ display: none;
+}
+
+.page-header__brand-name {
+ color: inherit;
+}
+
+.page-header__brand-image {
+ height: 2rem;
+ width: 1.5rem;
+ margin-right: 0.75rem;
+}
+
+.page-header__am-wrapper {
+ display: contents;
+}
+
+.page-header__hyperlinks {
+ display: flex;
+ align-items: center;
+}
+
+.page-header__hyperlinks > a,
+.page-header__hyperlinks > button,
+.am-container > a {
+ @include mixins.item;
+
+ --text-color: var(--header-link-color);
+
+ display: inline-flex;
+ align-items: center;
+ appearance: none;
+ background: transparent;
+ outline: none;
+ border: none;
+ cursor: pointer;
+ color: var(--text-color);
+ text-decoration: none;
+ padding: 0.5rem;
+ margin-right: 0 !important;
+
+ svg {
+ width: 1.25rem;
+ height: 1.25rem;
}
- #jenkins-head-icon {
- height: 2rem;
- margin-left: 0.15rem;
+ &::before,
+ &::after {
+ inset: 0 !important;
}
- .page-header__actions {
- display: flex;
- align-items: center;
- justify-content: center;
- gap: 0.5rem;
- padding-right: var(--section-padding);
-
- .jenkins-button {
- min-width: 2.375rem;
- min-height: 2.375rem;
- padding: 0.5rem;
-
- svg {
- width: 1.25rem;
- height: 1.25rem;
- }
-
- img {
- border-radius: 100px;
- width: 1.375rem;
- height: 1.375rem;
- outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
- background: color-mix(in srgb, var(--text-color) 5%, transparent);
- outline-offset: -1px;
- }
-
- .jenkins-badge {
- position: absolute;
- top: calc(16%);
- right: calc(16%);
- min-width: 5px;
- min-height: 5px;
- padding: 0;
- }
+ .jenkins-menu-dropdown-chevron {
+ position: relative;
+ top: unset !important;
+ right: unset !important;
+ margin-left: 0.5rem;
+
+ &::after {
+ opacity: 1;
}
}
}
-body:has(.jenkins-app-bar--sticky) {
- .page-header::before {
- bottom: -4rem;
- mask-image: linear-gradient(black 50%, transparent);
+.page-header__hyperlinks a span {
+ &:not(:first-child) {
+ margin-left: 0.25rem;
}
}
From 9cc86bdd81b80a89fa8663c6a823a1e3c405c62f Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 23 Jan 2025 19:46:01 +0000
Subject: [PATCH 40/96] Update sidepanel.jelly
---
core/src/main/resources/hudson/model/View/sidepanel.jelly | 5 +++++
1 file changed, 5 insertions(+)
diff --git a/core/src/main/resources/hudson/model/View/sidepanel.jelly b/core/src/main/resources/hudson/model/View/sidepanel.jelly
index bfdcf80cc038..f5aad09c588a 100644
--- a/core/src/main/resources/hudson/model/View/sidepanel.jelly
+++ b/core/src/main/resources/hudson/model/View/sidepanel.jelly
@@ -60,6 +60,11 @@ THE SOFTWARE.
+
+
Jenkins
+
${h.getActionUrl(app.url, action)}
${interactive}
+ ${interactive ? 'dropdown' : 'tooltip'}
false
jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
activeAdministrativeMonitors = Optional.ofNullable(decorator.getMonitorsToDisplay()).orElse(Collections.emptyList());
-// boolean anySecurity = activeAdministrativeMonitors.stream().anyMatch(AdministrativeMonitor::isSecurity);
-//
-// if (activeAdministrativeMonitors.isEmpty()) {
-// return null;
-// }
+ Jenkins jenkins = Jenkins.get();
+ AdministrativeMonitorsDecorator decorator = jenkins.getExtensionList(PageDecorator.class)
+ .get(AdministrativeMonitorsDecorator.class);
+ Collection activeAdministrativeMonitors = Optional.ofNullable(decorator.getMonitorsToDisplay()).orElse(Collections.emptyList());
+ boolean anySecurity = activeAdministrativeMonitors.stream().anyMatch(AdministrativeMonitor::isSecurity);
- // TODO - should this include plugin updates?
- return ManagementLink.all()
- .stream()
- .filter(e -> e.getClass().equals(PluginsLink.class))
- .findFirst()
- .map(ManagementLink::getBadge)
- .orElse(null);
+ if (activeAdministrativeMonitors.isEmpty()) {
+ return null;
+ }
+
+ int size = activeAdministrativeMonitors.size();
+ String suffix = size > 1 ? "notifications" : "notification";
-// int size = activeAdministrativeMonitors.size();
-// String suffix = size > 1 ? "notifications" : "notification";
-//
-// return new Badge(String.valueOf(size),
-// size + " " + suffix,
-// anySecurity ? Badge.Severity.DANGER : Badge.Severity.WARNING);
+ return new Badge(String.valueOf(size),
+ size + " " + suffix,
+ anySecurity ? Badge.Severity.DANGER : Badge.Severity.WARNING);
}
}
From 3397f3978add58bb195c046cd52d217690dbf527 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 30 Jan 2025 18:22:26 +0000
Subject: [PATCH 50/96] Remove flag
---
.../model/navigation/SearchAction.java | 7 -
.../jenkins/model/navigation/UserAction.java | 4 +-
.../views/ExperimentalJenkinsHeader.java | 23 ---
.../hudson/model/View/sidepanel.jelly | 5 -
.../headerContent.jelly | 88 ----------
.../views/JenkinsHeader/headerContent.jelly | 90 +++++++++-
.../resources/lib/layout/breadcrumb.jelly | 52 ++----
.../resources/lib/layout/header/login.jelly | 54 +-----
.../resources/lib/layout/header/logo.jelly | 28 +---
.../main/resources/lib/layout/layout.jelly | 8 -
.../scss/components/_breadcrumbs-new.scss | 96 -----------
src/main/scss/components/_breadcrumbs.scss | 154 +++++++-----------
src/main/scss/components/_index.scss | 4 +-
src/main/scss/components/_page-header.scss | 115 -------------
14 files changed, 171 insertions(+), 557 deletions(-)
delete mode 100644 core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java
delete mode 100644 core/src/main/resources/jenkins/views/ExperimentalJenkinsHeader/headerContent.jelly
delete mode 100644 src/main/scss/components/_breadcrumbs-new.scss
delete mode 100644 src/main/scss/components/_page-header.scss
diff --git a/core/src/main/java/jenkins/model/navigation/SearchAction.java b/core/src/main/java/jenkins/model/navigation/SearchAction.java
index 84a32bbc143e..36a56bda2f53 100644
--- a/core/src/main/java/jenkins/model/navigation/SearchAction.java
+++ b/core/src/main/java/jenkins/model/navigation/SearchAction.java
@@ -26,7 +26,6 @@
import hudson.Extension;
import hudson.model.RootAction;
-import jenkins.model.experimentalflags.UserExperimentalFlag;
/**
* TODO
@@ -36,12 +35,6 @@ public class SearchAction implements RootAction {
@Override
public String getIconFileName() {
- boolean flagEnabled = UserExperimentalFlag.getFlagValueForCurrentUser("jenkins.model.experimentalflags.NewHeaderUserExperimentalFlag");
-
- if (!flagEnabled) {
- return null;
- }
-
return "symbol-search";
}
diff --git a/core/src/main/java/jenkins/model/navigation/UserAction.java b/core/src/main/java/jenkins/model/navigation/UserAction.java
index aec6fd624117..96f33db95220 100644
--- a/core/src/main/java/jenkins/model/navigation/UserAction.java
+++ b/core/src/main/java/jenkins/model/navigation/UserAction.java
@@ -29,7 +29,6 @@
import hudson.Extension;
import hudson.model.RootAction;
import hudson.model.User;
-import jenkins.model.experimentalflags.UserExperimentalFlag;
import org.kohsuke.accmod.Restricted;
import org.kohsuke.accmod.restrictions.NoExternalUse;
@@ -41,8 +40,7 @@ public class UserAction implements RootAction {
@Override
public String getIconFileName() {
- boolean flagEnabled = UserExperimentalFlag.getFlagValueForCurrentUser("jenkins.model.experimentalflags.NewHeaderUserExperimentalFlag");
- if (User.current() == null || !flagEnabled) {
+ if (User.current() == null) {
return null;
}
diff --git a/core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java b/core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java
deleted file mode 100644
index 3dc1a56d40c3..000000000000
--- a/core/src/main/java/jenkins/views/ExperimentalJenkinsHeader.java
+++ /dev/null
@@ -1,23 +0,0 @@
-package jenkins.views;
-
-import hudson.Extension;
-import jenkins.model.experimentalflags.UserExperimentalFlag;
-
-/**
- * Experimental {@link Header} provided by Jenkins
- *
- * @see Header
- */
-@Extension(ordinal = Integer.MIN_VALUE)
-public class ExperimentalJenkinsHeader extends FullHeader {
-
- @Override
- public boolean isEnabled() {
- return true;
- }
-
- @Override
- public boolean isAvailable() {
- return UserExperimentalFlag.getFlagValueForCurrentUser("jenkins.model.experimentalflags.NewHeaderUserExperimentalFlag");
- }
-}
diff --git a/core/src/main/resources/hudson/model/View/sidepanel.jelly b/core/src/main/resources/hudson/model/View/sidepanel.jelly
index b99a5bf581e9..bfdcf80cc038 100644
--- a/core/src/main/resources/hudson/model/View/sidepanel.jelly
+++ b/core/src/main/resources/hudson/model/View/sidepanel.jelly
@@ -60,11 +60,6 @@ THE SOFTWARE.
-
-
-
-
-
-
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 1f22ef506358..1a660395660e 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,8 +1,88 @@
-
-
-
+
+
+
+
diff --git a/core/src/main/resources/lib/layout/breadcrumb.jelly b/core/src/main/resources/lib/layout/breadcrumb.jelly
index 180ddec5e1ff..b307dd7be6ad 100644
--- a/core/src/main/resources/lib/layout/breadcrumb.jelly
+++ b/core/src/main/resources/lib/layout/breadcrumb.jelly
@@ -42,41 +42,19 @@ THE SOFTWARE.
-
-
-
-
-
-
- ${attrs.title}
-
-
-
- ${attrs.title}
-
-
-
-
-
-
-
-
-
-
-
- ${attrs.title}
-
-
-
- ${attrs.title}
-
-
-
-
-
-
-
+
+
+
+
+ ${attrs.title}
+
+
+
+ ${attrs.title}
+
+
+
+
+
diff --git a/core/src/main/resources/lib/layout/header/login.jelly b/core/src/main/resources/lib/layout/header/login.jelly
index edd929d65a95..d0dc4400d451 100644
--- a/core/src/main/resources/lib/layout/header/login.jelly
+++ b/core/src/main/resources/lib/layout/header/login.jelly
@@ -1,50 +1,8 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
diff --git a/core/src/main/resources/lib/layout/header/logo.jelly b/core/src/main/resources/lib/layout/header/logo.jelly
index 4a68ca32fbc8..7030e059d5fb 100644
--- a/core/src/main/resources/lib/layout/header/logo.jelly
+++ b/core/src/main/resources/lib/layout/header/logo.jelly
@@ -1,27 +1,5 @@
-
-
-
-
-
-
- Jenkins
-
-
+
+
+ Jenkins
diff --git a/core/src/main/resources/lib/layout/layout.jelly b/core/src/main/resources/lib/layout/layout.jelly
index 0fefc2df532d..8ed4d311b922 100644
--- a/core/src/main/resources/lib/layout/layout.jelly
+++ b/core/src/main/resources/lib/layout/layout.jelly
@@ -169,14 +169,6 @@ THE SOFTWARE.
searchPlaceholder="${%search}"
searchHelpUrl="${%searchBox.url}"
logout="${%logout}"/>
-
-
-
-
-
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- root-action-${action.class.simpleName}
- ${h.getActionUrl(app.url, action)}
- ${interactive}
- ${interactive ? 'dropdown' : 'tooltip'}
- false
- jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
-
-
-
-
-
-
-
- ${action.displayName}
- ${action.badge.tooltip}
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ root-action-${action.class.simpleName}
+ ${h.getActionUrl(app.url, action)}
+ ${interactive}
+ ${interactive ? 'dropdown' : 'tooltip'}
+ false
+ jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
+
+
+
+
+
+
+
${action.displayName}
+ ${action.badge.tooltip}
+
-
- Jenkins
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Jenkins
-
-
diff --git a/src/main/scss/components/_breadcrumbs-new.scss b/src/main/scss/components/_breadcrumbs-new.scss
deleted file mode 100644
index 0fb7966d6b06..000000000000
--- a/src/main/scss/components/_breadcrumbs-new.scss
+++ /dev/null
@@ -1,96 +0,0 @@
-@use "../abstracts/mixins";
-
-.jenkins-header__breadcrumbs {
- display: flex;
- align-items: center;
- gap: 0.625rem;
- overflow: auto hidden;
- padding-left: var(--section-padding);
-
- &__list {
- display: contents;
-
- &-item {
- display: contents;
-
- &:first-of-type {
- a {
- font-family: Georgia, serif;
- font-weight: 600;
- font-size: 1.125rem;
-
- // Increase the hit-box for the Jenkins logo for Fitts’s Law
- &::before {
- content: "";
- position: absolute;
- inset: -30px -15px -18px -100px;
- }
- }
- }
-
- & > a,
- span {
- position: relative;
- display: inline-flex;
- align-items: center;
- justify-content: center;
- gap: 1rem;
- font-weight: 500;
- font-size: var(--font-size-sm);
- margin: 0;
- padding: 0;
- color: inherit;
- text-decoration: none;
- text-wrap: nowrap;
- flex-shrink: 0;
- }
-
- & > a {
- @include mixins.item($border: false);
-
- --item-background--hover: transparent;
- --item-background--active: transparent;
- --item-box-shadow--focus: transparent;
-
- transition: opacity var(--standard-transition);
-
- &::before,
- &::after {
- inset: -2px -6px;
- border: none;
- }
-
- &:hover {
- opacity: 0.7;
- }
-
- &:active {
- opacity: 0.4;
- }
- }
-
- // '/' separator between two items
- &::after {
- content: "";
- position: relative;
- width: 1rem;
- height: 1.25rem;
- flex-shrink: 0;
- transition: var(--standard-transition);
- background: var(--text-color-secondary);
- mask-size: contain;
- mask-position: center;
- mask-repeat: no-repeat;
- mask-image: url("data:image/svg+xml,%3Csvg width='10' height='20' viewBox='0 0 10 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 18L8 2' stroke='black' stroke-width='1.5px' stroke-linecap='round'/%3E%3C/svg%3E%0A");
- opacity: 0.2;
- scale: 1.1;
- }
-
- &:last-of-type {
- &::after {
- display: none;
- }
- }
- }
- }
-}
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index b000a0d5e2b6..9363c9cfa598 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -1,136 +1,101 @@
@use "../abstracts/mixins";
-.jenkins-breadcrumbs {
- position: sticky;
- top: 0;
- z-index: 999;
+.jenkins-header__breadcrumbs {
display: flex;
align-items: center;
- padding: 0.55rem 0.7rem 0.55rem 0.75rem;
- backdrop-filter: blur(15px);
- overflow-x: auto;
- background: var(--breadcrumbs-bar-background);
- margin-bottom: var(--section-padding);
+ gap: 0.625rem;
+ overflow: auto hidden;
+ padding-left: var(--section-padding);
&__list {
display: contents;
- list-style-type: none;
-
- & > * {
- flex-shrink: 0;
- }
&-item {
- position: relative;
- display: inline-flex;
- align-items: center;
- justify-content: center;
- color: var(--text-color);
- font-weight: var(--font-bold-weight);
- font-size: var(--font-size-sm);
- padding: 0.2rem 0.4rem;
-
- & > a {
- @include mixins.item($border: false);
+ display: contents;
+
+ &:first-of-type {
+ a {
+ font-family: Georgia, serif;
+ font-weight: 600;
+ font-size: 1.125rem;
+
+ // Increase the hit-box for the Jenkins logo for Fitts’s Law
+ &::before {
+ content: "";
+ position: absolute;
+ inset: -30px -15px -18px -100px;
+ }
+ }
+ }
+ & > a,
+ span {
+ position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
- font-weight: inherit;
- font-size: inherit;
+ gap: 1rem;
+ font-weight: 500;
+ font-size: var(--font-size-sm);
margin: 0;
padding: 0;
- color: var(--text-color);
- margin-right: 0 !important;
- transition: var(--standard-transition);
+ color: inherit;
+ text-decoration: none;
+ text-wrap: nowrap;
+ flex-shrink: 0;
+ }
+
+ & > a {
+ @include mixins.item($border: false);
+
+ --item-background--hover: transparent;
+ --item-background--active: transparent;
+ --item-box-shadow--focus: transparent;
+
+ transition: opacity var(--standard-transition);
&::before,
&::after {
- inset: -0.25rem -0.6rem;
+ inset: -2px -6px;
+ border: none;
}
- &:hover,
- &:active,
- &:focus,
- &:focus-visible {
- color: var(--text-color);
+ &:hover {
+ opacity: 0.7;
}
- }
- & > .model-link {
- @media (hover: none) {
- margin-right: 30px !important;
- }
-
- &:hover,
- &--open {
- margin-right: 30px !important;
+ &:active {
+ opacity: 0.4;
}
}
- }
-
- // '>' separator between two items
- .children,
- .separator {
- position: relative;
- width: 1rem;
- height: 1rem;
- margin: 0.375rem 0.2rem;
+ // '/' separator between two items
&::after {
content: "";
- position: absolute;
- inset: 0;
+ position: relative;
+ width: 1rem;
+ height: 1.25rem;
+ flex-shrink: 0;
transition: var(--standard-transition);
background: var(--text-color-secondary);
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E");
- opacity: 0.6;
+ mask-size: contain;
+ mask-position: center;
+ mask-repeat: no-repeat;
+ mask-image: url("data:image/svg+xml,%3Csvg width='10' height='20' viewBox='0 0 10 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 18L8 2' stroke='black' stroke-width='1.5px' stroke-linecap='round'/%3E%3C/svg%3E%0A");
+ opacity: 0.2;
+ scale: 1.1;
}
- }
- .separator {
&:last-of-type {
- display: none;
- }
- }
-
- .children {
- cursor: pointer;
-
- &:hover {
&::after {
- opacity: 1;
- transform: rotate(90deg);
- }
- }
-
- &:active {
- &::after {
- transform: translateY(2px) rotate(90deg);
- opacity: 0.5;
+ display: none;
}
}
-
- &:hover,
- &:active,
- &:focus,
- &:focus-visible {
- &::after {
- background: var(--text-color);
- }
- }
-
- // Increase the hit target
- &::before {
- content: "";
- position: absolute;
- inset: -14px -5px;
- background: transparent;
- }
}
}
}
+
.jenkins-menu-dropdown-chevron {
position: absolute;
display: inline-block;
@@ -306,6 +271,7 @@
.jenkins-menu-dropdown-chevron {
&::after {
opacity: 0.5;
+ display: none;
}
}
}
diff --git a/src/main/scss/components/_index.scss b/src/main/scss/components/_index.scss
index 121f4a35e437..b760592f999c 100644
--- a/src/main/scss/components/_index.scss
+++ b/src/main/scss/components/_index.scss
@@ -3,19 +3,17 @@
@use "avatar";
@use "badges";
@use "breadcrumbs";
-@use "breadcrumbs-new"; // Experimental
@use "buttons";
@use "cards";
@use "command-palette";
@use "content-blocks";
@use "dialogs";
@use "dropdowns";
-@use "header"; // Experimental
+@use "header";
@use "icons";
@use "notice";
@use "notifications";
@use "page-footer";
-@use "page-header";
@use "panes-and-bigtable";
@use "progress-animation";
@use "progress-bar";
diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
deleted file mode 100644
index 64f803061b37..000000000000
--- a/src/main/scss/components/_page-header.scss
+++ /dev/null
@@ -1,115 +0,0 @@
-@use "../abstracts/mixins";
-
-.page-header {
- display: flex;
- align-items: center;
- height: 3.5rem;
- font-size: var(--font-size-base);
- line-height: var(--line-height-base);
- background-color: var(--header-bg-classic);
-
- .logo {
- margin-left: 1.2rem;
- display: inline-flex;
- align-items: center;
- position: relative;
- height: 100%;
- width: 100%;
- }
-
- #jenkins-home-link {
- position: relative;
- }
-
- #jenkins-head-icon {
- height: 2.5rem;
- }
-
- #jenkins-name-icon {
- margin-left: 0.25rem;
- }
-}
-
-.page-header > * {
- margin-right: 0.75rem;
-}
-
-.page-header__brand {
- display: inline-block;
- height: 3.5rem;
- position: relative;
- flex: 1; // push controls to the end of the block
-}
-
-// Need to use the element selector to increase weight otherwise it will be overriden by the
-// a:visited selector if it is declared later
-// Only styled by the overrides with the new UI enabled
-a.page-header__brand-link {
- display: none;
-}
-
-.page-header__brand-name {
- color: inherit;
-}
-
-.page-header__brand-image {
- height: 2rem;
- width: 1.5rem;
- margin-right: 0.75rem;
-}
-
-.page-header__am-wrapper {
- display: contents;
-}
-
-.page-header__hyperlinks {
- display: flex;
- align-items: center;
-}
-
-.page-header__hyperlinks > a,
-.page-header__hyperlinks > button,
-.am-container > a {
- @include mixins.item;
-
- --text-color: var(--header-link-color);
-
- display: inline-flex;
- align-items: center;
- appearance: none;
- background: transparent;
- outline: none;
- border: none;
- cursor: pointer;
- color: var(--text-color);
- text-decoration: none;
- padding: 0.5rem;
- margin-right: 0 !important;
-
- svg {
- width: 1.25rem;
- height: 1.25rem;
- }
-
- &::before,
- &::after {
- inset: 0 !important;
- }
-
- .jenkins-menu-dropdown-chevron {
- position: relative;
- top: unset !important;
- right: unset !important;
- margin-left: 0.5rem;
-
- &::after {
- opacity: 1;
- }
- }
-}
-
-.page-header__hyperlinks a span {
- &:not(:first-child) {
- margin-left: 0.25rem;
- }
-}
From 79c1280d517bbb22705eb0dcfd8a2a2cca1fdd6f Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 30 Jan 2025 18:36:28 +0000
Subject: [PATCH 51/96] Tidy up
---
.../jenkins/model/navigation/UserAction.java | 20 ++
.../footer.jelly | 71 -------
.../footer.properties | 2 -
.../footer_bg.properties | 27 ---
.../footer_de.properties | 24 ---
.../footer_fr.properties | 2 -
.../footer_it.properties | 25 ---
.../footer_pl.properties | 24 ---
.../footer_pt_BR.properties | 24 ---
.../footer_sv_SE.properties | 2 -
.../footer_tr.properties | 25 ---
.../footer_zh_TW.properties | 2 -
.../resources.css | 184 ------------------
.../resources.js | 128 ------------
.../navigation/UserAction/jumplist.jelly | 17 +-
15 files changed, 31 insertions(+), 546 deletions(-)
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_bg.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_de.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_fr.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_it.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pl.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pt_BR.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_sv_SE.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_tr.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_zh_TW.properties
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.css
delete mode 100644 core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.js
diff --git a/core/src/main/java/jenkins/model/navigation/UserAction.java b/core/src/main/java/jenkins/model/navigation/UserAction.java
index 96f33db95220..c10aa6356ca8 100644
--- a/core/src/main/java/jenkins/model/navigation/UserAction.java
+++ b/core/src/main/java/jenkins/model/navigation/UserAction.java
@@ -27,11 +27,17 @@
import static hudson.Functions.getAvatar;
import hudson.Extension;
+import hudson.model.Action;
import hudson.model.RootAction;
import hudson.model.User;
import org.kohsuke.accmod.Restricted;
import org.kohsuke.accmod.restrictions.NoExternalUse;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.LinkedList;
+import java.util.List;
+
/**
* TODO
*/
@@ -69,4 +75,18 @@ public String getUrlName() {
public User getUser() {
return User.current();
}
+
+ @Restricted(NoExternalUse.class)
+ public List getActions() {
+ User current = User.current();
+
+ if (User.current() == null) {
+ return null;
+ }
+
+ List actions = new ArrayList<>();
+ actions.addAll(current.getPropertyActions());
+ actions.addAll(current.getTransientActions());
+ return Collections.unmodifiableList(actions);
+ }
}
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly
deleted file mode 100644
index 933aa774f50f..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.jelly
+++ /dev/null
@@ -1,71 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.properties
deleted file mode 100644
index 59c787763b8e..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer.properties
+++ /dev/null
@@ -1,2 +0,0 @@
-tooltip=There are {0} active administrative monitors.
-tooltipSec=There are {0} active security administrative monitors.
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_bg.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_bg.properties
deleted file mode 100644
index 53275bc89bc7..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_bg.properties
+++ /dev/null
@@ -1,27 +0,0 @@
-# The MIT License
-#
-# Bulgarian translation: Copyright (c) 2017, Alexander Shopov
-#
-# Permission is hereby granted, free of charge, to any person obtaining a copy
-# of this software and associated documentation files (the "Software"), to deal
-# in the Software without restriction, including without limitation the rights
-# to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-# copies of the Software, and to permit persons to whom the Software is
-# furnished to do so, subject to the following conditions:
-#
-# The above copyright notice and this permission notice shall be included in
-# all copies or substantial portions of the Software.
-#
-# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-# THE SOFTWARE.
-
-# There are {0} active administrative monitors.
-tooltip=\
- В момента има {0} предупреждения.
-Manage\ Jenkins=\
- Управление на Jenkins
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_de.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_de.properties
deleted file mode 100644
index df9d5a8ab8ff..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_de.properties
+++ /dev/null
@@ -1,24 +0,0 @@
-# The MIT License
-#
-# Copyright (c) 2017 Daniel Beck and a number of other of contributors
-#
-# Permission is hereby granted, free of charge, to any person obtaining a copy
-# of this software and associated documentation files (the "Software"), to deal
-# in the Software without restriction, including without limitation the rights
-# to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-# copies of the Software, and to permit persons to whom the Software is
-# furnished to do so, subject to the following conditions:
-#
-# The above copyright notice and this permission notice shall be included in
-# all copies or substantial portions of the Software.
-#
-# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-# THE SOFTWARE.
-
-Manage\ Jenkins=Jenkins verwalten
-tooltip={0,choice,0#Keine Administrator-Warnungen sind|1#{0} Administrator-Warnung ist|1<{0} Administrator-Warnungen sind} aktiv.
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_fr.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_fr.properties
deleted file mode 100644
index 870a942ce747..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_fr.properties
+++ /dev/null
@@ -1,2 +0,0 @@
-tooltip=Il existe {0} moniteurs d''administration activés.
-tooltipSec=Il existe {0} moniteurs d''administration de sécurité activés.
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_it.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_it.properties
deleted file mode 100644
index 9967613a7191..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_it.properties
+++ /dev/null
@@ -1,25 +0,0 @@
-# The MIT License
-#
-# Italian localization plugin for Jenkins
-# Copyright © 2020 Alessandro Menti
-#
-# Permission is hereby granted, free of charge, to any person obtaining a copy
-# of this software and associated documentation files (the "Software"), to deal
-# in the Software without restriction, including without limitation the rights
-# to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-# copies of the Software, and to permit persons to whom the Software is
-# furnished to do so, subject to the following conditions:
-#
-# The above copyright notice and this permission notice shall be included in
-# all copies or substantial portions of the Software.
-#
-# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-# THE SOFTWARE.
-
-Manage\ Jenkins=Gestisci Jenkins
-tooltip=Ci sono {0} monitor amministrativi attivi.
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pl.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pl.properties
deleted file mode 100644
index 963548d361c7..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pl.properties
+++ /dev/null
@@ -1,24 +0,0 @@
-# The MIT License
-#
-# Copyright (c) 2016-2017, Damian Szczepanik
-#
-# Permission is hereby granted, free of charge, to any person obtaining a copy
-# of this software and associated documentation files (the "Software"), to deal
-# in the Software without restriction, including without limitation the rights
-# to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-# copies of the Software, and to permit persons to whom the Software is
-# furnished to do so, subject to the following conditions:
-#
-# The above copyright notice and this permission notice shall be included in
-# all copies or substantial portions of the Software.
-#
-# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-# THE SOFTWARE.
-# There are {0} active administrative monitors.
-tooltip=Znaleziono {0} aktywnych powiadomień dla administratorów
-Manage\ Jenkins=Zarządzaj Jenkinsem
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pt_BR.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pt_BR.properties
deleted file mode 100644
index 103fb02ed797..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_pt_BR.properties
+++ /dev/null
@@ -1,24 +0,0 @@
-# The MIT License
-#
-# Copyright (c) 2004-, Kohsuke Kawaguchi, Sun Microsystems, Inc., and a number of other of contributors
-#
-# Permission is hereby granted, free of charge, to any person obtaining a copy
-# of this software and associated documentation files (the "Software"), to deal
-# in the Software without restriction, including without limitation the rights
-# to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-# copies of the Software, and to permit persons to whom the Software is
-# furnished to do so, subject to the following conditions:
-#
-# The above copyright notice and this permission notice shall be included in
-# all copies or substantial portions of the Software.
-#
-# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-# THE SOFTWARE.
-
-tooltip=Existem {0} monitores administrativos ativos.
-tooltipSec=Existem {0} monitores administrativos de segurança ativos.
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_sv_SE.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_sv_SE.properties
deleted file mode 100644
index 477e8b1001a8..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_sv_SE.properties
+++ /dev/null
@@ -1,2 +0,0 @@
-tooltip=Det finns {0} aktiva administrativa övervakningar.
-tooltipSec=Det finns {0} aktiva säkerhetsadministrativa övervakningar.
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_tr.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_tr.properties
deleted file mode 100644
index 8447c064c4aa..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_tr.properties
+++ /dev/null
@@ -1,25 +0,0 @@
-# The MIT License
-#
-# Copyright (c) 2021, Mustafa Ulu
-#
-# Permission is hereby granted, free of charge, to any person obtaining a copy
-# of this software and associated documentation files (the "Software"), to deal
-# in the Software without restriction, including without limitation the rights
-# to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-# copies of the Software, and to permit persons to whom the Software is
-# furnished to do so, subject to the following conditions:
-#
-# The above copyright notice and this permission notice shall be included in
-# all copies or substantial portions of the Software.
-#
-# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-# THE SOFTWARE.
-
-Manage\ Jenkins=Jenkins''i Yönet
-tooltip={0} adet aktif yönetimsel gösterge var.
-tooltipSec={0} adet aktif yönetimsel güvenlik göstergesi var.
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_zh_TW.properties b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_zh_TW.properties
deleted file mode 100644
index 8fb68379da9f..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/footer_zh_TW.properties
+++ /dev/null
@@ -1,2 +0,0 @@
-tooltip=有 {0} 個啟用中的管理監視器。
-tooltipSec=有 {0} 個啟用中的安全性管理監視器。
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.css b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.css
deleted file mode 100644
index 27540b350d84..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.css
+++ /dev/null
@@ -1,184 +0,0 @@
-.am-container {
- display: contents;
-}
-
-.am-button {
- position: relative;
-}
-
-.am-button .am-monitor__indicator-mobile {
- display: none;
- position: absolute;
- top: 0.25rem;
- right: 0.25rem;
- border-radius: 50%;
- width: 0.65rem;
- height: 0.65rem;
- background-color: var(--warning-color);
-}
-.security-am .am-monitor__indicator-mobile {
- background-color: var(--error-color);
-}
-
-.am-button .am-monitor__count {
- display: inline-flex;
- justify-content: center;
- align-items: center;
- height: 18px;
- min-width: 18px;
-
- color: #fff;
- background-color: var(--warning-color);
- font-weight: var(--font-bold-weight);
- font-size: var(--font-size-xs);
-
- border-radius: 16px;
-}
-.am-button.security-am .am-monitor__count {
- color: #fff;
- background-color: var(--error-color);
-}
-.am-container div.am-list {
- position: absolute;
- top: 48px;
- right: 2%;
- height: auto;
- padding: var(--section-padding);
- text-align: left;
- display: block;
- background-color: var(--background);
- box-shadow: var(--dropdown-box-shadow);
- border-radius: 15px;
- opacity: 0;
- z-index: 0;
- transform: scale(0);
-}
-
-.am-container.am-hidden div.am-list {
- animation: hide-am-list 300ms ease-in 1 normal;
-}
-
-.am-container.visible div.am-list {
- opacity: 1;
- animation: show-am-list 300ms ease-in 1 normal forwards;
- z-index: 1000;
-}
-
-@keyframes show-am-list {
- from {
- opacity: 0;
- visibility: hidden;
- transform: translateY(-10px) scale(0.975);
- }
- to {
- opacity: 1;
- visibility: visible;
- transform: scale(1);
- }
-}
-
-@keyframes hide-am-list {
- from {
- opacity: 1;
- visibility: visible;
- transform: scale(1);
- z-index: 1000;
- }
- to {
- opacity: 0;
- visibility: hidden;
- transform: translateY(-10px) scale(0.975);
- z-index: 1000;
- }
-}
-
-.am-container .am-message {
- display: block;
- line-height: 1.4em;
- margin-bottom: 1.4em;
-}
-.am-container.visible .am-button:after {
- background: var(--button-background--hover);
-}
-
-.am-message-list {
- padding: 0;
- margin: 0;
-}
-
-.am-container .am-message .alert form,
-.am-container .am-message .jenkins-alert form {
- position: relative;
- float: right;
- margin: -6px 0 0 0 !important;
- gap: 0.5rem;
- display: flex;
- padding-left: 0.5rem;
-}
-
-.am-container .am-message .alert form span,
-.am-container .am-message .jenkins-alert form span {
- margin: 0 0 0 4px !important;
-}
-
-.am-container .am-message .alert,
-.am-container .am-message .jenkins-alert {
- margin-bottom: 0 !important;
-}
-
-.am-container .am-message dl dt::after {
- content: ": ";
-}
-
-/* Restore hyperlink style overriden by the page header */
-.am-container .am-list a:link {
- display: inline-block;
- color: var(--link-color);
- text-decoration: underline;
- margin-right: 0;
- padding: 0;
- font-weight: var(--link-font-weight);
-}
-.am-container .am-list a:visited {
- color: var(--link-color);
-}
-.am-container .am-list a:hover,
-.am-container .am-list a:focus,
-.am-container .am-list a:active {
- color: var(--link-color);
- background-color: transparent;
- text-decoration: underline;
- text-decoration: var(--link-text-decoration--hover);
-}
-
-.am-container .am-list .jenkins-alert-success a {
- color: var(--alert-success-text-color);
-}
-
-.am-container .am-list .jenkins-alert-info a {
- color: var(--alert-info-text-color);
-}
-
-.am-container .am-list .jenkins-alert-warning a {
- color: var(--alert-warning-text-color);
-}
-
-.am-container .am-list .jenkins-alert-danger a {
- color: var(--alert-danger-text-color);
-}
-
-@media screen and (max-width: 576px) {
- /* Hide non-security monitors on mobile view to avoid messing up the heading */
- #visible-am-container {
- display: none;
- }
-}
-
-@media screen and (max-width: 768px) {
- .am-button .am-monitor__indicator-mobile {
- display: block;
- }
- .am-button .am-monitor__count {
- display: none;
- }
-}
diff --git a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.js b/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.js
deleted file mode 100644
index 5982e0302570..000000000000
--- a/core/src/main/resources/jenkins/management/AdministrativeMonitorsDecorator/resources.js
+++ /dev/null
@@ -1,128 +0,0 @@
-(function () {
- function initializeAmMonitor(amMonitorRoot, options) {
- var button = amMonitorRoot.querySelector(".am-button");
- var amList = amMonitorRoot.querySelector(".am-list");
- if (button === null || amList === null) {
- return null;
- }
-
- var url = button.getAttribute("data-href");
-
- function onClose(e) {
- var list = amList;
- var el = e.target;
- while (el) {
- if (el === list) {
- return; // clicked in the list
- }
- el = el.parentElement;
- }
- close();
- }
-
- function onEscClose(e) {
- var escapeKeyCode = 27;
- if (e.keyCode === escapeKeyCode) {
- close();
- }
- }
-
- function show() {
- if (options.closeAll) {
- options.closeAll();
- }
-
- fetch(url).then((rsp) => {
- if (rsp.ok) {
- rsp.text().then((responseText) => {
- var popupContent = responseText;
- amList.innerHTML = popupContent;
- amMonitorRoot.classList.add("visible");
- amMonitorRoot.classList.remove("am-hidden");
- document.addEventListener("click", onClose);
- document.addEventListener("keydown", onEscClose);
-
- // Applies all initialization code to the elements within the popup
- // Among other things, this sets the CSRF crumb to the forms within
- Behaviour.applySubtree(amList);
- });
- }
- });
- }
-
- function close() {
- if (amMonitorRoot.classList.contains("visible")) {
- amMonitorRoot.classList.add("am-hidden");
- }
- amMonitorRoot.classList.remove("visible");
- document.removeEventListener("click", onClose);
- document.removeEventListener("keydown", onEscClose);
- }
-
- function toggle(e) {
- if (amMonitorRoot.classList.contains("visible")) {
- close();
- } else {
- show();
- }
- e.preventDefault();
- }
-
- function startListeners() {
- button.addEventListener("click", toggle);
- }
-
- return {
- close: close,
- startListeners: startListeners,
- };
- }
-
- document.addEventListener("DOMContentLoaded", function () {
- var monitorWidgets;
-
- function closeAll() {
- monitorWidgets.forEach(function (widget) {
- widget.close();
- });
- }
-
- var normalMonitors = initializeAmMonitor(
- document.getElementById("visible-am-container"),
- {
- closeAll: closeAll,
- },
- );
- var securityMonitors = initializeAmMonitor(
- document.getElementById("visible-sec-am-container"),
- {
- closeAll: closeAll,
- },
- );
- monitorWidgets = [normalMonitors, securityMonitors].filter(
- function (widget) {
- return widget !== null;
- },
- );
-
- monitorWidgets.forEach(function (widget) {
- widget.startListeners();
- });
- });
-})();
-
-document.addEventListener("DOMContentLoaded", function () {
- var amContainer = document.getElementById("visible-am-container");
- var amInsertion = document.getElementById("visible-am-insertion");
-
- if (amInsertion) {
- amInsertion.appendChild(amContainer);
- }
-
- var secAmContainer = document.getElementById("visible-sec-am-container");
- var secAmInsertion = document.getElementById("visible-sec-am-insertion");
-
- if (secAmInsertion) {
- secAmInsertion.appendChild(secAmContainer);
- }
-});
diff --git a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
index 1c222a5e8427..0b0aa13c4127 100644
--- a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
+++ b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
@@ -7,12 +7,17 @@
${it.user.fullName}
-
-
-
- ${%Configure}
-
+
+
+
+
+ ${action.displayName}
+
+
From 2ea0b1f867c3f3ae446c81ae780a8eb8a28c3d88 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Fri, 31 Jan 2025 10:44:10 +0100
Subject: [PATCH 52/96] Update with HeaderAction
---
.../main/java/jenkins/views/FullHeader.java | 6 ++-
.../main/java/jenkins/views/HeaderAction.java | 42 +++++++++++++++++++
.../views/JenkinsHeader/headerContent.jelly | 6 +--
3 files changed, 50 insertions(+), 4 deletions(-)
create mode 100644 core/src/main/java/jenkins/views/HeaderAction.java
diff --git a/core/src/main/java/jenkins/views/FullHeader.java b/core/src/main/java/jenkins/views/FullHeader.java
index aa69ae0dca79..d498257e3afe 100644
--- a/core/src/main/java/jenkins/views/FullHeader.java
+++ b/core/src/main/java/jenkins/views/FullHeader.java
@@ -2,6 +2,8 @@
import hudson.model.Action;
import java.util.List;
+
+import hudson.model.RootAction;
import jenkins.model.Jenkins;
import org.kohsuke.accmod.Restricted;
import org.kohsuke.accmod.restrictions.NoExternalUse;
@@ -24,11 +26,13 @@ public boolean isCompatible() {
* @return a list of {@link Action} to show in the header, defaults to {@link hudson.model.RootAction} extensions
*/
@Restricted(NoExternalUse.class)
- public List getActions() {
+ public List getActions() {
return Jenkins.get()
.getActions()
.stream()
.filter(e -> e.getIconFileName() != null)
+ .map(e -> (RootAction) e)
+ .map(e -> new HeaderAction(e.getDisplayName(), e.getIconFileName(), e.getUrlName(), e.getBadge()))
.toList();
}
}
diff --git a/core/src/main/java/jenkins/views/HeaderAction.java b/core/src/main/java/jenkins/views/HeaderAction.java
new file mode 100644
index 000000000000..68e924cfcb1f
--- /dev/null
+++ b/core/src/main/java/jenkins/views/HeaderAction.java
@@ -0,0 +1,42 @@
+package jenkins.views;
+
+import edu.umd.cs.findbugs.annotations.NonNull;
+import jenkins.management.Badge;
+import org.jenkins.ui.icon.IconSpec;
+
+public class HeaderAction implements IconSpec {
+
+ private final @NonNull String displayName;
+
+ private final @NonNull String iconClassName;
+
+ private final String url;
+
+ private final Badge badge;
+
+ public HeaderAction(@NonNull String displayName, @NonNull String iconClassName, String url, Badge badge) {
+ this.displayName = displayName;
+ this.iconClassName = iconClassName;
+ this.url = url;
+ this.badge = badge;
+ }
+
+ @NonNull
+ public String getDisplayName() {
+ return displayName;
+ }
+
+ public String getUrl() {
+ return url;
+ }
+
+ public Badge getBadge() {
+ return badge;
+ }
+
+ @Override
+ @NonNull
+ public String getIconClassName() {
+ return iconClassName;
+ }
+}
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 1a660395660e..8b7f853b464a 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -32,9 +32,9 @@
-
+
@@ -73,7 +73,7 @@
${interactive ? 'dropdown' : 'tooltip'}
false
jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
-
From 19b4f2713fc6bcff35a145d1e136612149b3d36e Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 12:39:34 +0100
Subject: [PATCH 53/96] Revert "Update with HeaderAction"
This reverts commit 2ea0b1f867c3f3ae446c81ae780a8eb8a28c3d88.
---
.../main/java/jenkins/views/FullHeader.java | 6 +--
.../main/java/jenkins/views/HeaderAction.java | 42 -------------------
.../views/JenkinsHeader/headerContent.jelly | 6 +--
3 files changed, 4 insertions(+), 50 deletions(-)
delete mode 100644 core/src/main/java/jenkins/views/HeaderAction.java
diff --git a/core/src/main/java/jenkins/views/FullHeader.java b/core/src/main/java/jenkins/views/FullHeader.java
index d498257e3afe..aa69ae0dca79 100644
--- a/core/src/main/java/jenkins/views/FullHeader.java
+++ b/core/src/main/java/jenkins/views/FullHeader.java
@@ -2,8 +2,6 @@
import hudson.model.Action;
import java.util.List;
-
-import hudson.model.RootAction;
import jenkins.model.Jenkins;
import org.kohsuke.accmod.Restricted;
import org.kohsuke.accmod.restrictions.NoExternalUse;
@@ -26,13 +24,11 @@ public boolean isCompatible() {
* @return a list of {@link Action} to show in the header, defaults to {@link hudson.model.RootAction} extensions
*/
@Restricted(NoExternalUse.class)
- public List getActions() {
+ public List getActions() {
return Jenkins.get()
.getActions()
.stream()
.filter(e -> e.getIconFileName() != null)
- .map(e -> (RootAction) e)
- .map(e -> new HeaderAction(e.getDisplayName(), e.getIconFileName(), e.getUrlName(), e.getBadge()))
.toList();
}
}
diff --git a/core/src/main/java/jenkins/views/HeaderAction.java b/core/src/main/java/jenkins/views/HeaderAction.java
deleted file mode 100644
index 68e924cfcb1f..000000000000
--- a/core/src/main/java/jenkins/views/HeaderAction.java
+++ /dev/null
@@ -1,42 +0,0 @@
-package jenkins.views;
-
-import edu.umd.cs.findbugs.annotations.NonNull;
-import jenkins.management.Badge;
-import org.jenkins.ui.icon.IconSpec;
-
-public class HeaderAction implements IconSpec {
-
- private final @NonNull String displayName;
-
- private final @NonNull String iconClassName;
-
- private final String url;
-
- private final Badge badge;
-
- public HeaderAction(@NonNull String displayName, @NonNull String iconClassName, String url, Badge badge) {
- this.displayName = displayName;
- this.iconClassName = iconClassName;
- this.url = url;
- this.badge = badge;
- }
-
- @NonNull
- public String getDisplayName() {
- return displayName;
- }
-
- public String getUrl() {
- return url;
- }
-
- public Badge getBadge() {
- return badge;
- }
-
- @Override
- @NonNull
- public String getIconClassName() {
- return iconClassName;
- }
-}
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 8b7f853b464a..1a660395660e 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -32,9 +32,9 @@
-
+
@@ -73,7 +73,7 @@
${interactive ? 'dropdown' : 'tooltip'}
false
jenkins-button ${isCurrent ? '' : 'jenkins-button--tertiary'}
-
From 08750389143b9700f93b08d8d18c29fd45c540df Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 12:46:32 +0100
Subject: [PATCH 54/96] Tidy
---
core/src/main/java/hudson/model/MyViewsProperty.java | 1 -
src/main/scss/abstracts/_theme.scss | 12 ------------
2 files changed, 13 deletions(-)
diff --git a/core/src/main/java/hudson/model/MyViewsProperty.java b/core/src/main/java/hudson/model/MyViewsProperty.java
index ec2c826a6d83..9a6d444a750f 100644
--- a/core/src/main/java/hudson/model/MyViewsProperty.java
+++ b/core/src/main/java/hudson/model/MyViewsProperty.java
@@ -301,7 +301,6 @@ public MyViewsTabBar getMyViewsTabBar() {
return Jenkins.get().getMyViewsTabBar();
}
- // TODO - Do we want this?
@Symbol("myView")
public static class GlobalAction implements RootAction {
diff --git a/src/main/scss/abstracts/_theme.scss b/src/main/scss/abstracts/_theme.scss
index b4a8cf3496e5..44cfd65c1c32 100644
--- a/src/main/scss/abstracts/_theme.scss
+++ b/src/main/scss/abstracts/_theme.scss
@@ -71,18 +71,6 @@ $semantics: (
// Header
--header-background: var(--background);
- // Header - deprecated
- --brand-link-color: var(--secondary);
- --header-link-color: var(--white);
- --header-bg-classic: var(--black);
- --header-link-bg-classic-hover: #404040;
- --header-link-bg-classic-active: #404040;
-
- // Breadcrumbs bar
- --breadcrumbs-bar-background: oklch(
- from var(--text-color) 96.8% 0.005 h / 0.8
- );
-
// App bar
--bottom-app-bar-shadow: color-mix(
in sRGB,
From a9c648d3f2dd895b3572393a0d14b625bff50c7d Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 12:47:20 +0100
Subject: [PATCH 55/96] Update RootAction.java
---
core/src/main/java/hudson/model/RootAction.java | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/core/src/main/java/hudson/model/RootAction.java b/core/src/main/java/hudson/model/RootAction.java
index f9659fef5903..8226e67507f7 100644
--- a/core/src/main/java/hudson/model/RootAction.java
+++ b/core/src/main/java/hudson/model/RootAction.java
@@ -42,10 +42,10 @@
public interface RootAction extends Action, ExtensionPoint {
/**
- * A {@link Badge} shown as overlay over the icon on "Manage Jenkins".
+ * A {@link Badge} shown on the button for the action.
*
* @return badge or {@code null} if no badge should be shown.
- * @since 2.385
+ * @since TODO
*/
default @CheckForNull Badge getBadge() {
return null;
From 9feda448f9b737c58cb937b322ae79a89dc8ae02 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 12:55:13 +0100
Subject: [PATCH 56/96] Update _breadcrumbs.scss
---
src/main/scss/components/_breadcrumbs.scss | 4 +---
1 file changed, 1 insertion(+), 3 deletions(-)
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index 9363c9cfa598..49677940b5ae 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -35,7 +35,6 @@
align-items: center;
justify-content: center;
gap: 1rem;
- font-weight: 500;
font-size: var(--font-size-sm);
margin: 0;
padding: 0;
@@ -82,8 +81,7 @@
mask-position: center;
mask-repeat: no-repeat;
mask-image: url("data:image/svg+xml,%3Csvg width='10' height='20' viewBox='0 0 10 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 18L8 2' stroke='black' stroke-width='1.5px' stroke-linecap='round'/%3E%3C/svg%3E%0A");
- opacity: 0.2;
- scale: 1.1;
+ opacity: 0.3;
}
&:last-of-type {
From 56a808fcee900bf5e917bfe03a4e5bd1c31a48a5 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 14:32:30 +0100
Subject: [PATCH 57/96] Push
---
.../resources/jenkins/views/JenkinsHeader/headerContent.jelly | 4 ++++
src/main/scss/components/_breadcrumbs.scss | 4 ++++
2 files changed, 8 insertions(+)
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 1a660395660e..14a3a4a19332 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -3,6 +3,8 @@
-
+
+
+
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index 49677940b5ae..0f7c0ff46481 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -10,6 +10,10 @@
&__list {
display: contents;
+ & > * {
+ z-index: 1;
+ }
+
&-item {
display: contents;
From 025a59653b935e96e4e8814a22d3629d1a510fdd Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 17:18:34 +0100
Subject: [PATCH 58/96] Update _header.scss
---
src/main/scss/components/_header.scss | 7 +++++++
1 file changed, 7 insertions(+)
diff --git a/src/main/scss/components/_header.scss b/src/main/scss/components/_header.scss
index 9d3f1441e501..863528dac47f 100644
--- a/src/main/scss/components/_header.scss
+++ b/src/main/scss/components/_header.scss
@@ -4,6 +4,7 @@
--background-opacity: 0%;
--background-blur: 0;
--border-opacity: 0%;
+ --header-color: var(--text-color);
position: sticky;
top: 0;
@@ -14,6 +15,7 @@
font-size: var(--font-size-base);
line-height: var(--line-height-base);
min-height: 4.375rem;
+ color: var(--header-color);
&::before {
content: "";
@@ -40,6 +42,11 @@
margin-left: 0.15rem;
}
+ // For customizable-header-plugin
+ .jenkins-button {
+ color: inherit !important;
+ }
+
&__actions {
display: flex;
align-items: center;
From 1e67e709c4e4c435f42f7666fef8f72633ba1da2 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 17:25:05 +0100
Subject: [PATCH 59/96] Update _header.scss
---
src/main/scss/components/_header.scss | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/main/scss/components/_header.scss b/src/main/scss/components/_header.scss
index 863528dac47f..4a694bf26f34 100644
--- a/src/main/scss/components/_header.scss
+++ b/src/main/scss/components/_header.scss
@@ -66,8 +66,8 @@
img {
border-radius: 100px;
- width: 1.375rem;
- height: 1.375rem;
+ width: 1.5rem;
+ height: 1.5rem;
outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
background: color-mix(in srgb, var(--text-color) 5%, transparent);
outline-offset: -1px;
From 4a60bb72ae7e6b6a131c0378d88b7fe7e8e4a68e Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 17:35:07 +0100
Subject: [PATCH 60/96] Fix invisible actions not actually being invisible,
make avatar huge to please Tim
---
.../jenkins/model/navigation/UserAction.java | 25 +++++++++++--------
src/main/scss/components/_header.scss | 4 +--
2 files changed, 17 insertions(+), 12 deletions(-)
diff --git a/core/src/main/java/jenkins/model/navigation/UserAction.java b/core/src/main/java/jenkins/model/navigation/UserAction.java
index c10aa6356ca8..4c228d7f12b7 100644
--- a/core/src/main/java/jenkins/model/navigation/UserAction.java
+++ b/core/src/main/java/jenkins/model/navigation/UserAction.java
@@ -34,41 +34,46 @@
import org.kohsuke.accmod.restrictions.NoExternalUse;
import java.util.ArrayList;
-import java.util.Collections;
-import java.util.LinkedList;
import java.util.List;
/**
- * TODO
+ * Display the user avatar in the navigation bar.
+ * Provides a handy jumplist for common user actions.
*/
@Extension(ordinal = -1)
public class UserAction implements RootAction {
@Override
public String getIconFileName() {
- if (User.current() == null) {
+ User current = User.current();
+
+ if (current == null) {
return null;
}
- return getAvatar(User.current(), "96x96");
+ return getAvatar(current, "96x96");
}
@Override
public String getDisplayName() {
- if (User.current() == null) {
+ User current = User.current();
+
+ if (current == null) {
return null;
}
- return User.current().getFullName();
+ return current.getFullName();
}
@Override
public String getUrlName() {
- if (User.current() == null) {
+ User current = User.current();
+
+ if (current == null) {
return null;
}
- return User.current().getUrl();
+ return current.getUrl();
}
@Restricted(NoExternalUse.class)
@@ -87,6 +92,6 @@ public List getActions() {
List actions = new ArrayList<>();
actions.addAll(current.getPropertyActions());
actions.addAll(current.getTransientActions());
- return Collections.unmodifiableList(actions);
+ return actions.stream().filter(e -> e.getIconFileName() != null).toList();
}
}
diff --git a/src/main/scss/components/_header.scss b/src/main/scss/components/_header.scss
index 4a694bf26f34..93188b236a28 100644
--- a/src/main/scss/components/_header.scss
+++ b/src/main/scss/components/_header.scss
@@ -66,8 +66,8 @@
img {
border-radius: 100px;
- width: 1.5rem;
- height: 1.5rem;
+ width: 1.625rem;
+ height: 1.625rem;
outline: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
background: color-mix(in srgb, var(--text-color) 5%, transparent);
outline-offset: -1px;
From 4a3f71a588f87832c4283b2aa4832af97a50bdaa Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 17:43:11 +0100
Subject: [PATCH 61/96] Tidy
---
.../jenkins/management/AdministrativeMonitorsDecorator.java | 3 ---
src/main/scss/components/_header.scss | 2 +-
2 files changed, 1 insertion(+), 4 deletions(-)
diff --git a/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java b/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java
index d531f898c065..0b557c91c6a4 100644
--- a/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java
+++ b/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java
@@ -56,9 +56,6 @@ public class AdministrativeMonitorsDecorator extends PageDecorator {
public AdministrativeMonitorsDecorator() {
// otherwise this would be added to every internal context menu building request
ignoredJenkinsRestOfUrls.add("contextMenu");
-
- // don't show here to allow admins to disable malfunctioning monitors via AdministrativeMonitorsDecorator
- ignoredJenkinsRestOfUrls.add("configure");
}
@NonNull
diff --git a/src/main/scss/components/_header.scss b/src/main/scss/components/_header.scss
index 93188b236a28..70608908b86f 100644
--- a/src/main/scss/components/_header.scss
+++ b/src/main/scss/components/_header.scss
@@ -57,7 +57,7 @@
.jenkins-button {
min-width: 2.375rem;
min-height: 2.375rem;
- padding: 0.5rem;
+ padding: 0;
svg {
width: 1.25rem;
From abdb235bf719be3d2ee2e9848b409a4c32539c47 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sat, 1 Feb 2025 21:04:48 +0000
Subject: [PATCH 62/96] Push
---
core/src/main/java/jenkins/views/PartialHeader.java | 2 +-
.../jenkins/views/JenkinsHeader/headerContent.jelly | 2 +-
.../main/resources/jenkins/views/JenkinsHeader/logo.jelly | 5 +++++
src/main/scss/components/_breadcrumbs.scss | 1 +
4 files changed, 8 insertions(+), 2 deletions(-)
create mode 100644 core/src/main/resources/jenkins/views/JenkinsHeader/logo.jelly
diff --git a/core/src/main/java/jenkins/views/PartialHeader.java b/core/src/main/java/jenkins/views/PartialHeader.java
index 964ccbb3b0af..7a19468e6d12 100644
--- a/core/src/main/java/jenkins/views/PartialHeader.java
+++ b/core/src/main/java/jenkins/views/PartialHeader.java
@@ -25,7 +25,7 @@ public abstract class PartialHeader extends Header {
*
* Increment this number when an incompatible change is made to the header (like the search form API).
*/
- private static final int compatibilityHeaderVersion = 1;
+ private static final int compatibilityHeaderVersion = 2;
@Override
public final boolean isCompatible() {
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 14a3a4a19332..234bb3c82402 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -13,7 +13,7 @@
-
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/logo.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/logo.jelly
new file mode 100644
index 000000000000..7030e059d5fb
--- /dev/null
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/logo.jelly
@@ -0,0 +1,5 @@
+
+
+
+ Jenkins
+
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index 0f7c0ff46481..d95628012fd5 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -51,6 +51,7 @@
& > a {
@include mixins.item($border: false);
+ --item-background: transparent;
--item-background--hover: transparent;
--item-background--active: transparent;
--item-box-shadow--focus: transparent;
From 950cdee965e027f169420a1bb4e1fbff92bcd8f2 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 2 Feb 2025 21:44:28 +0000
Subject: [PATCH 63/96] Fix breadcrumbs + notification
---
.../jenkins/management/AdministrativeMonitorsDecorator.java | 5 -----
.../jenkins/views/JenkinsHeader/headerContent.jelly | 2 +-
2 files changed, 1 insertion(+), 6 deletions(-)
diff --git a/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java b/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java
index 0b557c91c6a4..60cdbd5e901e 100644
--- a/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java
+++ b/core/src/main/java/jenkins/management/AdministrativeMonitorsDecorator.java
@@ -160,11 +160,6 @@ public Collection getMonitorsToDisplay() {
return null;
}
- // Don't show on Manage Jenkins
- if (o instanceof ManageJenkinsAction) {
- return null;
- }
-
// don't show for some URLs served directly by Jenkins
if (o instanceof Jenkins) {
String url = a.getRestOfUrl();
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 234bb3c82402..0f2c1022672d 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -27,7 +27,7 @@
-
From 5bd87dc98ea9364c02690e3557f616e269acc7be Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 2 Feb 2025 22:20:19 +0000
Subject: [PATCH 64/96] Update jumplist.jelly
---
.../jenkins/model/navigation/UserAction/jumplist.jelly | 4 +---
1 file changed, 1 insertion(+), 3 deletions(-)
diff --git a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
index 0b0aa13c4127..c55f2d07709c 100644
--- a/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
+++ b/core/src/main/resources/jenkins/model/navigation/UserAction/jumplist.jelly
@@ -21,9 +21,7 @@
-
${%Sign out}
From ef847c995521f32bac3ef86b8355146b43008ff4 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Sun, 2 Feb 2025 22:56:29 +0000
Subject: [PATCH 65/96] =?UTF-8?q?Getting=20there=20=F0=9F=9A=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../resources/hudson/AboutJenkins/index.jelly | 30 +++++++++-
.../views/JenkinsHeader/headerContent.jelly | 12 ++++
src/main/js/app.js | 2 -
src/main/js/components/header/index.js | 36 ++++++++++++
src/main/scss/components/_breadcrumbs.scss | 2 +-
src/main/scss/components/_header.scss | 58 +++++++++----------
webpack.config.js | 1 +
7 files changed, 107 insertions(+), 34 deletions(-)
diff --git a/core/src/main/resources/hudson/AboutJenkins/index.jelly b/core/src/main/resources/hudson/AboutJenkins/index.jelly
index 6d589663f576..0efee9644cef 100644
--- a/core/src/main/resources/hudson/AboutJenkins/index.jelly
+++ b/core/src/main/resources/hudson/AboutJenkins/index.jelly
@@ -29,7 +29,35 @@ THE SOFTWARE.
-
+
diff --git a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
index 0f2c1022672d..97c7a9a21f8a 100644
--- a/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
+++ b/core/src/main/resources/jenkins/views/JenkinsHeader/headerContent.jelly
@@ -1,5 +1,7 @@
+
+