fix: adjust alignment of search input next/previous buttons (#1917)

Fixes alignment of next/previous buttons in `SearchInput`. Looks like
they became mis-aligned during spectrum switchover.

Before:

![image](https://github.com/deephaven/web-client-ui/assets/1576283/044b84f3-1d7d-43e7-8ce7-984392e1fde5)

After:

![image](https://github.com/deephaven/web-client-ui/assets/1576283/04885b2e-a718-4f54-bb33-d9d144c6c8f3)

packages/components/src/SearchInput.scss

@@ -37,27 +37,25 @@
   .search-change-selection {
     position: absolute;
     right: $spacer-1;
-    top: 15%;
-    bottom: 15%;
-    height: 70%;
+    top: 0;
+    height: 100%;
+    display: flex;
+    align-items: center;
   }
 
   .search-change-button {
-    background: none;
-    border: none;
     padding: 1px 2px;
+    height: calc(100% - $spacer-2);
   }
 
-  .search-change-text {
+  .search-change-text,
+  .search-match {
     background-color: fg-opacity(20);
-    border-radius: 10px;
-    padding: 1px 5px;
+    border-radius: 20px;
+    padding: 0 5px;
   }
 
   .search-match {
-    background-color: fg-opacity(20);
-    border-radius: 10px;
-    padding: 1px 5px;
-    margin: 0 5px;
+    margin: 0 $spacer-1;
   }
 }

packages/iris-grid/src/sidebar/visibility-ordering-builder/VisibilityOrderingBuilder.scss

@@ -15,11 +15,6 @@
     background-color: var(--dh-color-gray-300);
     padding: $spacer-1 $spacer-2;
     z-index: 2;
-
-    .btn-link-icon {
-      padding-left: $spacer-1;
-      padding-right: $spacer-1;
-    }
   }
 
   .toggle-visibility-btn {

packages/iris-grid/src/sidebar/visibility-ordering-builder/VisibilityOrderingBuilder.tsx

@@ -1288,6 +1288,7 @@ class VisibilityOrderingBuilder extends PureComponent<
           <Button
             kind="ghost"
             icon={vsRefresh}
+            className="px-1"
             tooltip="Reset to default"
             onClick={() => {
               this.resetVisibilityOrdering();
@@ -1299,6 +1300,7 @@ class VisibilityOrderingBuilder extends PureComponent<
           <Button
             kind="ghost"
             icon={dhSortAlphaDown}
+            className="px-1"
             tooltip="Sort ascending"
             onClick={() => {
               this.handleSortColumns(
@@ -1309,6 +1311,7 @@ class VisibilityOrderingBuilder extends PureComponent<
           <Button
             kind="ghost"
             icon={dhSortAlphaUp}
+            className="px-1"
             tooltip="Sort descending"
             onClick={() => {
               this.handleSortColumns(
@@ -1319,11 +1322,12 @@ class VisibilityOrderingBuilder extends PureComponent<
           <span className="vertical-divider" />
           <Button
             kind="ghost"
+            className="px-1"
             tooltip="Create group from selection"
             disabled={!hasSelection}
             onClick={this.handleGroupCreate}
           >
-            <span className="fa-layers" style={{ marginRight: '0.75rem' }}>
+            <span className="fa-layers">
               <FontAwesomeIcon
                 mask={vsSymbolStructure}
                 icon={vsCircleLargeFilled}
@@ -1340,6 +1344,7 @@ class VisibilityOrderingBuilder extends PureComponent<
           <Button
             kind="ghost"
             icon={vsChevronUp}
+            className="px-1"
             tooltip="Move selection up"
             onClick={() => {
               this.handleMoveColumns(VisibilityOrderingBuilder.MOVE_OPTIONS.UP);
@@ -1349,6 +1354,7 @@ class VisibilityOrderingBuilder extends PureComponent<
           <Button
             kind="ghost"
             icon={vsChevronDown}
+            className="px-1"
             tooltip="Move selection down"
             onClick={() => {
               this.handleMoveColumns(
@@ -1360,6 +1366,7 @@ class VisibilityOrderingBuilder extends PureComponent<
           <Button
             kind="ghost"
             icon={dhArrowToTop}
+            className="px-1"
             tooltip="Move selection to top"
             onClick={() => {
               this.handleMoveColumns(
@@ -1371,6 +1378,7 @@ class VisibilityOrderingBuilder extends PureComponent<
           <Button
             kind="ghost"
             icon={dhArrowToBottom}
+            className="px-1"
             tooltip="Move selection to bottom"
             onClick={() => {
               this.handleMoveColumns(