Merge pull request #329 from relayjs/newsfeed-fix-spinner

Fix the spinner for the newsfeed example used in the Relay tutorial

Author: captbaritone

newsfeed/src/components/App.tsx

@@ -6,7 +6,13 @@ import LoadingSpinner from "./LoadingSpinner";
 export default function App(): React.ReactElement {
   return (
     <RelayEnvironment>
-      <React.Suspense fallback={<LoadingSpinner />}>
+      <React.Suspense
+        fallback={
+          <div className="app-loading-spinner">
+            <LoadingSpinner />
+          </div>
+        }
+      >
         <div className="app">
           <Newsfeed />
         </div>

newsfeed/src/style.css

@@ -284,14 +284,19 @@ body {
   box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
 }
 
-/* Spinner */
-
-.loading-spinner-wrapper {
+.app-loading-spinner {
   position: absolute;
   top: 50vh;
   left: calc(50% - 40px);
 }
 
+/* Spinner */
+
+.loading-spinner-wrapper {
+  display: flex;
+  justify-content: center;
+}
+
 .loading-spinner {
   display: inline-block;
   position: relative;