close tags for non-void elements

package.json

@@ -30,7 +30,7 @@
     "@typescript-eslint/parser": "^7.0.0",
     "eslint": "^8.56.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-gb": "^1.5.1",
+    "eslint-plugin-gb": "^2.0.0",
     "eslint-plugin-svelte": "^2.36.0-next.4",
     "happy-dom": "^10.10.4",
     "nx": "17.2.8",

src/lib/components/Clock.svelte

@@ -61,7 +61,7 @@
 </script>
 
 <section>
-  <div class="container right-bar" bind:this={container} class:wiping />
+  <div class="container right-bar" bind:this={container} class:wiping></div>
   <nav class="button-bar">
     <button on:click={drawRandoFrame}>Go</button>
     <button on:click={wipe}>Wipe</button>

src/lib/components/Header.svelte

@@ -43,7 +43,11 @@
         }
       }}>{label}</button
     >
-    <div class="clocker" bind:this={clockContainer} class:open={clockOpen} />
+    <div
+      class="clocker"
+      bind:this={clockContainer}
+      class:open={clockOpen}
+    ></div>
     <GithubAnchor />
     <button
       on:click={() => {

src/routes/+page.svelte

@@ -10,62 +10,62 @@
     <li>
       <a href="{base}/boids">boids</a>
       <div>not yet boids</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/carnivals">carnivals</a>
       <div>random shapes</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/cloth">cloth</a>
       <div>tearable cloth</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/radu/vectors">radu/vectors</a>
       <div>vector math and visualization from radu</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/radu/virtual-world">radu/virtual-world</a>
       <div>virtual world demo from radu's machine learning course</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/siner">siner</a>
       <div>basic sine wave</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/skyline">skyline</a>
       <div>skyline</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/stilo">stilo</a>
       <div>basic points</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/three/cinematic">three/cinematic</a>
       <div>threejs cinematic camera</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/three/cuber">three/cuber</a>
       <div>threejs spinning cube basics</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/timeline">timeline</a>
       <div>scrollable infinite timeline</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
     <li>
       <a href="{base}/virtual-world">virtual-world</a>
       <div>basic</div>
-      <div class="tech" />
+      <div class="tech"></div>
     </li>
   </ul>
   <section>

src/routes/carnivals/+page.svelte

@@ -114,7 +114,7 @@
 
 <div class="content">
   <div class="canvas-box">
-    <canvas bind:this={canvas} />
+    <canvas bind:this={canvas}></canvas>
   </div>
   <div class="button-box">
     <PlayButton

src/routes/cloth/+page.svelte

@@ -268,7 +268,7 @@
     on:mousemove={setMouse}
     on:mouseup={() => (mouse.down = false)}
     on:contextmenu={(e) => e.preventDefault()}
-  />
+  ></canvas>
   <span>Drag with your mouse, right-click to slice.</span>
 </div>
 

src/routes/radu/vectors/+page.svelte

@@ -180,7 +180,7 @@
     width="500px"
     height="500px"
     style="background-color: darkred"
-  />
+  ></canvas>
 </main>
 
 <style>

src/routes/radu/virtual-world/+page.svelte

@@ -79,7 +79,7 @@
     width="500px"
     height="500px"
     style="background-color: darkred"
-  />
+  ></canvas>
 </main>
 
 <style>

src/routes/siner/+page.svelte

@@ -69,7 +69,7 @@
       frequency += dir * step;
       update();
     }}
-  />
+  ></canvas>
   <div class="freq">
     {frequency}
   </div>

src/routes/skyline/+page.svelte

@@ -81,7 +81,7 @@
 </script>
 
 <section class="container">
-  <canvas bind:this={canvas} />
+  <canvas bind:this={canvas}></canvas>
   <input bind:value={overallSpeed} type="range" max="30" min="0" />
   <div>fps: {fps.toPrecision(2)}</div>
 </section>

src/routes/stilo/+page.svelte

@@ -306,7 +306,7 @@
     on:mousemove={setMouse}
     on:mouseup={() => (mouse.down = false)}
     on:contextmenu={(e) => e.preventDefault()}
-  />
+  ></canvas>
   <nav class="button-bar">
     <button on:click={wipe}>Wipe</button>
     <button on:click={() => cloth.reset()}>Reset</button>

src/routes/three/cinematic/+page.svelte

@@ -25,4 +25,4 @@
   <meta name="description" content="Three.js example app built with Svelte" />
 </svelte:head>
 
-<canvas bind:this={el} />
+<canvas bind:this={el}></canvas>

src/routes/three/cuber/+page.svelte

@@ -14,4 +14,4 @@
   <meta name="description" content="Three.js example app built with Svelte" />
 </svelte:head>
 
-<canvas bind:this={el} />
+<canvas bind:this={el}></canvas>