From 12327ecb1f7f2d849b0d1fb9141e7c32d08e41e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Sun, 9 Oct 2022 15:37:46 +0200
Subject: [PATCH] Block scroll when opening cart

---
 src/components/organisms/Cart.svelte | 14 ++++++++++++++
 src/style/_base.scss                 |  4 ++++
 2 files changed, 18 insertions(+)

diff --git a/src/components/organisms/Cart.svelte b/src/components/organisms/Cart.svelte
index f779b8a..c1263c8 100644
--- a/src/components/organisms/Cart.svelte
+++ b/src/components/organisms/Cart.svelte
@@ -3,9 +3,11 @@
 </style>
 
 <script lang="ts">
+    import { browser } from '$app/environment'
     import { onMount } from 'svelte'
     import { fade, fly } from 'svelte/transition'
     import { quartOut } from 'svelte/easing'
+    import { smoothScroll } from '$utils/stores'
     import { cartOpen, cartData, cartAmount, cartIsUpdating } from '$utils/stores/shop'
     import { initSwell, getCart, updateCartItem, removeCartItem } from '$utils/functions/shop'
     // Components
@@ -15,6 +17,18 @@
     import ShopLocationSwitcher from '$components/molecules/ShopLocationSwitcher.svelte'
 
 
+    // Block scroll if cart is open
+    $: if (browser && $smoothScroll) {
+        if ($cartOpen) {
+            $smoothScroll.stop()
+        } else {
+            $smoothScroll.start()
+        }
+
+        document.documentElement.classList.toggle('block-scroll', $cartOpen)
+    }
+
+
     // Closing the cart
     const handleCloseCart = () => {
         $cartOpen = false
diff --git a/src/style/_base.scss b/src/style/_base.scss
index fcaa4e8..67b4be2 100644
--- a/src/style/_base.scss
+++ b/src/style/_base.scss
@@ -24,6 +24,10 @@ html {
     color: #fff;
     min-width: 320px;
     word-break: normal;
+
+    &.block-scroll {
+        overflow: hidden;
+    }
 }
 body {
     @include font-smooth;