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

Copy Markdown View Source

Theme root for Essence UI — applies accent, gray, radius, scaling, and appearance.

Applies accent, gray, radius, scaling, and appearance via data-* attributes on a root wrapper.

Summary

Functions

accent_colors()

gray_colors()

radii()

scalings()

theme(assigns)

Renders a theme root.

Examples

<.theme accent_color="indigo" gray_color="slate">
  <.button>Hey</.button>
</.theme>

Attributes

  • as (:string) - Element to render. Defaults to "div".
  • appearance (:string) - Defaults to "inherit". Must be one of "inherit", "light", or "dark".
  • accent_color (:string) - Defaults to "indigo". Must be one of "gray", "gold", "bronze", "brown", "yellow", "amber", "orange", "tomato", "red", "ruby", "crimson", "pink", "plum", "purple", "violet", "iris", "indigo", "blue", "cyan", "teal", "jade", "green", "grass", "lime", "mint", or "sky".
  • gray_color (:string) - Defaults to "auto". Must be one of "auto", "gray", "mauve", "slate", "sage", "olive", or "sand".
  • radius (:string) - Defaults to "medium". Must be one of "none", "small", "medium", "large", or "full".
  • scaling (:string) - Defaults to "100%". Must be one of "90%", "95%", "100%", "105%", or "110%".
  • panel_background (:string) - Defaults to "solid". Must be one of "solid", or "translucent".
  • has_background (:boolean) - Defaults to true.
  • is_root (:boolean) - When true, sets data-is-root-theme for viewport styling. Defaults to true.
  • class (:any) - Defaults to nil.
  • style (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)