FrappeUIPhx.Foundations (frappe_ui_phx v0.3.1)

Copy Markdown View Source

Fundamentos visuais do Frappe UI (cores, tipografia, raios, sombras, anel de foco e cores de gráficos) como dados, lidos de priv/foundations.json, que mix tokens.sync gera da mesma fonte dos tokens do CSS. Alimenta as páginas de Fundamentos do mostruário e serve de referência em código (ex.: listar tokens).

Summary

Functions

Cores das séries dos gráficos, na ordem de uso: [%{index, family, color}].

Categorias semânticas na ordem de exibição.

Classe do token de cor para uso em HTML ("surface", "gray-2" → bg-surface-gray-2).

Variável CSS do token semântico.

Tokens semânticos por categoria: %{"surface" => [%{name, light, dark}]}.

Anéis de foco: [%{name, value}] (valor da outline em tema claro).

Família de fonte do texto.

Pesos: [%{name, value}].

Escala de raios: [%{name, value}].

Rampas primitivas por família: %{"gray" => [%{shade, value}]}.

Seção por id ou nil.

Seções dos Fundamentos: [%{id, title, summary}].

Sombras de elevação: [%{name, value}] (sem DEFAULT).

Escala tipográfica: [%{name, size, lineHeight, letterSpacing, weight, paragraph}].

Functions

chart_colors()

@spec chart_colors() :: [
  %{index: non_neg_integer(), family: String.t(), color: String.t()}
]

Cores das séries dos gráficos, na ordem de uso: [%{index, family, color}].

color_categories()

Categorias semânticas na ordem de exibição.

color_class(category, name, atom)

@spec color_class(String.t(), String.t(), :bg | :text | :border) :: String.t()

Classe do token de cor para uso em HTML ("surface", "gray-2" → bg-surface-gray-2).

color_var(category, name)

@spec color_var(String.t(), String.t()) :: String.t()

Variável CSS do token semântico.

colors()

@spec colors() :: %{required(String.t()) => [map()]}

Tokens semânticos por categoria: %{"surface" => [%{name, light, dark}]}.

focus_rings()

Anéis de foco: [%{name, value}] (valor da outline em tema claro).

font_family()

Família de fonte do texto.

font_weights()

Pesos: [%{name, value}].

radius()

Escala de raios: [%{name, value}].

ramps()

Rampas primitivas por família: %{"gray" => [%{shade, value}]}.

section(id)

Seção por id ou nil.

sections()

Seções dos Fundamentos: [%{id, title, summary}].

shadows()

Sombras de elevação: [%{name, value}] (sem DEFAULT).

type_scale()

Escala tipográfica: [%{name, size, lineHeight, letterSpacing, weight, paragraph}].