BeautifulExample

Create beautiful examples to show off your Elm packages and projects.

type alias Config =

{ title : String

, details : Maybe String

, color : Maybe Color

, maxWidth : Int

, githubUrl : Maybe String

, documentationUrl : Maybe String

}

Configuration for BeautifulExample.view

title: The title of the example
details: An optional explanatory paragraph about the example
color: The the color to use to theme the example (grey will be used if you give Nothing)
maxWidth: The maximum width of the container for the example (This allows the example to be nicely centered.)
githubUrl: If given, show a github icon with a link to this URL
documentationUrl: If given, show an Elm icon with a link to this URL

sandbox :

Config

-> { init : model

, view : model -> Html msg

, update : msg -> model -> model

}

-> Program () model msg

Turn a Browser.sandbox into a beautiful example

element :

Config

-> { init : flags -> ( model, Cmd msg )

, view : model -> Html msg

, update : msg -> model -> ( model, Cmd msg )

, subscriptions : model -> Sub msg

}

-> Program flags model msg

Turn a Browser.element into a beautiful example

document :

Config

-> { init : flags -> ( model, Cmd msg )

, view : model -> Document msg

, update : msg -> model -> ( model, Cmd msg )

, subscriptions : model -> Sub msg

}

-> Program flags model msg

Turn a Browser.document into a beautiful example

application :

Config

-> { init : flags -> Url -> Key -> ( model, Cmd msg )

, view : model -> Document msg

, update : msg -> model -> ( model, Cmd msg )

, subscriptions : model -> Sub msg

, onUrlRequest : UrlRequest -> msg

, onUrlChange : Url -> msg

}

-> Program flags model msg

Turn a Browser.application into a beautiful example

view : Config -> Html msg -> Html msg

Turn arbitrary Html into a beautiful example.

Typically, you will want to use program or beginnerProgram instead.

Modules

BeautifulExample

avh4/elm-beautiful-example/2.0.1

BeautifulExample

Modules