diff --git a/src/Main.elm b/src/Main.elm index b49e3b8ebb118ee19fd21a227cb0a3962b7263c3..a57c28de59b81d6f6e9b59e54fbb0d5e171797b4 100644 --- a/src/Main.elm +++ b/src/Main.elm @@ -188,20 +188,32 @@ viewContent : Model -> Html Msg viewContent ( global, local ) = let message = - case global.progress of - Loading -> - "Insert some loading icon here..." - - Failure msg -> - msg |> (++) "Error while loading data. " - - Success -> - "Data was loaded successfully!" + Html.div + [ Html.Attributes.style "justify-items" "center" + , Html.Attributes.style "align-content" "center" + , Html.Attributes.style "flex-grow" "1" + ] + (case global.progress of + Loading -> + [ Html.div [ Html.Attributes.class "loader" ] [] + , Html.div + [ Html.Attributes.style "position" "relative" + , Html.Attributes.style "bottom" "5rem" + ] + [ Html.text "Loading Data..." ] + ] + + Failure msg -> + [ Html.text (msg |> (++) "Error while loading data. ") ] + + Success -> + [ Html.text "Data was loaded successfully!" ] + ) in case global.view of Home -> div [ Html.Attributes.class "content" ] - [ text message ] + [ message ] Other -> div [ Html.Attributes.class "content" ]