From e4905a04b6a87fcb90a7509f811798fef397df49 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 15:55:33 +0000
Subject: [PATCH 1/5] Init

---
 src/main/scss/abstracts/_theme.scss           |  75 +-----------
 .../scss/components/_buttons-deprecated.scss  | 111 ------------------
 src/main/scss/components/_index.scss          |   1 -
 src/main/scss/components/_tabs.scss           |  15 ---
 4 files changed, 3 insertions(+), 199 deletions(-)
 delete mode 100644 src/main/scss/components/_buttons-deprecated.scss

diff --git a/src/main/scss/abstracts/_theme.scss b/src/main/scss/abstracts/_theme.scss
index 9013839fb804..18b15399ba21 100644
--- a/src/main/scss/abstracts/_theme.scss
+++ b/src/main/scss/abstracts/_theme.scss
@@ -57,16 +57,9 @@ $semantics: (
   --focus-input-border: var(--accent-color);
   --focus-input-glow: color-mix(in sRGB, var(--accent-color) 15%, transparent);
 
-  // Deprecated
-  --focus-btn-primary: #{color.change(#0b6aa2, $alpha: 0.5)};
-  --focus-btn-secondary: #{color.change(#0b6aa2, $alpha: 0.5)};
-  --focus-btn-danger: #{color.change(#cc0003, $alpha: 0.5)};
-
   // State colors
-  --primary-hover: #0587d4;
-  --primary-active: #095683;
-  --danger-hover: #eb383b;
-  --danger-active: #b50003;
+  --primary-hover: var(--accent-color);
+  --primary-active: var(--accent-color);
 
   // Status icon colors
   --weather-icon-color: var(--accent-color);
@@ -78,16 +71,9 @@ $semantics: (
   // 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;
 
   // Breadcrumbs bar
   --breadcrumbs-bar-background: oklch(
@@ -139,39 +125,6 @@ $semantics: (
   // Typography
   --text-color-secondary: var(--secondary);
 
-  // Deprecated - Button generic
-  --btn-font-weight: bold;
-  --btn-text-color: var(--white);
-  --btn-font-size: var(--font-size-xs);
-  --btn-line-height: 1rem;
-  --btn-large-font-size: var(--font-size-sm);
-  --btn-large-line-height: 1.25rem;
-  // Deprecated - Button primary
-  --button-color--primary: var(--background);
-  --btn-primary-bg: #063f61;
-  --btn-primary-bg-hover: #{lighten(#063f61, 7.5%)};
-  --btn-primary-bg-active: #{lighten(#063f61, 12%)};
-  // Deprecated - Button primary
-  --btn-secondary-color: var(--secondary);
-  --btn-secondary-bg: var(--btn-text-color);
-  --btn-secondary-border: var(--medium-grey);
-  --btn-secondary-color--hover: var(--accent-color);
-  --btn-secondary-bg--hover: var(--btn-secondary-bg);
-  --btn-secondary-border--hover: var(--accent-color);
-  --btn-secondary-color--focus: var(--accent-color);
-  --btn-secondary-bg--focus: var(--btn-secondary-bg);
-  --btn-secondary-border--focus: var(--accent-color);
-  --btn-secondary-color--active: var(--primary-active);
-  --btn-secondary-bg--active: var(--btn-secondary-bg);
-  --btn-secondary-border--active: var(--primary-active);
-  // Deprecated - Button link
-  --btn-link-color: var(--accent-color);
-  --btn-link-font-weight: var(--link-font-weight);
-  --btn-link-color--hover: var(--primary-hover);
-  --btn-link-bg--hover: var(--very-light-grey);
-  --btn-link-color--active: var(--primary-active);
-  --btn-link-bg--active: var(--light-grey);
-
   // Table
   --table-background: oklch(from var(--text-color-secondary) l c h / 0.1);
   --table-header-foreground: var(--text-color);
@@ -280,18 +233,10 @@ $semantics: (
   --tabs-item-foreground--selected: var(--link-color);
   --tabs-border-radius: calc((10px + 34px) / 2);
 
-  // Deprecated - Tabbar baseline
-  --tab-baseline-width: 2px;
-  --tab-baseline-color: var(--light-grey);
-  --tab-baseline-default-display: none;
-
   // Side panel
   --side-panel-width: 340px;
   --panel-header-bg-color: var(--light-grey);
   --panel-border-color: var(--light-grey);
-  --side-panel-hover-color: var(--panel-border-color);
-  --task-link-bg-color--active: var(--panel-border-color);
-  --task-link-bg-color--hover: var(--very-light-grey);
 
   // Form
   --section-padding: 1.625rem;
@@ -336,24 +281,9 @@ $semantics: (
   --standard-transition: 0.3s ease;
   --elastic-transition: 0.3s cubic-bezier(0, 0.68, 0.5, 1.5);
 
-  // Deprecated - Pop out menus
-  --menu-text-color: black;
-  --menu-bg-color: var(--white);
-  --menu-selected-color: #b3d4ff;
-  --menu-box-shadow: 0 3px 10px rgb(0 0 0 / 0.3);
-
-  // Deprecated - Add form widget / configure job
-  --light-bg-color: #eee;
-  --light-bg-color--hover: rgb(255 255 255 / 0.65);
-  --add-item-btn-decorator-border-color: #acb;
-  --add-item-btn-decorator-bg-color: rgb(245 249 239 / 0.75);
-
   // Plugin manager
   --plugin-manager-bg-color-already-upgraded: var(--light-grey);
 
-  // Auto complete
-  --auto-complete-bg-color--prehighlight: #b3d4ff;
-
   // Default button
   --button-background: oklch(from var(--text-color-secondary) l c h / 0.075);
   --button-background--hover: oklch(
@@ -365,6 +295,7 @@ $semantics: (
   --button-box-shadow--focus: oklch(
     from var(--text-color-secondary) l c h / 0.1
   );
+  --button-color--primary: var(--background);
 
   // Variables for sidebar items, card items
   --item-background--hover: oklch(from var(--text-color-secondary) l c h / 0.1);
diff --git a/src/main/scss/components/_buttons-deprecated.scss b/src/main/scss/components/_buttons-deprecated.scss
deleted file mode 100644
index b28756d267f6..000000000000
--- a/src/main/scss/components/_buttons-deprecated.scss
+++ /dev/null
@@ -1,111 +0,0 @@
-// Button: variant mixins
-
-@mixin button-danger {
-  color: var(--btn-text-color);
-  background-color: var(--destructive-color);
-  border-color: var(--destructive-color);
-
-  &:hover,
-  &:focus {
-    color: var(--btn-text-color);
-    background-color: var(--danger-hover);
-    border-color: var(--danger-hover);
-  }
-
-  &:focus {
-    box-shadow: 0 0 0 0.2rem var(--focus-btn-danger);
-  }
-
-  &:active {
-    color: var(--btn-text-color);
-    background-color: var(--danger-active);
-    border-color: var(--danger-active);
-  }
-}
-
-@mixin button-primary {
-  color: var(--btn-text-color);
-  background-color: var(--btn-primary-bg);
-  border-color: var(--btn-primary-bg);
-
-  &:hover,
-  &:focus {
-    color: var(--btn-text-color);
-    background-color: var(--btn-primary-bg-hover);
-    border-color: var(--btn-primary-bg-hover);
-  }
-
-  &:focus {
-    box-shadow: 0 0 0 0.2rem var(--focus-btn-primary);
-  }
-
-  &:active {
-    color: var(--btn-text-color);
-    background-color: var(--btn-primary-bg-active);
-    border-color: var(--btn-primary-bg-active);
-  }
-}
-
-@mixin button-secondary {
-  color: var(--btn-secondary-color);
-  border-color: var(--btn-secondary-border);
-  background-color: var(--btn-secondary-bg);
-
-  &:focus {
-    color: var(--btn-secondary-color--focus);
-    border-color: var(--btn-secondary-border--focus);
-    background-color: var(--btn-secondary-bg--focus);
-    box-shadow: 0 0 0 0.2rem var(--focus-btn-secondary);
-  }
-
-  // Hover MUST be AFTER the focus declaration for this outlined button.
-  // Otherwise, the hover styles will not be applied when hovering over a focused element
-  &:hover {
-    color: var(--btn-secondary-color--hover);
-    border-color: var(--btn-secondary-border--hover);
-    background-color: var(--btn-secondary-bg--hover);
-  }
-
-  &:active {
-    color: var(--btn-secondary-color--active);
-    border-color: var(--btn-secondary-border--active);
-    background-color: var(--btn-secondary-bg--active);
-  }
-}
-
-@mixin button-link {
-  color: var(--accent-color);
-  background-color: transparent;
-  border-color: transparent;
-  font-weight: var(--btn-link-font-weight);
-
-  &:hover,
-  &:focus {
-    color: var(--btn-link-color--hover);
-    background-color: var(--btn-link-bg--hover);
-    border-color: var(--btn-link-bg--hover);
-  }
-
-  &:focus {
-    box-shadow: none;
-  }
-
-  &:active {
-    color: var(--btn-link-color--active);
-    background-color: var(--btn-link-bg--active);
-    border-color: var(--btn-link-bg--active);
-  }
-}
-
-.button-link {
-  @include button-link;
-}
-
-@mixin button-disabled {
-  opacity: 0.5;
-  pointer-events: none;
-}
-
-.button-disabled {
-  @include button-disabled;
-}
diff --git a/src/main/scss/components/_index.scss b/src/main/scss/components/_index.scss
index d9c4133a2730..821805c17c57 100644
--- a/src/main/scss/components/_index.scss
+++ b/src/main/scss/components/_index.scss
@@ -3,7 +3,6 @@
 @use "badges";
 @use "breadcrumbs";
 @use "buttons";
-@use "buttons-deprecated";
 @use "cards";
 @use "command-palette";
 @use "content-blocks";
diff --git a/src/main/scss/components/_tabs.scss b/src/main/scss/components/_tabs.scss
index 0e54d9646a99..94744aa8367c 100644
--- a/src/main/scss/components/_tabs.scss
+++ b/src/main/scss/components/_tabs.scss
@@ -72,21 +72,6 @@
   cursor: default;
 }
 
-.tabBarBaseline {
-  border-top: var(--tab-baseline-width) solid var(--tab-baseline-color);
-  z-index: 1;
-  position: absolute;
-  bottom: 0;
-  width: 100%;
-
-  /* Baseline is hidden by default.  See next rule fo adding visibility. */
-  display: var(--tab-baseline-default-display, none);
-}
-
-.tabBarFrame.showBaseline .tabBarBaseline {
-  display: block;
-}
-
 .jenkins-tab-pane__title {
   font-size: 1.6rem;
   margin: 2.2rem 0 1.4rem;

From c239daa7dd5002418d737892ac17d9badb8113c9 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 15:56:15 +0000
Subject: [PATCH 2/5] Update _page-header.scss

---
 src/main/scss/components/_page-header.scss | 113 ---------------------
 1 file changed, 113 deletions(-)

diff --git a/src/main/scss/components/_page-header.scss b/src/main/scss/components/_page-header.scss
index 76c7fc9028e4..85c4cca0f71b 100644
--- a/src/main/scss/components/_page-header.scss
+++ b/src/main/scss/components/_page-header.scss
@@ -92,116 +92,3 @@ a.page-header__brand-link {
     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);
-  }
-
-  &: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 ee1b20b3859663298b0e1ff25a940dd3045dfac9 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 15:57:33 +0000
Subject: [PATCH 3/5] Remove YUI styling

---
 src/main/scss/base/_style.scss             |  5 ----
 src/main/scss/components/_breadcrumbs.scss | 27 ----------------------
 2 files changed, 32 deletions(-)

diff --git a/src/main/scss/base/_style.scss b/src/main/scss/base/_style.scss
index d48539854e3f..80004e0f1b4b 100644
--- a/src/main/scss/base/_style.scss
+++ b/src/main/scss/base/_style.scss
@@ -229,11 +229,6 @@ pre.console {
   margin-top: 0;
 }
 
-.setting-main > .yui-button {
-  clear: both;
-  float: right;
-}
-
 .expanding-input {
   display: flex;
   align-items: center;
diff --git a/src/main/scss/components/_breadcrumbs.scss b/src/main/scss/components/_breadcrumbs.scss
index f50677846430..ff45e04f2cb6 100644
--- a/src/main/scss/components/_breadcrumbs.scss
+++ b/src/main/scss/components/_breadcrumbs.scss
@@ -311,30 +311,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;
-  }
-}

From 312f977c5e979220715a7499062f570c372201f9 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 20:26:48 +0000
Subject: [PATCH 4/5] Little bit more

---
 src/main/scss/base/_style.scss         | 34 --------------------------
 src/main/scss/components/_app-bar.scss | 16 ++++++++++++
 2 files changed, 16 insertions(+), 34 deletions(-)

diff --git a/src/main/scss/base/_style.scss b/src/main/scss/base/_style.scss
index d843ea88bc5c..fcbbf2a95161 100644
--- a/src/main/scss/base/_style.scss
+++ b/src/main/scss/base/_style.scss
@@ -267,22 +267,6 @@ pre.console {
   color: gray;
 }
 
-.bottom-sticker,
-#bottom-sticker {
-  position: sticky;
-
-  // This has to be set to -1px so that IntersectionObserver can add the
-  // &--stuck class when the element is stuck to the bottom of the screen
-  // https://css-tricks.com/how-to-detect-when-a-sticky-element-gets-pinned/
-  bottom: -1px;
-  margin-left: calc(var(--section-padding) * -1);
-  width: calc(
-    100% + calc(var(--section-padding) * 2)
-  ); /* it needs to occupy the entire width or else the underlying content will see through */
-
-  z-index: 998; /* behind top-sticker */
-}
-
 .icon16x16 {
   width: 16px;
   height: 16px;
@@ -398,20 +382,6 @@ img.icon-help {
   display: block;
 }
 
-/* ================ Element overflow calculation helper styles ================ */
-
-.force-wrap,
-.force-wrap a {
-  white-space: normal !important;
-  overflow: visible !important;
-}
-
-.force-nowrap,
-.force-nowrap a {
-  white-space: nowrap !important;
-  overflow: hidden !important;
-}
-
 /* ========================= editable combobox style ========================= */
 .comboBoxList {
   overflow-y: scroll;
@@ -790,10 +760,6 @@ select.select-ajax-pending {
 }
 
 /* ========================= Button styles ================= */
-#disable-project {
-  margin-top: 6px;
-}
-
 .i18n {
   display: none;
 }
diff --git a/src/main/scss/components/_app-bar.scss b/src/main/scss/components/_app-bar.scss
index bce8aa213a41..e1b5f88d5776 100644
--- a/src/main/scss/components/_app-bar.scss
+++ b/src/main/scss/components/_app-bar.scss
@@ -110,6 +110,22 @@
   }
 }
 
+.bottom-sticker,
+#bottom-sticker {
+  position: sticky;
+
+  // This has to be set to -1px so that IntersectionObserver can add the
+  // &--stuck class when the element is stuck to the bottom of the screen
+  // https://css-tricks.com/how-to-detect-when-a-sticky-element-gets-pinned/
+  bottom: -1px;
+  margin-left: calc(var(--section-padding) * -1);
+  width: calc(
+          100% + calc(var(--section-padding) * 2)
+  ); /* it needs to occupy the entire width or else the underlying content will see through */
+
+  z-index: 998; /* behind top-sticker */
+}
+
 .bottom-sticker-inner {
   position: relative;
   padding: 1em var(--section-padding);

From 2839ea5a1671dad4652b05f422dd15eb25a41234 Mon Sep 17 00:00:00 2001
From: Jan Faracik <43062514+janfaracik@users.noreply.github.com>
Date: Thu, 16 Jan 2025 21:17:01 +0000
Subject: [PATCH 5/5] Update _app-bar.scss

---
 src/main/scss/components/_app-bar.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/main/scss/components/_app-bar.scss b/src/main/scss/components/_app-bar.scss
index e1b5f88d5776..092c2e48a3ad 100644
--- a/src/main/scss/components/_app-bar.scss
+++ b/src/main/scss/components/_app-bar.scss
@@ -120,7 +120,7 @@
   bottom: -1px;
   margin-left: calc(var(--section-padding) * -1);
   width: calc(
-          100% + calc(var(--section-padding) * 2)
+    100% + calc(var(--section-padding) * 2)
   ); /* it needs to occupy the entire width or else the underlying content will see through */
 
   z-index: 998; /* behind top-sticker */