update deps and fix warnings (#29)

Updates a bunch of packages including Svelte 5, and other major versions. Fixes some warnings.
- Closes #28

package.json

@@ -15,31 +15,33 @@
     "test:unit": "vitest"
   },
   "devDependencies": {
-    "@playwright/test": "^1.47.0",
-    "@sveltejs/adapter-static": "^3.0.4",
-    "@sveltejs/kit": "^2.5.26",
-    "@sveltejs/vite-plugin-svelte": "^3.1.2",
+    "@playwright/test": "^1.48.2",
+    "@sveltejs/adapter-static": "^3.0.1",
+    "@sveltejs/kit": "^2.7.3",
+    "@sveltejs/vite-plugin-svelte": "^4.0.0",
     "@types/eslint": "9.6.1",
-    "@types/node": "^22.5.4",
-    "@typescript-eslint/eslint-plugin": "^8.5.0",
-    "@typescript-eslint/parser": "^8.5.0",
+    "@types/node": "^22.8.1",
+    "@typescript-eslint/eslint-plugin": "^8.11.0",
+    "@typescript-eslint/parser": "^8.11.0",
     "autoprefixer": "^10.4.20",
-    "eslint": "^9.10.0",
+    "eslint": "^9.13.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-svelte": "^2.43.0",
-    "jsdom": "^25.0.0",
-    "postcss": "^8.4.45",
+    "eslint-plugin-svelte": "^2.46.0",
+    "jsdom": "^25.0.1",
+    "npm-check-updates": "^17.1.6",
+    "postcss": "^8.4.47",
     "prettier": "^3.3.3",
-    "prettier-plugin-svelte": "^3.2.6",
-    "prettier-plugin-tailwindcss": "^0.6.6",
-    "svelte": "^4.2.19",
-    "svelte-check": "^4.0.1",
-    "tailwindcss": "^3.4.10",
-    "tslib": "^2.7.0",
-    "typescript": "^5.6.2",
-    "typescript-eslint": "^8.5.0",
-    "vite": "^5.4.3",
-    "vitest": "^2.0.5"
+    "prettier-plugin-svelte": "^3.2.7",
+    "prettier-plugin-tailwindcss": "^0.6.8",
+    "sv": "^0.5.9",
+    "svelte": "^5.1.3",
+    "svelte-check": "^4.0.5",
+    "tailwindcss": "^3.4.14",
+    "tslib": "^2.8.0",
+    "typescript": "^5.6.3",
+    "typescript-eslint": "^8.11.0",
+    "vite": "^5.4.10",
+    "vitest": "2.1.3"
   },
   "type": "module"
 }

src/components/Footer.svelte

@@ -1,11 +1,11 @@
-<script type="ts">
+<script lang="ts">
   import { base } from '$app/paths';
 </script>
 
 <footer class="freq-container flex h-[50px] items-center justify-end gap-3 text-xs font-semibold">
   <div>© {new Date().getFullYear()} Frequency Network Foundation</div>
-  <span class="h-4 w-[2px] bg-black" />
+  <span class="h-4 w-[2px] bg-black"></span>
   <a href="{base}/privacy">Privacy Policy</a>
-  <span class="h-4 w-[2px] bg-black" />
+  <span class="h-4 w-[2px] bg-black"></span>
   <div class="whitespace-nowrap">All Rights Reserved</div>
 </footer>

src/components/Header/Header.svelte

@@ -27,7 +27,7 @@
   id="header"
   class={`freq-container z-50 flex max-w-page items-center justify-between sm:pt-[10px] lg:pt-[30px] ${isNavOpen ? 'fixed' : ''}`}
 >
-  <a href="/">
+  <a href="/" aria-label="Home">
     <svg
       class="mr-3 sm:w-[180px] md:w-[180px] lg:w-[210px]"
       width="216"

src/components/Header/HeaderNavMobile.svelte

@@ -21,6 +21,6 @@
   <div class="absolute bottom-0 right-0 h-[200px] w-full overflow-hidden">
     <div
       class="absolute -bottom-1 z-[-1] h-[200px] w-full overflow-hidden bg-[url('/src/lib/assets/mobileNav.svg')] bg-right-bottom bg-no-repeat"
-    />
+    ></div>
   </div>
 </div>

src/components/Sections/Section1Wave.svelte

@@ -1,12 +1,12 @@
 <!-- Mobile -->
 <div
   class={`absolute bottom-0 w-full bg-[url(/src/lib/assets/section1waves.svg)] bg-no-repeat sm:right-[10%] sm:h-[180px] sm:bg-right-bottom md:h-[200px] lg:hidden vertical-lg:relative vertical-lg:block`}
-/>
+></div>
 
 <!-- Desktop -->
 <div
   class="relative z-10 h-full w-full bg-[url(/src/lib/assets/section1waves-top.svg)] bg-left-bottom bg-no-repeat sm:hidden lg:block vertical-lg:hidden"
-/>
+></div>
 <div
   class="relative z-0 -mt-[9px] h-[260px] w-full bg-[url(/src/lib/assets/section1waves-bottom.svg)] bg-left-top bg-no-repeat sm:hidden lg:block vertical-lg:hidden"
-/>
+></div>

src/components/Sections/Section2Wave.svelte

@@ -1,15 +1,15 @@
 <!-- Desktop -->
 <div
   class="relative z-10 h-full w-full bg-[url(/src/lib/assets/section2waves-top.svg)] bg-left-bottom bg-no-repeat sm:hidden lg:block"
-/>
+></div>
 <div
   class="relative z-0 -mt-[4px] h-[80px] w-full bg-[url(/src/lib/assets/section2waves-bottom.svg)] bg-left-top bg-no-repeat sm:hidden lg:block"
-/>
+></div>
 
 <!-- Mobile -->
 <div
   class="h-full w-full bg-[url(/src/lib/assets/section2mobile-top.svg)] bg-left-bottom bg-no-repeat sm:w-[170%] sm:max-w-[900px] md:w-[110%] md:max-w-full lg:hidden"
-/>
+></div>
 <div
   class="h-full w-full bg-[url(/src/lib/assets/section2mobile-bottom.svg)] bg-left-top bg-no-repeat sm:w-[170%] sm:max-w-[900px] md:w-[110%] md:max-w-full lg:hidden"
-/>
+></div>

src/components/Sections/Section3Wave.svelte

@@ -1,3 +1,3 @@
 <div
   class={`absolute left-0 h-full bg-left-bottom bg-no-repeat sm:-bottom-16 sm:max-h-[200px] sm:w-[200%] sm:bg-[url(/src/lib/assets/section3mobile.svg)] md:max-h-full md:w-full lg:bottom-0 lg:max-w-full lg:bg-[url(/src/lib/assets/section3waves.svg)]`}
-/>
+></div>

src/components/Sections/Section4Wave.svelte

@@ -1,3 +1,3 @@
 <div
   class={`md:max-h-auto absolute h-full bg-[url(/src/lib/assets/section4waves.svg)] bg-bottom sm:-bottom-[6px] sm:right-[10%] sm:max-h-[100px] sm:w-[800px] sm:bg-no-repeat md:right-[50%] lg:bottom-0 lg:left-auto lg:right-0 lg:max-h-[150px] lg:w-full lg:bg-repeat-x`}
-/>
+></div>

src/components/Sections/Section5.svelte

@@ -14,7 +14,7 @@
   <!-- Image -->
   <div class="absolute bottom-0 left-0 flex h-full w-full overflow-hidden sm:hidden lg:block vertical-lg:hidden">
     <Section5Wave />
-    <span class="absolute bottom-0 right-0 w-full border-b-4 border-darkIndigo" />
+    <span class="absolute bottom-0 right-0 w-full border-b-4 border-darkIndigo"></span>
   </div>
 
   <!-- Content -->

src/routes/privacy/+page.svelte

@@ -1,4 +1,4 @@
-<script type="ts">
+<script lang="ts">
   import { base } from '$app/paths';
 </script>