added spinner to data loading

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" ]