From 54cfb58b2c1586d8afef81d5c8b63ef4bb4f0906 Mon Sep 17 00:00:00 2001
From: Nathan King <nathanking3590@gmail.com>
Date: Tue, 6 Jun 2023 14:20:28 +0100
Subject: [PATCH] add loader

---
 index.html |  4 ++++
 style.css  | 21 +++++++++++++++++++++
 2 files changed, 25 insertions(+)

diff --git a/index.html b/index.html
index 4136a66..388e894 100644
--- a/index.html
+++ b/index.html
@@ -51,5 +51,9 @@ <h1>Quote from a Bot</h1>
         </div>
     </main>
 
+    <div class="loading hidden">
+        <img src="./images/loader.gif" alt="loader">
+    </div>
+
 </body>
 </html>
diff --git a/style.css b/style.css
index c479f89..207beb8 100644
--- a/style.css
+++ b/style.css
@@ -53,4 +53,25 @@ main {
 .container {
     max-width: 540px;
     margin: 0 auto;
+}
+
+.loading {
+    display: grid;
+    justify-content: center;
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    align-items: center;
+    z-index: 999;
+    background-color: rgb(161 210 255 / 80%);
+}
+
+.loading img {
+    max-width: 100px;
+}
+
+.hidden {
+    display: none;
 }
\ No newline at end of file