diff --git a/examples/context/src/main.rs b/examples/context/src/main.rs index 192d57cb..c8909889 100644 --- a/examples/context/src/main.rs +++ b/examples/context/src/main.rs @@ -22,7 +22,7 @@ fn context_container( s.padding(10) .border(1) .border_color(color) - .gap_height(5) + .column_gap(5) .items_center() }) } @@ -43,7 +43,7 @@ fn app_view() -> impl IntoView { .height_full() .items_center() .justify_center() - .gap_height(5) + .column_gap(5) }); let id = view.id(); diff --git a/examples/dyn-container/src/main.rs b/examples/dyn-container/src/main.rs index ca6e8e39..b1dccf6f 100644 --- a/examples/dyn-container/src/main.rs +++ b/examples/dyn-container/src/main.rs @@ -21,7 +21,7 @@ fn view_two(view: RwSignal) -> impl IntoView { view.set(ViewSwitcher::One); }), )) - .style(|s| s.gap_height(10.0)) + .style(|s| s.column_gap(10.0)) } fn app_view() -> impl IntoView { @@ -54,7 +54,7 @@ fn app_view() -> impl IntoView { .height_full() .items_center() .justify_center() - .gap_width(10) + .row_gap(10) }) } diff --git a/examples/files/src/main.rs b/examples/files/src/main.rs index 7e40b7b9..ca1f5fa0 100644 --- a/examples/files/src/main.rs +++ b/examples/files/src/main.rs @@ -79,7 +79,7 @@ fn app_view() -> impl IntoView { }), )) .style(|s| { - s.gap_width(5) + s.row_gap(5) .width_full() .height_full() .items_center() diff --git a/examples/flight_booker/src/main.rs b/examples/flight_booker/src/main.rs index e7e5b21b..c185fa33 100644 --- a/examples/flight_booker/src/main.rs +++ b/examples/flight_booker/src/main.rs @@ -102,7 +102,7 @@ pub fn app_view() -> impl IntoView { book_button, success_message, )) - .style(|s| s.gap_height(5)) + .style(|s| s.column_gap(5)) .style(|s| { s.size(100.pct(), 100.pct()) .flex_col() diff --git a/examples/layout/src/main.rs b/examples/layout/src/main.rs index 7b9dc5fa..786cbab3 100644 --- a/examples/layout/src/main.rs +++ b/examples/layout/src/main.rs @@ -94,7 +94,7 @@ fn app_view() -> impl IntoView { .width_full() .height_full() .padding(10.0) - .gap_height(10.0) + .column_gap(10.0) }); let id = view.id(); diff --git a/examples/layout/src/tab_navigation.rs b/examples/layout/src/tab_navigation.rs index 19215973..c2486b63 100644 --- a/examples/layout/src/tab_navigation.rs +++ b/examples/layout/src/tab_navigation.rs @@ -78,7 +78,7 @@ pub fn tab_navigation_view() -> impl IntoView { s.flex_row() .width_full() .height(TABBAR_HEIGHT) - .gap_width(5) + .row_gap(5) .padding(CONTENT_PADDING) .border_bottom(1) .border_color(Color::rgb8(205, 205, 205)) diff --git a/examples/stacks/src/dyn_stack.rs b/examples/stacks/src/dyn_stack.rs index 2d288a84..307d5021 100644 --- a/examples/stacks/src/dyn_stack.rs +++ b/examples/stacks/src/dyn_stack.rs @@ -25,5 +25,5 @@ pub fn dyn_stack_view() -> impl IntoView { ) .style(|s| s.width(100).height(200).border(1)), ) - .style(|s| s.flex_col().gap_height(5).margin_top(10)) + .style(|s| s.flex_col().column_gap(5).margin_top(10)) } diff --git a/examples/stacks/src/main.rs b/examples/stacks/src/main.rs index baf83020..25b38d50 100644 --- a/examples/stacks/src/main.rs +++ b/examples/stacks/src/main.rs @@ -18,7 +18,7 @@ fn app_view() -> impl IntoView { "Renders off-screen: true", stack::stack_view(), ) - .style(|s| s.flex_col().gap_height(5).width_pct(25.0)), + .style(|s| s.flex_col().column_gap(5).width_pct(25.0)), ( "stack_from_iter".style(|s| s.font_size(16.0)), "From signal: false", @@ -26,7 +26,7 @@ fn app_view() -> impl IntoView { "Renders off-screen: true", stack_from_iter::stack_from_iter_view(), ) - .style(|s| s.flex_col().gap_height(5).width_pct(25.0)), + .style(|s| s.flex_col().column_gap(5).width_pct(25.0)), ( "dyn_stack".style(|s| s.font_size(16.0)), "From signal: true", @@ -34,7 +34,7 @@ fn app_view() -> impl IntoView { "Renders off-screen: true", dyn_stack::dyn_stack_view(), ) - .style(|s| s.flex_col().gap_height(5).width_pct(25.0)), + .style(|s| s.flex_col().column_gap(5).width_pct(25.0)), ( "virtual_stack".style(|s| s.font_size(16.0)), "From signal: true", @@ -42,9 +42,9 @@ fn app_view() -> impl IntoView { "Renders off-screen: false", virtual_stack::virtual_stack_view(), ) - .style(|s| s.flex_col().gap_height(5).width_pct(25.0)), + .style(|s| s.flex_col().column_gap(5).width_pct(25.0)), ) - .style(|s| s.flex().margin(20).width_full().height_full().gap_width(10)) + .style(|s| s.flex().margin(20).width_full().height_full().row_gap(10)) .into_view(); let id = view.id(); diff --git a/examples/stacks/src/stack.rs b/examples/stacks/src/stack.rs index 8eb0ffc2..b1ba69f9 100644 --- a/examples/stacks/src/stack.rs +++ b/examples/stacks/src/stack.rs @@ -16,13 +16,13 @@ pub fn stack_view() -> impl IntoView { stack(( "Item 3", "Item 4", - )).style(|s| s.flex_col().gap_height(5)), + )).style(|s| s.flex_col().column_gap(5)), // The vertical stack view which has flex_col() built in v_stack(( "Item 5", "Item 6", - )).style(|s| s.gap_height(5)), + )).style(|s| s.column_gap(5)), ) .style(|s| s.flex_col().gap( 5).margin_top(10)) diff --git a/examples/stacks/src/stack_from_iter.rs b/examples/stacks/src/stack_from_iter.rs index b4825234..55a859aa 100644 --- a/examples/stacks/src/stack_from_iter.rs +++ b/examples/stacks/src/stack_from_iter.rs @@ -10,5 +10,5 @@ pub fn stack_from_iter_view() -> impl IntoView { let collection: Vec = (0..10).collect(); stack_from_iter(collection.iter().map(|val| format!("Item {}", val))) - .style(|s| s.flex_col().gap_height(5).margin_top(10)) + .style(|s| s.flex_col().column_gap(5).margin_top(10)) } diff --git a/examples/stacks/src/virtual_stack.rs b/examples/stacks/src/virtual_stack.rs index 61e8c348..5dc3bcbf 100644 --- a/examples/stacks/src/virtual_stack.rs +++ b/examples/stacks/src/virtual_stack.rs @@ -27,5 +27,5 @@ pub fn virtual_stack_view() -> impl IntoView { ) .style(|s| s.width(100).height(200).border(1)), ) - .style(|s| s.flex_col().gap_height(5).margin_top(10)) + .style(|s| s.flex_col().column_gap(5).margin_top(10)) } diff --git a/examples/widget-gallery/src/main.rs b/examples/widget-gallery/src/main.rs index af576029..c8a83465 100644 --- a/examples/widget-gallery/src/main.rs +++ b/examples/widget-gallery/src/main.rs @@ -144,7 +144,7 @@ fn app_view() -> impl IntoView { }) .style(|s| s); - let left = v_stack((list, inspector)).style(|s| s.height_full().gap_height(5.0)); + let left = v_stack((list, inspector)).style(|s| s.height_full().column_gap(5.0)); let tab = tab( move || active_tab.get(), @@ -171,7 +171,7 @@ fn app_view() -> impl IntoView { let tab = scroll(tab).style(|s| s.flex_basis(0).min_width(0).flex_grow(1.0)); let view = h_stack((left, tab)) - .style(|s| s.padding(5.0).width_full().height_full().gap_width(5.0)) + .style(|s| s.padding(5.0).width_full().height_full().row_gap(5.0)) .window_title(|| "Widget Gallery".to_owned()); let id = view.id(); diff --git a/examples/widget-gallery/src/radio_buttons.rs b/examples/widget-gallery/src/radio_buttons.rs index e5e4398f..9d3bf95b 100644 --- a/examples/widget-gallery/src/radio_buttons.rs +++ b/examples/widget-gallery/src/radio_buttons.rs @@ -47,7 +47,7 @@ pub fn radio_buttons_view() -> impl IntoView { }, ), )) - .style(|s| s.gap_height(10.0).margin_left(5.0)) + .style(|s| s.column_gap(10.0).margin_left(5.0)) }), form_item("Disabled Radio Buttons:".to_string(), width, move || { v_stack(( @@ -67,7 +67,7 @@ pub fn radio_buttons_view() -> impl IntoView { }) .disabled(|| true), )) - .style(|s| s.gap_height(10.0).margin_left(5.0)) + .style(|s| s.column_gap(10.0).margin_left(5.0)) }), form_item("Labelled Radio Buttons:".to_string(), width, move || { v_stack(( diff --git a/examples/window-icon/src/main.rs b/examples/window-icon/src/main.rs index b1844097..f0d30137 100644 --- a/examples/window-icon/src/main.rs +++ b/examples/window-icon/src/main.rs @@ -24,7 +24,7 @@ fn sub_window_view(id: WindowId) -> impl IntoView { .justify_center() .width_full() .height_full() - .gap_height(10.0) + .column_gap(10.0) }) } @@ -51,7 +51,7 @@ fn app_view() -> impl IntoView { .justify_center() .width_full() .height_full() - .gap_height(10.0) + .column_gap(10.0) }); let id = view.id(); diff --git a/examples/window-size/src/main.rs b/examples/window-size/src/main.rs index d83d8702..24f520ec 100644 --- a/examples/window-size/src/main.rs +++ b/examples/window-size/src/main.rs @@ -20,7 +20,7 @@ fn sub_window_view(id: WindowId) -> impl IntoView { .justify_center() .width_full() .height_full() - .gap_height(10.0) + .column_gap(10.0) }) } @@ -44,7 +44,7 @@ fn app_view() -> impl IntoView { .justify_center() .width_full() .height_full() - .gap_height(10.0) + .column_gap(10.0) }); let id = view.id(); diff --git a/src/style.rs b/src/style.rs index 158b0325..4b6a9278 100644 --- a/src/style.rs +++ b/src/style.rs @@ -1352,7 +1352,7 @@ impl Style { self.height(height.pct()) } - pub fn gap_width(self, width: impl Into) -> Self { + pub fn row_gap(self, width: impl Into) -> Self { let gap_height = self.get(Gap).height; self.set( Gap, @@ -1363,7 +1363,7 @@ impl Style { ) } - pub fn gap_height(self, height: impl Into) -> Self { + pub fn column_gap(self, height: impl Into) -> Self { let gap_width = self.get(Gap).width; self.set( Gap, @@ -1374,7 +1374,7 @@ impl Style { ) } - pub fn gap_width_height(self, width: impl Into, height: impl Into) -> Self { + pub fn row_col_gap(self, width: impl Into, height: impl Into) -> Self { self.set( Gap, Size { diff --git a/src/theme.rs b/src/theme.rs index 0b7a2eb1..2de4093f 100644 --- a/src/theme.rs +++ b/src/theme.rs @@ -91,7 +91,7 @@ pub(crate) fn default_theme() -> Theme { }); let labeled_checkbox_style = Style::new() - .gap_width(padding) + .row_gap(padding) .hover(|s| s.background(hover_bg_color)) .padding(padding) .transition(Background, Transition::linear(0.04)) @@ -140,7 +140,7 @@ pub(crate) fn default_theme() -> Theme { }); let labeled_radio_button_style = Style::new() - .gap_width(padding) + .row_gap(padding) .hover(|s| s.background(hover_bg_color)) .padding(padding) .transition(Background, Transition::linear(0.04)) diff --git a/src/views/dyn_container.rs b/src/views/dyn_container.rs index 35db5f81..ea3e38b4 100644 --- a/src/views/dyn_container.rs +++ b/src/views/dyn_container.rs @@ -56,7 +56,7 @@ pub struct DynamicContainer { /// .height_full() /// .items_center() /// .justify_center() -/// .gap_width(10) +/// .row_gap(10) /// }) /// } ///