[{"name":"Layout","comment":" write HTML like elm-ui\n\n\n# Html elements\n\n@docs container, none, el, column, row\n\n@docs button\n\n\n# Attributes\n\n@docs centered, alignBaseline, alignCenter, centerContent, noWrap\n\n\n# Size\n\n@docs fill, fillPortion\n\n\n# Spacing\n\n@docs spacing, spaceBetween\n\n\n## Sticky\n\n@docs sticky, stickyOnBottom, stickyOnTop\n\n\n## Role\n\n@docs asButton\n\n","unions":[],"aliases":[],"values":[{"name":"alignBaseline","comment":"\n\n    alignBaseline : Attribute msg\n    alignBaseline =\n        Html.Attributes.style \"align-items\" \"baseline\"\n\n","type":"Html.Attribute msg"},{"name":"alignCenter","comment":"\n\n    alignCenter : Attribute msg\n    alignCenter =\n        Html.Attributes.style \"align-items\" \"center\"\n\n","type":"Html.Attribute msg"},{"name":"asButton","comment":" Turns anything into a button\n\n    asButton : { onPress : Maybe msg, label : String } -> List (Attribute msg)\n    asButton args =\n        [ Html.Attributes.type_ \"button\"\n        , Html.Attributes.attribute \"cursor\" \"pointer\"\n        , Html.Attributes.attribute \"aria-label\" args.label\n        ]\n            ++ (args.onPress\n                    |> Maybe.map (\\msg -> [ Html.Events.onClick msg ])\n                    |> Maybe.withDefault []\n               )\n\n","type":"{ onPress : Maybe.Maybe msg, label : String.String } -> List.List (Html.Attribute msg)"},{"name":"button","comment":"\n\n    button : { onPress : Maybe msg, label : String } -> List (Attribute msg) -> Html msg\n    button args attrs =\n        Html.div (asButton args ++ attrs)\n            [ Html.text args.label ]\n\n","type":"{ onPress : Maybe.Maybe msg, label : String.String } -> List.List (Html.Attribute msg) -> Html.Html msg"},{"name":"centerContent","comment":"\n\n    centerContent : Attribute msg\n    centerContent =\n        Html.Attributes.style \"justify-content\" \"center\"\n\n","type":"Html.Attribute msg"},{"name":"centered","comment":"\n\n    centered : List (Attribute msg)\n    centered =\n        [ centerContent, alignCenter ]\n\n","type":"List.List (Html.Attribute msg)"},{"name":"column","comment":"\n\n    column : List (Attribute msg) -> List (Html msg) -> Html msg\n    column attrs =\n        Html.div\n            ([ Html.Attributes.style \"display\" \"flex\"\n             , Html.Attributes.style \"flex-direction\" \"column\"\n             ]\n                ++ attrs\n            )\n\n","type":"List.List (Html.Attribute msg) -> List.List (Html.Html msg) -> Html.Html msg"},{"name":"container","comment":" Fills the entire screen. Should be the outer most element.\n\n    container : List (Attribute msg) -> Html msg -> Html msg\n    container attrs =\n        el\n            ([ Html.Attributes.style \"width\" \"100%\"\n             , Html.Attributes.style \"height\" \"100%\"\n             , Html.Attributes.style \"position\" \"absolute\"\n             , Html.Attributes.style \"left\" \"0px\"\n             , Html.Attributes.style \"top\" \"0px\"\n             ]\n                ++ attrs\n            )\n\n","type":"List.List (Html.Attribute msg) -> Html.Html msg -> Html.Html msg"},{"name":"el","comment":"\n\n    el : List (Attribute msg) -> Html msg -> Html msg\n    el attrs content =\n        Html.div\n            (Html.Attributes.style \"display\" \"flex\"\n                :: attrs\n            )\n            [ content ]\n\n","type":"List.List (Html.Attribute msg) -> Html.Html msg -> Html.Html msg"},{"name":"fill","comment":"\n\n    fill : Attribute msg\n    fill =\n        fillPortion 1\n\n","type":"Html.Attribute msg"},{"name":"fillPortion","comment":"\n\n    fillPortion : Int -> Attribute msg\n    fillPortion n =\n        Html.Attributes.style \"flex\" (String.fromInt n)\n\n","type":"Basics.Int -> Html.Attribute msg"},{"name":"noWrap","comment":"\n\n    noWrap : Attribute msg\n    noWrap =\n        Html.Attributes.style \"flex-wrap\" \"nowrap\"\n\n","type":"Html.Attribute msg"},{"name":"none","comment":"\n\n    none : Html msg\n    none =\n        Html.text \"\"\n\n","type":"Html.Html msg"},{"name":"row","comment":"\n\n    row : List (Attribute msg) -> List (Html msg) -> Html msg\n    row attrs =\n        Html.div\n            ([ Html.Attributes.style \"display\" \"flex\"\n             , Html.Attributes.style \"flex-direction\" \"row\"\n             , Html.Attributes.style \"flex-wrap\" \"wrap\"\n             ]\n                ++ attrs\n            )\n\nWill wrap into the next line if there is not enough space.\n\nIf you don't want this behavior, you can just add `noWrap`:\n\n    unwrappedRow : List (Attribute msg) -> List (Html msg) -> Html msg\n    unwrappedRow attrs =\n        Layout.row (Layout.noWrap ++ attrs)\n\n","type":"List.List (Html.Attribute msg) -> List.List (Html.Html msg) -> Html.Html msg"},{"name":"spaceBetween","comment":"\n\n    spaceBetween : Attribute msg\n    spaceBetween =\n        Html.Attributes.style \"justify-content\" \"space-between\"\n\n","type":"Html.Attribute msg"},{"name":"spacing","comment":"\n\n    spacing : Float -> Attribute msg\n    spacing n =\n        Html.Attributesstyle \"gap\" (String.fromFloat n ++ \"px\")\n\n","type":"Basics.Float -> Html.Attribute msg"},{"name":"sticky","comment":"\n\n    sticky : List (Attribute msg)\n    sticky =\n        [ Html.Attributes.style \"position\" \"sticky\"\n        , Html.Attributes.style \"z-index\" \"99999\"\n        ]\n\n","type":"List.List (Html.Attribute msg)"},{"name":"stickyOnBottom","comment":"\n\n    stickyOnBottom : List (Attribute msg)\n    stickyOnBottom =\n        [ Html.Attributes.style \"position\" \"sticky\"\n        , Html.Attributes.style \"bottom\" \"0\"\n        , Html.Attributes.style \"z-index\" \"99999\"\n        ]\n\n","type":"List.List (Html.Attribute msg)"},{"name":"stickyOnTop","comment":"\n\n    stickyOnTop : List (Attribute msg)\n    stickyOnTop =\n        [ Html.Attributes.style \"position\" \"sticky\"\n        , Html.Attributes.style \"top\" \"0\"\n        , Html.Attributes.style \"z-index\" \"99999\"\n        ]\n\n","type":"List.List (Html.Attribute msg)"}],"binops":[]}]