Fix autocomplete on addJob

jenkinsci · May 29, 2020 · 49e501f · 49e501f
1 parent c12b42c
commit 49e501f
Show file tree

Hide file tree

Showing 6 changed files with 100 additions and 97 deletions.
diff --git a/war/src/main/js/widgets/add/addform.less b/war/src/main/js/widgets/add/addform.less
@@ -281,9 +281,9 @@
 
   li.active {
     cursor: text;
-    background-color: #ffffff;
-    border-color: #6699cc;
-    box-shadow: inset 999rem 0 #ffffff;
+    background-color: var(--background);
+    border-color: var(--input-border);
+    box-shadow: inset 999rem 0 var(--background);
     -webkit-touch-callout: text;
     -webkit-user-select: text;
     -khtml-user-select: text;

diff --git a/war/src/main/less/abstracts/colors.less b/war/src/main/less/abstracts/colors.less
@@ -170,4 +170,7 @@
 
   // Plugin manager
   --plugin-manager-bg-color-already-upgraded: #e8eeee;
+
+  // Auto complete
+  --auto-complete-bg-color--prehighlight: #b3d4ff;
 }
diff --git a/war/src/main/less/base/style.less b/war/src/main/less/base/style.less
@@ -1411,82 +1411,6 @@ DIV.to-be-removed { display: none; }
 
 .row-set-end { display: none; }
 
-/* ========================= Yahoo UI style adjustments ========================= */
-.ygtvlabel, .ygtvlabel:link, .ygtvlabel:visited, .ygtvlabel:hover {
-  color: inherit;
-}
-
-DIV.yahooTree td {
-  vertical-align: middle;
-}
-
-.yui-tt {
-  border: 1px solid black !important;
-  background-color: #FFFFFF !important;
-  padding: 2px !important;
-  font-family: inherit !important;
-  color: inherit !important;
-}
-
-.yui-skin-sam .yui-tt .bd {
-  border: none !important;
-  background-color: #FFF !important;
-}
-
-.yuimenu LI .yui-menu-tooltip {
-  color: #A6A6A6;
-}
-
-.yuimenu LI.yui-menuitem-tooltip {
-  border-bottom: 1px solid #808080;
-  padding-bottom: 3px;
-  margin-bottom: 1em;
-}
-
-#jenkins .yuimenuitem {
-    font-size: var(--font-size-xs);
-    padding: 3px;
-}
-
-#jenkins .yuimenuitem,
-#jenkins .yuimenuitemlabel {
-    cursor: pointer;
-}
-
-#jenkins .yuimenu .bd {
-    border: 1px solid #ccc;
-    box-shadow: var(--menu-box-shadow);
-}
-
-#jenkins.yui-skin-sam {
-  .yui-menu ul {
-    border-color: var(--input-border);
-  }
-
-  .yuimenuitem-selected {
-    background-color: var(--menu-selected-color);
-  }
-
-  .yuimenuitemlabel {
-    color: var(--menu-text-color);
-
-    &:visited {
-      color: var(--menu-text-color);
-    }
-  }
-
-  .yuimenu {
-    .bd {
-      border-color: var(--input-border);
-      background-color: var(--menu-bg-color);
-    }
-  }
-}
-
-#jenkins .yui-menu-shadow {
-    display: none;
-}
-
 /* ========================= resizable text area ========================= */
 
 TEXTAREA {

diff --git a/war/src/main/less/base/yui-compatibility.less b/war/src/main/less/base/yui-compatibility.less
@@ -58,9 +58,101 @@
   zoom: 1;
 }
 .yui-skin-sam .yui-ac-content li.yui-ac-prehighlight {
-  background: #b3d4ff;
+  background: var(--auto-complete-bg-color--prehighlight);
 }
 .yui-skin-sam .yui-ac-content li.yui-ac-highlight {
   background: #426fd9;
   color: #fff;
 }
+
+#jenkins.yui-skin-sam {
+  .yui-menu ul {
+    border-color: var(--input-border);
+  }
+
+  .yuimenuitem-selected {
+    background-color: var(--menu-selected-color);
+  }
+
+  .yuimenuitemlabel {
+    color: var(--menu-text-color);
+
+    &:visited {
+      color: var(--menu-text-color);
+    }
+  }
+
+  .yuimenu {
+    .bd {
+      border-color: var(--input-border);
+      background-color: var(--menu-bg-color);
+    }
+  }
+}
+
+.ygtvlabel, .ygtvlabel:link, .ygtvlabel:visited, .ygtvlabel:hover {
+  color: inherit;
+}
+
+DIV.yahooTree td {
+  vertical-align: middle;
+}
+
+.yui-tt {
+  border: 1px solid black !important;
+  background-color: #FFFFFF !important;
+  padding: 2px !important;
+  font-family: inherit !important;
+  color: inherit !important;
+}
+
+.yui-skin-sam .yui-tt .bd {
+  border: none !important;
+  background-color: #FFF !important;
+}
+
+.yuimenu LI .yui-menu-tooltip {
+  color: #A6A6A6;
+}
+
+.yuimenu LI.yui-menuitem-tooltip {
+  border-bottom: 1px solid #808080;
+  padding-bottom: 3px;
+  margin-bottom: 1em;
+}
+
+#jenkins .yuimenuitem {
+  font-size: var(--font-size-xs);
+  padding: 3px;
+}
+
+#jenkins .yuimenuitem,
+#jenkins .yuimenuitemlabel {
+  cursor: pointer;
+}
+
+#jenkins .yuimenu .bd {
+  border: 1px solid #ccc;
+  box-shadow: var(--menu-box-shadow);
+}
+
+#jenkins .yui-menu-shadow {
+  display: none;
+}
+
+#jenkins .yui-ac-content {
+  width: 30em;
+  background-color: var(--search-bg);
+  overflow: hidden;
+
+  // TODO:  chose a better box shadow
+  box-shadow: var(--search-box-shadow);
+
+  border: none;
+  border-radius: var(--header-item-border-radius);
+}
+
+#jenkins li.yui-ac-highlight {
+  background: var(--search-box-completion-bg);
+  font-weight: bold;
+}
diff --git a/war/src/main/less/modules/page-header.less b/war/src/main/less/modules/page-header.less
@@ -181,18 +181,6 @@ a.page-header__brand-link {
     z-index: 1000;
 }
 
-#search-box-completion .yui-ac-content {
-    width: 30em;
-    background-color: var(--search-bg);
-    overflow: hidden;
-
-    // TODO:  chose a better box shadow
-    box-shadow: var(--search-box-shadow);
-
-    border: none;
-    border-radius: var(--header-item-border-radius);
-}
-
 #search-box-completion UL {
     padding: 0.75rem 0;
     width: 100%;
@@ -209,11 +197,6 @@ a.page-header__brand-link {
     text-overflow: ellipsis;
 }
 
-#search-box-completion LI.yui-ac-highlight {
-    background: var(--search-box-completion-bg);
-    font-weight: bold;
-}
-
 #search-box-sizer {
     position:absolute;
     visibility: hidden;

diff --git a/war/src/main/webapp/scripts/hudson-behavior.js b/war/src/main/webapp/scripts/hudson-behavior.js
@@ -736,6 +736,7 @@ var jenkinsRules = {
         ac.generateRequest = function(query) {
             return "?value=" + query;
         };
+        ac.autoHighlight = false;
         ac.prehighlightClassName = "yui-ac-prehighlight";
         ac.animSpeed = 0;
         ac.formatResult = ac.formatEscapedResult;