feat: setup drizzle (#594)

* chore: migration to SvelteKit 2 * stage 1: migrate to svelte 5 and fix rerendering issues * stage 2: fix more $: reactivity across dashboard * fix merge conflicts * chore: migrate code in main to svelte 5 * chore: update preventDefault * chore: simplify tsconfig and remove unused mobileMenuRef in MobileMenu.svelte * chore: enforce .ts across dashboard * rename from classroomio-com to website * stage-3: Replace carbon icon svelte with lucide icon * update lock file * chore: finish icon replacement * fix: settings and setup page multiple rerender * stage 3: More icon and rerendering fixes * feat: setup drizzle and better auth * fix: onboarding validation error showing translation key #586 (#593) * fix: onboarding validation error showing translation key #586 * fix: remove debug log for profile update errors * chore: add a clean command * fix: remove message from email verification response
2025-11-01 15:49:29 +01:00
parent 97fb446df5
commit b96d91cd7c
801 changed files with 22279 additions and 10834 deletions
@@ -0,0 +1,99 @@
+<script lang="ts">
+  import { sineInOut } from 'svelte/easing';
+  import { fly } from 'svelte/transition';
+  import WinningLine from './WinningLine.svelte';
+  import { changeToComputer } from './store';
+
+  interface Game {
+    board: Array<Array<string>>;
+    click: (rowIndex: number, columnIndex: number) => Game;
+  }
+
+  export let game: Game;
+  export let winner = null;
+
+  let customDelay: number;
+
+  $: {
+    if ($changeToComputer.change) {
+      customDelay = 400;
+    } else {
+      customDelay = 0;
+    }
+  }
+</script>
+
+<div class="relative">
+  <table>
+    <tbody>
+      {#each game.board as row, rowIndex}
+        <tr>
+          {#each row as column, columnIndex}
+            <td
+              class="cursor-pointer text-center h-25 w-[1.5em] border-r-10 border-b-10 border-white last:border-r-0"
+              on:click={() => {
+                game = game.click(rowIndex, columnIndex);
+              }}
+            >
+              {#if column === 'X'}
+                <img
+                  transition:fly={{ y: 100, delay: 0, easing: sineInOut }}
+                  src="/free-tools/tic-tac/tic-tac-x.svg"
+                  alt="X icon"
+                />
+              {:else if column === 'O'}
+                <img
+                  transition:fly={{ y: 100, delay: customDelay, easing: sineInOut }}
+                  src="/free-tools/tic-tac/tic-tac-o.svg"
+                  alt="O icon"
+                />
+              {:else}
+                <!-- empty cell -->
+              {/if}
+            </td>
+          {/each}
+        </tr>
+      {/each}
+    </tbody>
+  </table>
+
+  <WinningLine {winner} />
+</div>
+
+<style>
+  table {
+    overflow: hidden;
+    border-collapse: collapse;
+    font-size: 4em;
+    color: white;
+    border: 0px;
+    z-index: 10;
+    position: relative;
+  }
+
+  td {
+    overflow: hidden;
+    text-align: center;
+    height: 100px;
+    width: 100px;
+    border-right: 10px solid white;
+    border-bottom: 10px solid white;
+    position: relative;
+    z-index: 10;
+  }
+
+  td:last-child {
+    border-right: none;
+  }
+
+  tr:last-child td {
+    border-bottom: none;
+  }
+
+  @media (max-width: 600px) {
+    td {
+      width: 16vw;
+      height: 16vw;
+    }
+  }
+</style>