Add more padding to dismiss button.

Piotr Osiewicz and Kyle created 2 years ago

Add a style for mode buttons group margin

Co-authored-by: Kyle <[e-mail]>

Change summary

crates/search/src/buffer_search.rs  |  2 +-
crates/search/src/project_search.rs |  4 +++-
crates/theme/src/theme.rs           |  1 +
styles/src/style_tree/search.ts     | 13 +++++++++----
4 files changed, 14 insertions(+), 6 deletions(-)

Detailed changes

crates/search/src/buffer_search.rs

@@ -308,7 +308,7 @@ impl View for BufferSearchBar {
                                 .aligned()
                                 .left()
                                 .contained()
-                                .with_margin_right(3.),
+                                .with_style(theme.search.modes_container),
                         )
                         .with_child(
                             super::search_bar::render_close_button(

crates/search/src/project_search.rs

@@ -1617,10 +1617,12 @@ impl View for ProjectSearchBar {
                                         .with_child(search_button_for_mode(SearchMode::Text, cx))
                                         .with_children(semantic_index)
                                         .with_child(search_button_for_mode(SearchMode::Regex, cx))
+                                        .constrained()
+                                        .with_height(theme.search.search_bar_row_height)
                                         .aligned()
                                         .left()
                                         .contained()
-                                        .with_margin_right(3.),
+                                        .with_style(theme.search.modes_container),
                                 )
                                 .with_child(
                                     super::search_bar::render_close_button(

crates/theme/src/theme.rs

@@ -391,6 +391,7 @@ pub struct Search {
     pub nav_button: Toggleable<Interactive<ContainedLabel>>,
     pub search_bar_row_height: f32,
     pub option_button_height: f32,
+    pub modes_container: ContainerStyle,
 }
 
 #[derive(Clone, Deserialize, Default, JsonSchema)]

styles/src/style_tree/search.ts

@@ -165,10 +165,10 @@ export default function search(): any {
                 button_width: 32,
                 corner_radius: 6,
                 padding: {
-                    top: 8,
-                    bottom: 8,
-                    left: 8,
-                    right: 8,
+                    top: 10,
+                    bottom: 10,
+                    left: 10,
+                    right: 10,
                 },
 
                 background: background(theme.highest, "variant"),
@@ -309,6 +309,11 @@ export default function search(): any {
         }),
         search_bar_row_height: 32,
         option_button_height: 22,
+        modes_container: {
+            margin: {
+                right: 9
+            }
+        }
 
     }
 }