From 225cd6fe00811b2486a50bfed4a6b7534b87d421 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Sun, 13 Nov 2022 23:16:54 +0100
Subject: [PATCH] Put wait cursor globally when page is loading

don't use a div over everything as it interacts with the current hover state of elements
instead force a cursor on every element in body when the body has a loading class
---
 src/routes/+layout.svelte | 7 +++----
 src/style/_base.scss      | 3 +++
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 9d7105e..b1f8d3d 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -43,6 +43,9 @@
         $previousPage = from.url.pathname
     })
 
+    // Define page loading
+    $: browser && document.body.classList.toggle('is-loading', $pageLoading)
+
 
     onMount(() => {
         // Avoid FOUC
@@ -69,10 +72,6 @@
     <Footer />
 {/if}
 
-{#if $pageLoading}
-    <div class="page-loading" />
-{/if}
-
 <SVGSprite />
 <SmoothScroll />
 
diff --git a/src/style/_base.scss b/src/style/_base.scss
index 67b4be2..29e662c 100644
--- a/src/style/_base.scss
+++ b/src/style/_base.scss
@@ -28,6 +28,9 @@ html {
     &.block-scroll {
         overflow: hidden;
     }
+    &.is-loading * {
+        cursor: wait !important;
+    }
 }
 body {
     @include font-smooth;