EngageSoftware / elm-engage-common / Engage.Theme

Basic Theme types

Types


type alias ColorPalette =
{ base : Engage.Unit.Color.Color
, contrast : Engage.Unit.Color.Color
, tertiary : Engage.Unit.Color.Color 
}

A color palette


type alias Decoration a =
{ a | border : Engage.Unit.Border.Border }

A decoration type


type alias DecorationOnly =
Decoration {}

A decoration only type


type alias LabelTypography a =
{ a | labelFontFamily : Engage.Unit.FontFamily.FontFamily
, labelFontSize : { base : Engage.Unit.Size.Size
, small : Engage.Unit.Relative.Relative } 
}

A label typography type


type alias LabelTypographyOnly =
LabelTypography {}

A label typography only type


type alias Palette =
{ buttonPrimary : ColorPalette
, buttonPrimaryHover : ColorPalette
, buttonStandard : ColorPalette
, buttonStandardHover : ColorPalette
, buttonDivert : ColorPalette
, buttonDivertHover : ColorPalette
, input : ColorPalette
, dropdown : ColorPalette
, error : ColorPalette
, warning : ColorPalette
, confirmation : ColorPalette
, info : ColorPalette
, wizardHeader : ColorPalette 
}

A theme palatte


type alias Spacing =
ThemeData SpacingDataOnly (SpacingData WithLabelOnly) (SpacingData WithLabelOnly) SpacingDataOnly SpacingDataOnly

A spacing type


type alias SpacingData modifier =
{ modifier | padding : { base : Engage.Unit.Padding.Padding
, small : Engage.Unit.Relative.Relative }
, margin : { base : Engage.Unit.Margin.Margin
, small : Engage.Unit.Relative.Relative } 
}

A spacing data type


type alias Style =
ThemeData (Typography (LabelTypography DecorationOnly)) (Typography (LabelTypography DecorationOnly)) (Typography (LabelTypography DecorationOnly)) (Typography DecorationOnly) (Typography DecorationOnly)

A style type


type Theme
    = Light
    | Dark
    | ISMA
    | None

A theme


type alias ThemeData button input dropdown wizard wizardHeader =
{ button : button
, input : input
, dropdown : dropdown
, wizard : wizard
, wizardHeader : wizardHeader 
}

A theme data type


type alias Typography a =
{ a | fontFamily : Engage.Unit.FontFamily.FontFamily
, fontSize : { base : Engage.Unit.Size.Size
, small : Engage.Unit.Relative.Relative } 
}

A typography type


type alias TypographyOnly =
Typography {}

A typography only type


type alias WithLabel a =
{ a | labelMargin : { base : Engage.Unit.Margin.Margin
, small : Engage.Unit.Relative.Relative }
, labelPadding : { base : Engage.Unit.Padding.Padding
, small : Engage.Unit.Relative.Relative } 
}

A with label type


type alias WithLabelOnly =
WithLabel {}

A with label only type

Helpers

fromString : Theme -> String -> Theme

Get a theme from a string

toDropdownItem : Theme -> Dropdown.Item

Get a dropdown item for the theme

toString : Theme -> String

Get the string value of a theme