diff --git a/examples/basic/package/Application.elm b/examples/basic/package/Application.elm index 778afdd..7aa123f 100644 --- a/examples/basic/package/Application.elm +++ b/examples/basic/package/Application.elm @@ -40,6 +40,9 @@ create : { fromUrl : Url -> route , toPath : route -> String } + , layout : + { view : { page : Html msg } -> Html msg + } , pages : { init : route -> ( model, Cmd msg ) , update : msg -> model -> ( model, Cmd msg ) @@ -67,6 +70,7 @@ create config = , view = view { view = config.pages.bundle >> .view + , layout = config.layout.view } , onUrlChange = Url , onUrlRequest = Link @@ -173,13 +177,18 @@ subscriptions config model = view : - { view : model -> Html msg } + { view : model -> Html msg + , layout : { page : Html msg } -> Html msg + } -> Model flags model -> Browser.Document (Msg msg) view config model = { title = "App title" , body = - [ Html.map Page (config.view model.page) + [ Html.map Page <| + config.layout + { page = config.view model.page + } ] } diff --git a/examples/basic/src/Layout.elm b/examples/basic/src/Layout.elm new file mode 100644 index 0000000..00a83ae --- /dev/null +++ b/examples/basic/src/Layout.elm @@ -0,0 +1,32 @@ +module Layout exposing (view) + +import Generated.Route as Route exposing (Route) +import Html exposing (..) +import Html.Attributes as Attr + + +view : { page : Html msg } -> Html msg +view { page } = + div + [ Attr.style "margin" "2rem auto" + , Attr.style "max-width" "720px" + ] + [ header [ Attr.class "navbar" ] + (List.map viewLink + [ ( "Homepage", Route.Homepage ) + , ( "Counter", Route.Counter ) + , ( "Random", Route.Random ) + ] + ) + , page + ] + + +viewLink : ( String, Route ) -> Html msg +viewLink ( label, route ) = + a + [ Attr.href (Route.toPath route) + , Attr.style "margin-right" "1rem" + ] + [ text label + ] diff --git a/examples/basic/src/Main.elm b/examples/basic/src/Main.elm index 4f3dd37..f89f6d2 100644 --- a/examples/basic/src/Main.elm +++ b/examples/basic/src/Main.elm @@ -3,6 +3,7 @@ module Main exposing (main) import Application exposing (Application) import Generated.Pages as Pages import Generated.Route as Route +import Layout as Layout type alias Flags = @@ -16,6 +17,9 @@ main = { fromUrl = Route.fromUrl , toPath = Route.toPath } + , layout = + { view = Layout.view + } , pages = { init = Pages.init , update = Pages.update diff --git a/examples/basic/src/Pages/Homepage.elm b/examples/basic/src/Pages/Homepage.elm index 9e7a7b2..c2c5a2d 100644 --- a/examples/basic/src/Pages/Homepage.elm +++ b/examples/basic/src/Pages/Homepage.elm @@ -27,5 +27,5 @@ view : Html Msg view = div [] [ h1 [] [ text "Homepage" ] - , p [] [ text "Very boring tho..." ] + , p [] [ text "How exciting!" ] ]