[code] have implemented loader.css file, this CSS file is resposible for the animations for the loader used across this project.

css/loader.css

@@ -0,0 +1,67 @@
+/* This loader is taken directly from the website therange.co.uk (The Range, trading as CDS (Superstores International) Limited.)
+This loader has been mocified to suit the styling and use cases required for ourPlace. Original loader is not my property. */
+
+.loaderWrapper {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    text-align: center;
+}
+
+.loader {
+    position: relative;
+    margin: 0 auto;
+    height: 70px;
+    width: 70px;
+}
+
+.circular {
+    animation: rotate 2s linear infinite;
+    height: 100%;
+    width: 100%;
+    position: absolute;
+    top: 0; bottom: 0; left: 0; right: 0;
+    margin: auto;
+    transform-origin: center center;
+}
+
+.path {
+    stroke-dasharray: 1, 200;
+    stroke-dashoffset: 0;
+    stroke: #FFDD05;
+    animation: dash 3s cubic-bezier(1,.12,.22,1.01) infinite;
+    stroke-linecap: round;
+}
+
+@keyframes rotate {
+    100% { transform: rotate(360deg); }
+}
+
+@keyframes dash {
+    0%   { stroke-dasharray: 0, 150; }
+    40%  { stroke-dasharray: 130, 200; }
+    80%  { stroke-dasharray: 0, 25; }
+    100% { stroke-dasharray: 0, 200; }
+}
+
+.loaderLogoContain {
+    position: absolute;
+    top: 0; left: 0;
+    height: 100%;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.loaderLogo {
+    width: 45%;
+    height: 45%;
+}
+
+.loaderLoadingText {
+    color: #FFDD05;
+    font-size: 15px;
+    margin-top: 20px;
+    font-weight: 500;
+}