2 files changed, 37 insertions, 0 deletions
diff --git a/src/components/LoadingScreen/LoadingScreen.module.css b/src/components/LoadingScreen/LoadingScreen.module.css
new file mode 100644
index 0000000..1f690bd
--- /dev/null
+++ b/src/components/LoadingScreen/LoadingScreen.module.css
@@ -0,0 +1,27 @@
+.container {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: flex;
+    z-index: 99999;
+    background: rgb(255 255 255 / 75%);
+}
+
+.spinner {
+  width: 50px;
+  height: 50px;
+  margin: auto;
+  display: inline-block;
+  border: 3px solid #c9c9c9;
+  border-radius: 50%;
+  border-top-color: #25a070;
+  animation: spin 1s ease-in-out infinite;
+}
+
+@keyframes spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
diff --git a/src/components/LoadingScreen/LoadingScreen.tsx b/src/components/LoadingScreen/LoadingScreen.tsx
new file mode 100644
index 0000000..22509ee
--- /dev/null
+++ b/src/components/LoadingScreen/LoadingScreen.tsx
@@ -0,0 +1,10 @@
+import React from 'react';
+import styles from './LoadingScreen.module.css';
+
+export default function LoadingScreen(): JSX.Element {
+  return (
+    <div className={styles.container}>
+      <div className={styles.spinner}></div>
+    </div>
+  );
+}