Confidenceman02/elm-select/2.0.2

NOTE: the latest version is 13.0.0

Select.Styles

Add custom styling to the select.

Set up

type Config

The default styling for the select

Set styles for the select control

    import Select.Styles as Styles




    controlBranding : Styles.ControlConfig
    controlBranding =
        Styles.getControlConfig default
            |> setControlBorderColor (Css.hex "#FFFFFF")
            |> setControlBorderColorFocus (Css.hex "#0168B3")


    selectBranding : Styles.Config
    selectBranding
        Styles.default
            |> setControlStyles controlBranding

Set styles for the select menu

    import Select.Styles as Styles




    menuBranding : MenuConfig
    menuBranding =
        Styles.getMenuConfig Styles.default
            |> setMenuBackgroundColor (Css.hex "#000000")
            |> setMenuBorderRadius 4




    selectBranding : Styles.Config
    selectBranding
            Styles.default
                |> setMenuStyles menuBranding

Set styles for control

Set styles for menu

Get styles for control

Get the ControlConfig

import Select.Styles as Styles


baseStyles : Styles.Config
baseStyles =
    Styles.default


baseControlStyles : Styles.ControlConfig
baseControlStyles =
    Styles.getControlConfig baseStyles
        |> Styles.setControlBorderColor (Css.hex "ffffff")

Get styles for menu

Get the MenuConfig

import Select.Styles as Styles


baseStyles : Styles.Config
baseStyles =
    Styles.default


baseMenuStyles : Styles.ControlConfig
baseMenuStyles =
    Styles.getMenuConfig baseStyles
        |> Styles.setMenuBorderRadius 4