add spinner

public/style.css

@@ -169,3 +169,25 @@ body {
 .highlight {
     stroke: red;
 }
+
+.loader {
+    border: 16px solid #f3f3f3;
+    /* Light grey */
+    border-top: 16px solid #3498db;
+    /* Blue */
+    border-radius: 50%;
+    width: 120px;
+    height: 120px;
+    animation: spin 2s linear infinite;
+
+}
+
+@keyframes spin {
+    0% {
+        transform: rotate(0deg);
+    }
+
+    100% {
+        transform: rotate(360deg);
+    }
+}

src/Views/ForceDirectedGraph.elm

@@ -72,7 +72,18 @@ view global local =
             ]
         , Html.div [ style "display" "flex", style "flex-direction" "row" ]
             [ if local.loading then
-                Html.div [ style "flex-grow" "1" ] [ Html.text "Loading..." ]
+                Html.div
+                    [ style "flex-grow" "1"
+                    , style "justify-items" "center"
+                    , style "align-content" "center"
+                    ]
+                    [ Html.div [ class [ "loader" ] ] []
+                    , Html.div
+                        [ style "position" "relative"
+                        , style "bottom" "5rem"
+                        ]
+                        [ Html.text "Loading..." ]
+                    ]
 
               else
                 Html.div [ style "flex-grow" "1", style "position" "relative" ]