Merge branch 'new-search-bar-component' into search-overhaul

janfaracik · Aug 10, 2022 · 6ce62f0 · 6ce62f0
2 parents 9bbb282 + f6daa76
commit 6ce62f0
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/core/src/main/resources/lib/layout/search-bar.jelly b/core/src/main/resources/lib/layout/search-bar.jelly
@@ -30,6 +30,9 @@ THE SOFTWARE.
     <st:attribute name="id" />
     <st:attribute name="autofocus" />
     <st:attribute name="clazz" />
+    <st:attribute name="hasKeyboardShortcut">
+      If false the default keyboard shortcut for the input is disabled. Defaults to true.
+    </st:attribute>
   </st:documentation>
 
   <div class="jenkins-search ${attrs.clazz}">
@@ -46,8 +49,10 @@ THE SOFTWARE.
            autocorrect="off"
            autocapitalize="off"
            spellcheck="false" />
-    <div class="jenkins-search__shortcut" tooltip="Press / on your keyboard to focus">
-      <l:icon src="symbol-search-shortcut" />
-    </div>
+    <j:if test="${attrs.hasKeyboardShortcut != 'false'}">
+      <div class="jenkins-search__shortcut" tooltip="${%Press / on your keyboard to focus}">
+        <l:icon src="symbol-search-shortcut" />
+      </div>
+    </j:if>
   </div>
 </j:jelly>
diff --git a/war/src/main/less/form/search-bar.less b/war/src/main/less/form/search-bar.less
@@ -30,8 +30,9 @@
 
     &::-webkit-search-cancel-button {
       -webkit-appearance: none;
-      height: 1.1rem;
-      width: 1.1rem;
+      height: 45%;
+      min-height: 1.1rem;
+      aspect-ratio: 1;
       margin-right: 0.2rem;
       background: currentColor;
       mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 11-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 01-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0122.62-22.62L256 233.37l52.69-52.68a16 16 0 0122.62 22.62L278.63 256z'/%3E%3C/svg%3E");