OAuth working

Author: LarryKlugerDS

.gitignore

@@ -1,5 +1,7 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
+public/config.js
+
 # dependencies
 /node_modules
 /.pnp

package-lock.json

@@ -11,6 +11,7 @@
     "react-bootstrap": "^1.5.2",
     "react-dom": "^17.0.2",
     "react-scripts": "4.0.3",
+    "react-toastify": "^7.0.3",
     "web-vitals": "^1.0.1"
   },
   "scripts": {

package.json

@@ -17,6 +17,8 @@
         crossorigin="anonymous"
     > 
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!-- external configuration file. See https://stackoverflow.com/a/55019395/64904 -->
+    <script src="config.js"></script> 
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/

public/index.html

@@ -1,4 +1,47 @@
 .header {
     text-align: center;
   }
+
+.navbar-expand .navbar-nav .nav-link {
+    padding-left: 0px;
+}  
+
+.welcomeMargin {
+    margin-top: 5rem;
+}
+
+.bodyMargin{
+    margin-top: 10rem;
+}
+
+/* From http://tobiasahlin.com/spinkit/ */
+.spinner {
+    width: 40px;
+    height: 40px;
+    background-color: blue;
+    margin: 0px 0px 15px 0px;
+    -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
+    animation: sk-rotateplane 1.2s infinite ease-in-out;
+  }
+  
+  @-webkit-keyframes sk-rotateplane {
+    0% { -webkit-transform: perspective(120px) }
+    50% { -webkit-transform: perspective(120px) rotateY(180deg) }
+    100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
+  }
+  
+  @keyframes sk-rotateplane {
+    0% {
+      transform: perspective(120px) rotateX(0deg) rotateY(0deg);
+      -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
+    } 50% {
+      transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
+      -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
+    } 100% {
+      transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+      -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+    }
+  }
+  
+  @import '~react-toastify/dist/ReactToastify.css';