Commits: 1
Tree example: Use Elm UI to fill the screen and center the tree
index a7f36d8..cde6818 100644
--- a/src/Tree.elm
+++ b/src/Tree.elm
@@ -3,6 +3,7 @@ module Tree exposing (main)
=import Browser
=import Browser.Events
=import Dict exposing (Dict)
+import Element
=import Html exposing (Html)
=import Json.Decode exposing (Decoder)
=import List.Extra as List
@@ -51,7 +52,7 @@ type alias Rules =
=
=init : Flags -> ( Model, Cmd Msg )
=init () =
- ( { time = 50000
+ ( { time = 0
= , rules =
= Dict.fromList
= [ ( "brown"
@@ -122,17 +123,20 @@ view model =
= )
= ]
= in
- Html.div []
- [ Html.h1 [] [ Html.text <| String.fromFloat model.time ]
- , svg
- [ viewBox "-1000 -1000 2000 2000"
- , height "800px"
- , width "800px"
- ]
- [ defs [] gradients
- , tree
- ]
+ Element.layout
+ [ Element.width Element.fill
+ , Element.height Element.fill
= ]
+ (Element.html <|
+ svg
+ [ viewBox "-1000 -1000 2000 2000"
+ , height "100%"
+ , width "100%"
+ ]
+ [ defs [] gradients
+ , tree
+ ]
+ )
=
=
=update : Msg -> Model -> ( Model, Cmd Msg )