Fix cropped search filters (#2932)

Nate Butler created 2 years ago

Because of the way we set up tools that add rows inside the toolbar it
is complicated to tighten up the spacing inside the toolbar.

This PR just reverts the changes I made previously. We'll need to
properly add rows below the toolbar instead of rendering search inside
of it to have non-equal height tools be able to descend from it.

Release Notes:

- Preview – Fixed an issue where search filters were partially cut off
in the UI.

Change summary

styles/src/style_tree/search.ts  | 4 ++--
styles/src/style_tree/toolbar.ts | 4 ++--
2 files changed, 4 insertions(+), 4 deletions(-)

Detailed changes

styles/src/style_tree/search.ts

@@ -48,7 +48,7 @@ export default function search(): any {
     }
 
     return {
-        padding: { top: 0, bottom: 0 },
+        padding: { top: 4, bottom: 4 },
 
         option_button: toggleable({
             base: interactive({
@@ -394,7 +394,7 @@ export default function search(): any {
                 }),
             },
         }),
-        search_bar_row_height: 32,
+        search_bar_row_height: 34,
         search_row_spacing: 8,
         option_button_height: 22,
         modes_container: {},

styles/src/style_tree/toolbar.ts

@@ -7,8 +7,8 @@ export const toolbar = () => {
     const theme = useTheme()
 
     return {
-        height: 32,
-        padding: { left: 4, right: 4, top: 4, bottom: 4 },
+        height: 42,
+        padding: { left: 4, right: 4 },
         background: background(theme.highest),
         border: border(theme.highest, { bottom: true }),
         item_spacing: 4,