-
-
-
- ${%Progress}:
- |
-
-
- |
-
-
-
-
- |
-
-
+ ${%Progress}:
+
+
+
+
diff --git a/core/src/main/resources/lib/hudson/progressBar.jelly b/core/src/main/resources/lib/hudson/progressBar.jelly
index 2aa585cc6cd8..15d83fcedf51 100644
--- a/core/src/main/resources/lib/hudson/progressBar.jelly
+++ b/core/src/main/resources/lib/hudson/progressBar.jelly
@@ -22,29 +22,37 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
-->
-
-
-
+
+
+
+ 0-100 to indicates the current progress. -1 if the progress is unknown
+
+
+ if set, the progress bar becomes a hyperlink
+
+
+ if set to non-null, the progress bar will be drawn in red, to indicate that the processing is likely stuck.
+
+
+ If set, id will be the identifier for the component
+
+
+
+
+ jenkins-progress-bar ${attrs.red ? 'jenkins-progress-bar--error' : null}
+ ${attrs.href}
+ ${attrs.id}
+
-
- |
+
-
- |
- |
-
-
+
-
-
\ No newline at end of file
+
+
diff --git a/core/src/main/resources/lib/layout/progressiveRendering.jelly b/core/src/main/resources/lib/layout/progressiveRendering.jelly
index fa774db2c367..914b348139c4 100644
--- a/core/src/main/resources/lib/layout/progressiveRendering.jelly
+++ b/core/src/main/resources/lib/layout/progressiveRendering.jelly
@@ -36,7 +36,7 @@ THE SOFTWARE.
-
+
diff --git a/war/src/main/scss/base/_style.scss b/war/src/main/scss/base/_style.scss
index 18ac866476e7..839546fdfd09 100644
--- a/war/src/main/scss/base/_style.scss
+++ b/war/src/main/scss/base/_style.scss
@@ -574,11 +574,9 @@ div.listview-jobs {
text-decoration: underline;
}
-.pane.build-details a,
-.pane.build-details a:visited {
- color: var(--pane-link-color--visited);
- opacity: 0.6;
- text-decoration: none;
+.pane.build-details a {
+ color: var(--text-color-secondary) !important;
+ text-decoration: none !important;
}
.pane.build-details a:hover {
diff --git a/war/src/main/scss/components/_spinner.scss b/war/src/main/scss/components/_spinner.scss
index a538e89c355c..eea7715b2d6f 100644
--- a/war/src/main/scss/components/_spinner.scss
+++ b/war/src/main/scss/components/_spinner.scss
@@ -88,3 +88,64 @@
transform: scale(0.75);
}
}
+
+.jenkins-progress-bar {
+ --color: var(--accent-color);
+
+ display: inline-flex;
+ background: color-mix(in srgb, var(--text-color-secondary) 25%, transparent);
+ border-radius: 100px;
+ width: 100px;
+ height: 4px;
+ overflow: hidden;
+ transition: opacity var(--standard-transition);
+
+ &--error {
+ --color: var(--error-color);
+ }
+
+ &__precise {
+ appearance: none;
+ height: 100%;
+
+ &::-webkit-progress-bar {
+ background: transparent;
+ border-radius: 10px;
+ }
+
+ &::-webkit-progress-value {
+ background: var(--color);
+ border-radius: 10px;
+ min-width: 4px;
+ }
+ }
+
+ &__indeterminate {
+ & > div {
+ width: 50px;
+ height: 100%;
+ border-radius: 10px;
+ background: var(--color);
+ animation: animate-progress-indeterminate 1.2s linear infinite;
+
+ @keyframes animate-progress-indeterminate {
+ from {
+ translate: -100% 0;
+ }
+ to {
+ translate: 100px 0;
+ }
+ }
+ }
+ }
+
+ &:link {
+ &:hover {
+ opacity: 0.75;
+ }
+
+ &:active {
+ opacity: 0.5;
+ }
+ }
+}
diff --git a/war/src/main/scss/pages/_index.scss b/war/src/main/scss/pages/_index.scss
index 8e019eebb7b0..aa4479f440c3 100644
--- a/war/src/main/scss/pages/_index.scss
+++ b/war/src/main/scss/pages/_index.scss
@@ -1,6 +1,7 @@
@use "about";
@use "dashboard";
@use "icon-legend";
+@use "job";
@use "manage-jenkins";
@use "plugin-manager";
@use "setupWizardFirstUser";
diff --git a/war/src/main/scss/pages/_job.scss b/war/src/main/scss/pages/_job.scss
new file mode 100644
index 000000000000..6ddae2bffe48
--- /dev/null
+++ b/war/src/main/scss/pages/_job.scss
@@ -0,0 +1,6 @@
+.build-caption-progress-container {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 10px;
+}