1 files changed, 94 insertions, 90 deletions
diff --git a/src/lib/components/Giscus.svelte b/src/lib/components/Giscus.svelte
index 6659b36..3179764 100644
--- a/src/lib/components/Giscus.svelte
+++ b/src/lib/components/Giscus.svelte
@@ -1,98 +1,102 @@
 <script lang="ts">
-	import { onMount } from "svelte";
-
-	let container: HTMLDivElement | undefined;
-	let trigger: HTMLDivElement | undefined;
-	let observer: IntersectionObserver | undefined;
-	let isLoading = false;
-	let hasLoaded = false;
-
-	function loadComments() {
-		if (!container || isLoading || hasLoaded) return;
-
-		isLoading = true;
-
-		const script = document.createElement("script");
-		script.src = "https://giscus.app/client.js";
-		script.setAttribute("data-repo", "wenekar/giscus");
-		script.setAttribute("data-repo-id", "R_kgDOREZgEQ");
-		script.setAttribute("data-category", "Announcements");
-		script.setAttribute("data-category-id", "DIC_kwDOREZgEc4C1nRY");
-		script.setAttribute("data-mapping", "pathname");
-		script.setAttribute("data-strict", "0");
-		script.setAttribute("data-reactions-enabled", "1");
-		script.setAttribute("data-emit-metadata", "0");
-		script.setAttribute("data-input-position", "top");
-		script.setAttribute("data-theme", "preferred_color_scheme");
-		script.setAttribute("data-lang", "en");
-		script.setAttribute("data-loading", "lazy");
-		script.crossOrigin = "anonymous";
-		script.async = true;
-
-		script.addEventListener("load", () => {
-			isLoading = false;
-		});
-
-		script.addEventListener("error", () => {
-			isLoading = false;
-			hasLoaded = false;
-			script.remove();
-		});
-
-		container.appendChild(script);
-		hasLoaded = true;
-		observer?.disconnect();
-		observer = undefined;
-	}
-
-	onMount(() => {
-		if (!trigger || !("IntersectionObserver" in window)) return;
-
-		observer = new IntersectionObserver(
-			(entries) => {
-				if (entries.some((entry) => entry.isIntersecting)) {
-					loadComments();
-				}
-			},
-			{ rootMargin: "300px 0px" },
-		);
-
-		observer.observe(trigger);
-
-		return () => {
-			observer?.disconnect();
-		};
-	});
+  import { onMount } from "svelte";
+
+  let container: HTMLDivElement | undefined;
+  let trigger: HTMLDivElement | undefined;
+  let observer: IntersectionObserver | undefined;
+  let isLoading = false;
+  let hasLoaded = false;
+
+  function loadComments() {
+    if (!container || isLoading || hasLoaded) return;
+
+    isLoading = true;
+
+    const script = document.createElement("script");
+    script.src = "https://giscus.app/client.js";
+    script.setAttribute("data-repo", "wenekar/giscus");
+    script.setAttribute("data-repo-id", "R_kgDOREZgEQ");
+    script.setAttribute("data-category", "Announcements");
+    script.setAttribute("data-category-id", "DIC_kwDOREZgEc4C1nRY");
+    script.setAttribute("data-mapping", "pathname");
+    script.setAttribute("data-strict", "0");
+    script.setAttribute("data-reactions-enabled", "1");
+    script.setAttribute("data-emit-metadata", "0");
+    script.setAttribute("data-input-position", "top");
+    script.setAttribute("data-theme", "preferred_color_scheme");
+    script.setAttribute("data-lang", "en");
+    script.setAttribute("data-loading", "lazy");
+    script.crossOrigin = "anonymous";
+    script.async = true;
+
+    script.addEventListener("load", () => {
+      isLoading = false;
+    });
+
+    script.addEventListener("error", () => {
+      isLoading = false;
+      hasLoaded = false;
+      script.remove();
+    });
+
+    container.appendChild(script);
+    hasLoaded = true;
+    observer?.disconnect();
+    observer = undefined;
+  }
+
+  onMount(() => {
+    if (!trigger || !("IntersectionObserver" in window)) return;
+
+    observer = new IntersectionObserver(
+      (entries) => {
+        if (entries.some((entry) => entry.isIntersecting)) {
+          loadComments();
+        }
+      },
+      { rootMargin: "300px 0px" },
+    );
+
+    observer.observe(trigger);
+
+    return () => {
+      observer?.disconnect();
+    };
+  });
 </script>
 
 <div class="giscus-container">
-	{#if !hasLoaded}
-		<button class="comments-toggle" on:click={loadComments} disabled={isLoading}>
-			{isLoading ? "Loading comments..." : "Show comments"}
-		</button>
-	{/if}
-
-	<div class="giscus-trigger" bind:this={trigger}></div>
-	<div bind:this={container}></div>
+  {#if !hasLoaded}
+    <button
+      class="comments-toggle"
+      on:click={loadComments}
+      disabled={isLoading}
+    >
+      {isLoading ? "Loading comments..." : "Show comments"}
+    </button>
+  {/if}
+
+  <div class="giscus-trigger" bind:this={trigger}></div>
+  <div bind:this={container}></div>
 </div>
 
 <style>
-	.comments-toggle {
-		margin-bottom: 1rem;
-		padding: 0.6rem 0.9rem;
-		border: 1px solid var(--border);
-		background: transparent;
-		color: var(--text);
-		font: inherit;
-		cursor: pointer;
-	}
-
-	.comments-toggle:disabled {
-		opacity: 0.75;
-		cursor: default;
-	}
-
-	.giscus-trigger {
-		height: 1px;
-	}
+  .comments-toggle {
+    margin-bottom: 1rem;
+    padding: 0.6rem 0.9rem;
+    border: 1px solid var(--border);
+    background: transparent;
+    color: var(--text);
+    font: inherit;
+    cursor: pointer;
+  }
+
+  .comments-toggle:disabled {
+    opacity: 0.75;
+    cursor: default;
+  }
+
+  .giscus-trigger {
+    height: 1px;
+  }
 </style>