EssenceUI.Components.Section (Essence UI v0.2.0)

Copy Markdown View Source

Themed section container with layout and spacing props.

Summary

Functions

Section component.

Functions

section(assigns)

Section component.

Attributes

  • p (:any) - Padding utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • px (:any) - Padding utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • py (:any) - Padding utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • pt (:any) - Padding utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • pr (:any) - Padding utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • pb (:any) - Padding utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • pl (:any) - Padding utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • width (:any) - Width utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
  • max_width (:any) - Max width utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
  • min_width (:any) - Min width utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
  • height (:any) - Height utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
  • max_height (:any) - Max height utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
  • min_height (:any) - Min height utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
  • position (:string) - CSS position property. Responsive supported. Must be one of "static", "relative", "absolute", "fixed", or "sticky".
  • inset (:string) - CSS inset property. Accepts scale values, CSS strings, responsive. Must be one of "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", or "-9".
  • top (:string) - CSS top property. Accepts scale values, CSS strings, responsive. Must be one of "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", or "-9".
  • right (:string) - CSS right property. Accepts scale values, CSS strings, responsive. Must be one of "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", or "-9".
  • bottom (:string) - CSS bottom property. Accepts scale values, CSS strings, responsive. Must be one of "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", or "-9".
  • left (:string) - CSS left property. Accepts scale values, CSS strings, responsive. Must be one of "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", or "-9".
  • overflow (:string) - CSS overflow property. Responsive supported. Must be one of "visible", "hidden", "clip", "scroll", or "auto".
  • overflow_x (:string) - CSS overflow-x property. Responsive supported. Must be one of "visible", "hidden", "clip", "scroll", or "auto".
  • overflow_y (:string) - CSS overflow-y property. Responsive supported. Must be one of "visible", "hidden", "clip", "scroll", or "auto".
  • flex_basis (:string) - CSS flex-basis property. Responsive supported.
  • flex_shrink (:string) - CSS flex-shrink property. Responsive supported. Must be one of "0", or "1".
  • flex_grow (:string) - CSS flex-grow property. Responsive supported. Must be one of "0", or "1".
  • grid_area (:string) - CSS grid-area property. Responsive supported.
  • grid_column (:string) - CSS grid-column property. Responsive supported.
  • grid_column_start (:string) - CSS grid-column-start property. Responsive supported.
  • grid_column_end (:string) - CSS grid-column-end property. Responsive supported.
  • grid_row (:string) - CSS grid-row property. Responsive supported.
  • grid_row_start (:string) - CSS grid-row-start property. Responsive supported.
  • grid_row_end (:string) - CSS grid-row-end property. Responsive supported.
  • m (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • mx (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • my (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • mt (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • mr (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • mb (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • ml (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
  • as_child (:boolean) - Composes the component into its immediate child instead of rendering its own HTML element. Defaults to false.
  • class (:string) - Additional CSS classes. Defaults to nil.
  • style (:string) - Additional inline styles. Defaults to nil.
  • rest (:any) - Additional HTML attributes. Defaults to %{}.

Slots

  • inner_block