Partially render the boxes

1 files changed, 3 insertions, 5 deletions

diff --git a/src/lib/components/background.svelte b/src/lib/components/background.svelte
index 7664939..03c5377 100644
--- a/src/lib/components/background.svelte
+++ b/src/lib/components/background.svelte
@@ -1,16 +1,14 @@
 <script>
   import { browser } from '$app/env';
-
-  export let x;
-  export let y;
+  import { canvas } from '$lib/stores/canvas';
 
   const kDotSize = 32;
 
   $: {
     if (browser) {
       document.documentElement.style.setProperty('--dot-size', kDotSize + 'px');
-      document.documentElement.style.setProperty('--dot-x', kDotSize - x % kDotSize + 'px');
-      document.documentElement.style.setProperty('--dot-y', kDotSize - y % kDotSize + 'px');
+      document.documentElement.style.setProperty('--dot-x', kDotSize - $canvas.x % kDotSize + 'px');
+      document.documentElement.style.setProperty('--dot-y', kDotSize - $canvas.y % kDotSize + 'px');
     }
   }
 </script>