From 2c2cb29fa2f31295a23f44a81d886672c065707b Mon Sep 17 00:00:00 2001
From: Mitchell McCaffrey <mitchemmc@gmail.com>
Date: Mon, 13 Jul 2020 21:53:40 +1000
Subject: [PATCH] Moved map data overlay to not take up the full screen

---
 src/components/map/MapLoadingOverlay.js | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/components/map/MapLoadingOverlay.js b/src/components/map/MapLoadingOverlay.js
index 8374fc5..d28b1cb 100644
--- a/src/components/map/MapLoadingOverlay.js
+++ b/src/components/map/MapLoadingOverlay.js
@@ -1,7 +1,6 @@
 import React, { useContext, useEffect, useRef } from "react";
 import { Box, Progress } from "theme-ui";
 
-import Spinner from "../Spinner";
 import MapLoadingContext from "../../contexts/MapLoadingContext";
 
 function MapLoadingOverlay() {
@@ -36,18 +35,16 @@ function MapLoadingOverlay() {
       <Box
         sx={{
           position: "absolute",
-          width: "100%",
-          height: "100%",
           display: "flex",
           justifyContent: "center",
           alignItems: "center",
-          top: 0,
-          left: 0,
+          left: "8px",
+          bottom: "8px",
           flexDirection: "column",
+          borderRadius: "28px",
         }}
-        bg="muted"
+        bg="overlay"
       >
-        <Spinner />
         <Progress
           ref={progressBarRef}
           max={1}