From 587d8fe65d61b8f7217b4e8850b44e43159c16fb Mon Sep 17 00:00:00 2001
From: Ruben Beltran del Rio <ruben@unlimited.pizza>
Date: Sun, 21 Jan 2024 14:48:35 +0100
Subject: Save WIP

---
 src/lib/components/background.svelte | 56 ++++++++++++++++++++----------------
 1 file changed, 31 insertions(+), 25 deletions(-)

(limited to 'src/lib/components/background.svelte')

diff --git a/src/lib/components/background.svelte b/src/lib/components/background.svelte
index 1aa82fa..20b9e37 100644
--- a/src/lib/components/background.svelte
+++ b/src/lib/components/background.svelte
@@ -1,33 +1,39 @@
 <script>
-  import { browser } from '$app/environment';
-  import { canvas } from '$lib/stores/canvas';
+	import { browser } from '$app/environment';
+	import { canvas } from '$lib/stores/canvas';
 
-  const kDotSize = 32;
+	const kDotSize = 32;
 
-  $: {
-    if (browser) {
-      document.documentElement.style.setProperty('--dot-size', kDotSize + 'px');
-      document.documentElement.style.setProperty('--dot-x', kDotSize - $canvas.x % kDotSize + 'px');
-      document.documentElement.style.setProperty('--dot-y', kDotSize - $canvas.y % kDotSize + 'px');
-    }
-  }
+	$: {
+		if (browser) {
+			document.documentElement.style.setProperty('--dot-size', 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>
 
-<div class="background"></div>
+<div class="background" />
 
 <style>
-  .background {
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    user-select: none;
-    pointer-events: none;
-    background: radial-gradient(#aaa, #aaa 1px, #fff 1px, #fff var(--dot-size));
-    background-size: var(--dot-size) var(--dot-size);
-    background-position: var(--dot-x) var(--dot-y);
-    padding: 0;
-    margin: 0;
-    width: 100vw;
-    height: 100vh;
-  }
+	.background {
+		position: fixed;
+		top: 0;
+		bottom: 0;
+		user-select: none;
+		pointer-events: none;
+		background: radial-gradient(#aaa, #aaa 1px, #fff 1px, #fff var(--dot-size));
+		background-size: var(--dot-size) var(--dot-size);
+		background-position: var(--dot-x) var(--dot-y);
+		padding: 0;
+		margin: 0;
+		width: 100vw;
+		height: 100vh;
+	}
 </style>
-- 
cgit