From 69753f974994b49b2df059f9b5b401d14db4a8fa Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Fri, 23 Jan 2026 02:20:50 -0800
Subject: refactor: Migrate event handlers to new Svelte 5 syntax

---
 src/lib/Announcement.svelte                        |  2 +-
 src/lib/CommandPalette/CommandPalette.svelte       |  8 ++---
 src/lib/Error/LogInRestricted.svelte               |  2 +-
 .../EasterEvent2025/ClickableAreaPage.svelte       |  2 +-
 .../AniListBadges/EasterEvent2025/EasterEgg.svelte |  8 ++---
 .../EasterEvent2025/MultipleChoicePage.svelte      |  2 +-
 .../EasterEvent2025/RiddlePage.svelte              |  4 +--
 src/lib/Hololive/Stream.svelte                     |  2 +-
 src/lib/Image/FallbackImage.svelte                 |  2 +-
 src/lib/Image/ParallaxImage.svelte                 |  4 +--
 src/lib/Landing.svelte                             |  2 +-
 src/lib/Layout/Dropdown.svelte                     | 12 ++++---
 src/lib/Layout/Popup.svelte                        |  2 +-
 src/lib/List/Anime/CleanAnimeList.svelte           |  6 ++--
 src/lib/List/CleanGrid.svelte                      |  2 +-
 src/lib/List/CleanList.svelte                      |  2 +-
 src/lib/List/Manga/CleanMangaList.svelte           | 10 +++---
 src/lib/List/Manga/MangaListTemplate.svelte        |  6 ++--
 src/lib/Loading/Message.svelte                     |  2 +-
 src/lib/Notification/Notification.svelte           |  8 ++---
 src/lib/Settings/Categories/Cache.svelte           |  4 +--
 src/lib/Settings/Categories/Calculation.svelte     |  2 +-
 src/lib/Settings/Categories/Debug.svelte           |  6 ++--
 src/lib/Settings/Categories/Display.svelte         |  4 +--
 src/lib/Settings/Categories/RSSFeeds.svelte        |  4 +--
 src/lib/Settings/Categories/SettingSync.svelte     |  8 ++---
 src/lib/Settings/SettingCheckboxToggle.svelte      |  6 ++--
 src/lib/Settings/SettingToggle.svelte              |  2 +-
 src/lib/Tools/ActivityHistory/Grid.svelte          |  4 +--
 src/lib/Tools/ActivityHistory/Tool.svelte          |  2 +-
 src/lib/Tools/FollowFix.svelte                     |  4 +--
 src/lib/Tools/Hayai.svelte                         |  2 +-
 src/lib/Tools/InputTemplate.svelte                 |  4 +--
 src/lib/Tools/Picker.svelte                        |  2 +-
 src/lib/Tools/Tracker/Tool.svelte                  | 10 +++---
 src/lib/Tools/Wrapped/Media.svelte                 |  4 +--
 src/lib/Tools/Wrapped/MediaExtras.svelte           |  4 +--
 src/lib/Tools/Wrapped/Tool.svelte                  | 24 +++++++-------
 src/lib/Tools/Wrapped/Top/Activity.svelte          |  2 +-
 src/lib/Tooltip/LinkedTooltip.svelte               |  6 ++--
 src/lib/User/BadgeWall/BadgePreview.svelte         | 11 +++----
 src/lib/User/BadgeWall/Badges.svelte               |  4 +--
 src/lib/User/BadgeWall/FallbackBadge.svelte        |  8 ++---
 src/routes/+layout.svelte                          |  2 +-
 .../anilist-badges-easter-event-2025/+page.svelte  |  2 +-
 src/routes/events/group/[group]/+page.svelte       |  2 +-
 src/routes/hololive/[[stream]]/+page.svelte        |  4 +--
 src/routes/schedule/+page.svelte                   |  2 +-
 src/routes/settings/+page.svelte                   |  2 +-
 src/routes/tools/+page.svelte                      |  2 +-
 src/routes/tools/[tool]/+page.svelte               |  2 +-
 src/routes/user/[user]/+page.svelte                | 22 ++++++-------
 src/routes/user/[user]/badges/+page.svelte         | 38 +++++++++++-----------
 53 files changed, 147 insertions(+), 146 deletions(-)

diff --git a/src/lib/Announcement.svelte b/src/lib/Announcement.svelte
index 9a348f7a..4fbe9de0 100644
--- a/src/lib/Announcement.svelte
+++ b/src/lib/Announcement.svelte
@@ -43,7 +43,7 @@
 
     <Spacer />
 
-    <button on:click={dismiss} class="dismiss">{dismissButton || 'Dismiss'}</button>
+    <button onclick={dismiss} class="dismiss">{dismissButton || 'Dismiss'}</button>
   </Popup>
 {/if}
 
diff --git a/src/lib/CommandPalette/CommandPalette.svelte b/src/lib/CommandPalette/CommandPalette.svelte
index 566dd9d9..735941fb 100644
--- a/src/lib/CommandPalette/CommandPalette.svelte
+++ b/src/lib/CommandPalette/CommandPalette.svelte
@@ -134,13 +134,13 @@
   };
 </script>
 
-<svelte:window on:click={handleClickOutside} />
+<svelte:window onclick={handleClickOutside} />
 
 {#if isVisible}
   <!-- svelte-ignore a11y_click_events_have_key_events a11y_no_static_element_interactions -->
   <div
     class="command-palette-overlay {open ? 'fade-in' : 'fade-out'}"
-    on:click={() => (open = false)}
+    onclick={() => (open = false)}
   ></div>
 
   <div class="dropdown {open ? 'fade-in' : 'fade-out'}">
@@ -150,7 +150,7 @@
         bind:value={search}
         class="command-input"
         placeholder="Search"
-        on:keydown={handleKey}
+        onkeydown={handleKey}
       />
 
       <div class="results-container">
@@ -161,7 +161,7 @@
             in:fly={{ y: 20, duration: 150, delay: i * 30 }}
             out:fly={{ y: -20, duration: 150 }}
             animate:flip={{ duration: 200 }}
-            on:click={(e) => {
+            onclick={(e) => {
               if (item.preventDefault) e.preventDefault();
               if (item.onClick) item.onClick();
 
diff --git a/src/lib/Error/LogInRestricted.svelte b/src/lib/Error/LogInRestricted.svelte
index 54ea5ee1..ab48f180 100644
--- a/src/lib/Error/LogInRestricted.svelte
+++ b/src/lib/Error/LogInRestricted.svelte
@@ -8,7 +8,7 @@
   <div class="message">
     Please <a
       href={`https://anilist.co/api/v2/oauth/authorize?client_id=${env.PUBLIC_ANILIST_CLIENT_ID}&redirect_uri=${env.PUBLIC_ANILIST_REDIRECT_URI}&response_type=code`}
-      on:click={async () => {
+      onclick={async () => {
         await localforage.setItem(
           'redirect',
           window.location.origin + window.location.pathname + window.location.search
diff --git a/src/lib/Events/AniListBadges/EasterEvent2025/ClickableAreaPage.svelte b/src/lib/Events/AniListBadges/EasterEvent2025/ClickableAreaPage.svelte
index 65144588..494eb6be 100644
--- a/src/lib/Events/AniListBadges/EasterEvent2025/ClickableAreaPage.svelte
+++ b/src/lib/Events/AniListBadges/EasterEvent2025/ClickableAreaPage.svelte
@@ -17,7 +17,7 @@
   <p class="big-text">{prompt}</p>
 
   {#each images as url, i}
-    <a href={'#'} on:click={() => handleClick(i)}>
+    <a href={'#'} onclick={() => handleClick(i)}>
       <img
         src={url}
         alt="Option {i + 1}"
diff --git a/src/lib/Events/AniListBadges/EasterEvent2025/EasterEgg.svelte b/src/lib/Events/AniListBadges/EasterEvent2025/EasterEgg.svelte
index 0d0a46d1..bdb6fa4e 100644
--- a/src/lib/Events/AniListBadges/EasterEvent2025/EasterEgg.svelte
+++ b/src/lib/Events/AniListBadges/EasterEvent2025/EasterEgg.svelte
@@ -108,7 +108,7 @@
     id="egg-click-{targetID}-{id}"
     role="button"
     tabindex="0"
-    on:mousedown={handleClick}
+    onmousedown={handleClick}
     class="egg click-layer"
   />
 {/if}
@@ -119,7 +119,7 @@
       <div class="event-popup-banner">
         <a
           href={'#'}
-          on:click={() =>
+          onclick={() =>
             copyCode(
               'https://files.anilist-badges.com/badges/events/2025/04/20-Easter-2025-Epexity-event-banner-1.png'
             )}
@@ -142,7 +142,7 @@
       <div class="event-popup-badges">
         <a
           href={'#'}
-          on:click={() =>
+          onclick={() =>
             copyCode(
               'https://files.anilist-badges.com/badges/events/2025/04/20-Easter-2025-Basurahan-1.png'
             )}
@@ -155,7 +155,7 @@
 
         <a
           href={'#'}
-          on:click={() =>
+          onclick={() =>
             copyCode(
               'https://files.anilist-badges.com/badges/events/2025/04/20-Easter-2025-Dxvxdffm-1.png'
             )}
diff --git a/src/lib/Events/AniListBadges/EasterEvent2025/MultipleChoicePage.svelte b/src/lib/Events/AniListBadges/EasterEvent2025/MultipleChoicePage.svelte
index c6b49461..6ba477be 100644
--- a/src/lib/Events/AniListBadges/EasterEvent2025/MultipleChoicePage.svelte
+++ b/src/lib/Events/AniListBadges/EasterEvent2025/MultipleChoicePage.svelte
@@ -22,7 +22,7 @@
 
   {#each answers as answer, i}
     <button
-      on:click={() => handleChoice(i)}
+      onclick={() => handleChoice(i)}
       style={selected === i
         ? i === correctIndex
           ? 'background: var(--base0B)'
diff --git a/src/lib/Events/AniListBadges/EasterEvent2025/RiddlePage.svelte b/src/lib/Events/AniListBadges/EasterEvent2025/RiddlePage.svelte
index a4927f01..664d5e27 100644
--- a/src/lib/Events/AniListBadges/EasterEvent2025/RiddlePage.svelte
+++ b/src/lib/Events/AniListBadges/EasterEvent2025/RiddlePage.svelte
@@ -18,9 +18,9 @@
 <div class="container">
   <p class="big-text">{riddle}</p>
 
-  <input bind:value={userInput} on:keyup={(e) => e.key === 'Enter' && checkAnswer()} />
+  <input bind:value={userInput} onkeyup={(e) => e.key === 'Enter' && checkAnswer()} />
 
-  <button on:click={checkAnswer}>Submit</button>
+  <button onclick={checkAnswer}>Submit</button>
 
   {#if hint}
     <br />
diff --git a/src/lib/Hololive/Stream.svelte b/src/lib/Hololive/Stream.svelte
index 12681acb..1c55a9dd 100644
--- a/src/lib/Hololive/Stream.svelte
+++ b/src/lib/Hololive/Stream.svelte
@@ -16,7 +16,7 @@
     <div class="pin-icon">
       <a
         href={'#'}
-        on:click={(e) => {
+        onclick={(e) => {
           e.preventDefault();
           pinStream(live.streamer);
         }}
diff --git a/src/lib/Image/FallbackImage.svelte b/src/lib/Image/FallbackImage.svelte
index 2029cf0e..7e458339 100644
--- a/src/lib/Image/FallbackImage.svelte
+++ b/src/lib/Image/FallbackImage.svelte
@@ -27,7 +27,7 @@
     alt={alternative}
     loading="lazy"
     class="badge"
-    on:error={(e) => delayedReplace(e, fallback)}
+    onerror={(e) => delayedReplace(e, fallback)}
     {style}
   />
 {:else if !hideOnError}
diff --git a/src/lib/Image/ParallaxImage.svelte b/src/lib/Image/ParallaxImage.svelte
index 48565ce1..49588207 100644
--- a/src/lib/Image/ParallaxImage.svelte
+++ b/src/lib/Image/ParallaxImage.svelte
@@ -40,7 +40,7 @@
     -$mouse.x / 10
   }deg); border-radius: ${borderRadius}; ${style}`}
   alt={alternativeText}
-  on:mousemove={handleMouseMove}
-  on:mouseleave={handleMouseLeave}
+  onmousemove={handleMouseMove}
+  onmouseleave={handleMouseLeave}
   class={classList}
 />
diff --git a/src/lib/Landing.svelte b/src/lib/Landing.svelte
index 5e2d4ccd..8fb8f72b 100644
--- a/src/lib/Landing.svelte
+++ b/src/lib/Landing.svelte
@@ -94,7 +94,7 @@
     <span class="medium-text">
       <a
         href={`https://anilist.co/api/v2/oauth/authorize?client_id=${env.PUBLIC_ANILIST_CLIENT_ID}&redirect_uri=${env.PUBLIC_ANILIST_REDIRECT_URI}&response_type=code`}
-        on:click={async () => {
+        onclick={async () => {
           await localforage.setItem(
             'redirect',
             window.location.origin + window.location.pathname + window.location.search
diff --git a/src/lib/Layout/Dropdown.svelte b/src/lib/Layout/Dropdown.svelte
index 0cbf2f6f..b0923fb2 100644
--- a/src/lib/Layout/Dropdown.svelte
+++ b/src/lib/Layout/Dropdown.svelte
@@ -18,7 +18,7 @@
   };
 </script>
 
-<svelte:window on:click={handleClickOutside} />
+<svelte:window onclick={handleClickOutside} />
 
 <div
   class="dropdown"
@@ -30,8 +30,12 @@
   <span
     class={`${header ? 'header-item' : ''} dropdown-toggle`}
     id="dropdown-toggle"
-    on:click|preventDefault={() => (open = !open)}
-    on:keydown={() => {}}
+    onclick={(e) => {
+      e.preventDefault();
+
+      open = !open;
+    }}
+    onkeydown={() => {}}
     role="button"
     tabindex="0"
   >
@@ -47,7 +51,7 @@
       <a
         href={item.url}
         class="header-item"
-        on:click={(e) => {
+        onclick={(e) => {
           if (item.preventDefault) e.preventDefault();
           if (item.onClick) item.onClick();
         }}
diff --git a/src/lib/Layout/Popup.svelte b/src/lib/Layout/Popup.svelte
index b82e86c2..1e3d7b2c 100644
--- a/src/lib/Layout/Popup.svelte
+++ b/src/lib/Layout/Popup.svelte
@@ -34,7 +34,7 @@
   }
 </script>
 
-<svelte:window on:click={handleClickOutside} />
+<svelte:window onclick={handleClickOutside} />
 
 {#if show}
   <div class={`popup ${fullscreen ? 'popup-fullscreen' : ''}`}>
diff --git a/src/lib/List/Anime/CleanAnimeList.svelte b/src/lib/List/Anime/CleanAnimeList.svelte
index 1a3cd7cc..b7b7a6cb 100644
--- a/src/lib/List/Anime/CleanAnimeList.svelte
+++ b/src/lib/List/Anime/CleanAnimeList.svelte
@@ -148,7 +148,7 @@
 />
 
 {#if media.length === 0}
-  No anime to display. <button on:click={() => (animeLists = cleanCache(user, $identity))}>
+  No anime to display. <button onclick={() => (animeLists = cleanCache(user, $identity))}>
     Force refresh
   </button>
 {:else if $settings.displayMediaListFilter && !disableFilter}
@@ -178,7 +178,7 @@
         <button
           class={`button-square button-action ${pendingUpdate === anime.id ? 'opaque' : ''}`}
           style={pendingUpdate === anime.id ? 'pointer-events: none;' : ''}
-          on:click={() => increment(anime, progress)}>+</button
+          onclick={() => increment(anime, progress)}>+</button
         >
         {#if !completed || dummy}
           [{anime.nextAiringEpisode?.episode === -1
@@ -211,7 +211,7 @@
         <button
           class={`button-square button-action ${pendingUpdate === anime.id ? 'opaque' : ''}`}
           style={pendingUpdate === anime.id ? 'pointer-events: none;' : ''}
-          on:click={() => increment(anime, progress)}>+</button
+          onclick={() => increment(anime, progress)}>+</button
         >
         {#if !completed}
           [{anime.nextAiringEpisode?.episode === -1
diff --git a/src/lib/List/CleanGrid.svelte b/src/lib/List/CleanGrid.svelte
index 1bd65feb..119e4d71 100644
--- a/src/lib/List/CleanGrid.svelte
+++ b/src/lib/List/CleanGrid.svelte
@@ -38,7 +38,7 @@
               href={$settings.displayCopyMediaTitleNotLink
                 ? '#'
                 : outboundLink(title, type, $settings.displayOutboundLinksTo)}
-              on:click={(e) => {
+              onclick={(e) => {
                 if ($settings.displayCopyMediaTitleNotLink) {
                   e.preventDefault();
 
diff --git a/src/lib/List/CleanList.svelte b/src/lib/List/CleanList.svelte
index 79011ea8..63656ab3 100644
--- a/src/lib/List/CleanList.svelte
+++ b/src/lib/List/CleanList.svelte
@@ -35,7 +35,7 @@
               href={$settings.displayCopyMediaTitleNotLink
                 ? '#'
                 : outboundLink(title, type, $settings.displayOutboundLinksTo)}
-              on:click={(e) => {
+              onclick={(e) => {
                 if ($settings.displayCopyMediaTitleNotLink) {
                   e.preventDefault();
 
diff --git a/src/lib/List/Manga/CleanMangaList.svelte b/src/lib/List/Manga/CleanMangaList.svelte
index a4159dfa..ecf7fa5a 100644
--- a/src/lib/List/Manga/CleanMangaList.svelte
+++ b/src/lib/List/Manga/CleanMangaList.svelte
@@ -93,7 +93,7 @@
       <button
         class="small-button"
         title="Force a full refresh"
-        on:click={cleanCache}
+        onclick={cleanCache}
         data-umami-event="Force Refresh Manga">Refresh</button
       >
     {/if}
@@ -129,14 +129,14 @@
   {/if}
 
   <p>
-    No manga to display. <button on:click={cleanCache} data-umami-event="Force Refresh No Manga"
+    No manga to display. <button onclick={cleanCache} data-umami-event="Force Refresh No Manga"
       >Force refresh</button
     >
   </p>
 
   <span>
     Don't read manga? <button
-      on:click={() => ($settings.disableManga = true)}
+      onclick={() => ($settings.disableManga = true)}
       data-umami-event="Disable No Manga">Hide the manga panel</button
     >
     You can re-enable it later in the <a href={root('/settings')}>Settings</a>.
@@ -162,7 +162,7 @@
       <button
         class={`button-square button-action ${pendingUpdate === manga.id ? 'opaque' : ''}`}
         style={pendingUpdate === manga.id ? 'pointer-events: none;' : ''}
-        on:click={() => increment(manga)}
+        onclick={() => increment(manga)}
       >
         +
       </button>
@@ -190,7 +190,7 @@
       <button
         class={`button-square button-action ${pendingUpdate === manga.id ? 'opaque' : ''}`}
         style={pendingUpdate === manga.id ? 'pointer-events: none;' : ''}
-        on:click={() => increment(manga)}
+        onclick={() => increment(manga)}
       >
         +
       </button>
diff --git a/src/lib/List/Manga/MangaListTemplate.svelte b/src/lib/List/Manga/MangaListTemplate.svelte
index 83c491c8..3fee9f6a 100644
--- a/src/lib/List/Manga/MangaListTemplate.svelte
+++ b/src/lib/List/Manga/MangaListTemplate.svelte
@@ -276,7 +276,7 @@
           <button
             data-umami-event="Force Refresh Manga"
             title="Force a full refresh"
-            on:click={() => {
+            onclick={() => {
               cleanCache();
 
               forceFlag = true;
@@ -324,7 +324,7 @@
             <button
               data-umami-event="Force Refresh Manga"
               title="Force a full refresh"
-              on:click={() => {
+              onclick={() => {
                 cleanCache();
 
                 forceFlag = true;
@@ -356,7 +356,7 @@
           <button
             data-umami-event="Force Refresh Manga"
             title="Force a full refresh"
-            on:click={() => {
+            onclick={() => {
               cleanCache();
 
               forceFlag = true;
diff --git a/src/lib/Loading/Message.svelte b/src/lib/Loading/Message.svelte
index 5aabec9c..53c993d3 100644
--- a/src/lib/Loading/Message.svelte
+++ b/src/lib/Loading/Message.svelte
@@ -32,7 +32,7 @@
       <slot />
 
       {#if withReload}
-        Please <a href={'#'} on:click={() => location.reload()}>try again</a> later.
+        Please <a href={'#'} onclick={() => location.reload()}>try again</a> later.
       {/if}
     {/if}
   </div>
diff --git a/src/lib/Notification/Notification.svelte b/src/lib/Notification/Notification.svelte
index c4232ced..ec8d5be7 100644
--- a/src/lib/Notification/Notification.svelte
+++ b/src/lib/Notification/Notification.svelte
@@ -21,8 +21,8 @@
   <div
     id="notification-container"
     class={removed ? 'fade-out' : 'fade-in'}
-    on:click={remove}
-    on:keydown={() => {
+    onclick={remove}
+    onkeydown={() => {
       return;
     }}
     role="button"
@@ -33,8 +33,8 @@
       <details
         open
         id="notification"
-        on:click|preventDefault={(event) => event.preventDefault()}
-        on:keydown={() => {
+        onclick={(event) => event.preventDefault()}
+        onkeydown={() => {
           return;
         }}
       >
diff --git a/src/lib/Settings/Categories/Cache.svelte b/src/lib/Settings/Categories/Cache.svelte
index 337d4a41..68783bdf 100644
--- a/src/lib/Settings/Categories/Cache.svelte
+++ b/src/lib/Settings/Categories/Cache.svelte
@@ -19,7 +19,7 @@ Re-cache AniList media lists every
   max="60"
   placeholder="30"
   size="1"
-  on:change={() =>
+  onchange={() =>
     ($settings.cacheMinutes < 1 && ($settings.cacheMinutes = 1)) ||
     ($settings.cacheMinutes > 60 && ($settings.cacheMinutes = 60))}
 />
@@ -36,7 +36,7 @@ Re-cache manga data every
   max="1440"
   placeholder="120"
   size="2"
-  on:change={() =>
+  onchange={() =>
     ($settings.cacheMangaMinutes < 5 && ($settings.cacheMangaMinutes = 5)) ||
     ($settings.cacheMangaMinutes > 1440 && ($settings.cacheMangaMinutes = 1440))}
 />
diff --git a/src/lib/Settings/Categories/Calculation.svelte b/src/lib/Settings/Categories/Calculation.svelte
index f01cc1ff..99e42463 100644
--- a/src/lib/Settings/Categories/Calculation.svelte
+++ b/src/lib/Settings/Categories/Calculation.svelte
@@ -75,7 +75,7 @@
 {#if !$settings.calculateGuessingDisabled}
   <br />
 
-  <select bind:value={$settings.calculateGuessMethod} on:change={pruneAllManga}>
+  <select bind:value={$settings.calculateGuessMethod} onchange={pruneAllManga}>
     <option value="mode">Mode (fast, moderate to low accuracy)</option>
     <option value="median">Median (moderate speed, high accuracy, recommended)</option>
     <option value="iqr_median">Interquartile Range with Median (slower, high accuracy)</option>
diff --git a/src/lib/Settings/Categories/Debug.svelte b/src/lib/Settings/Categories/Debug.svelte
index 1b6cbedd..8bae4c84 100644
--- a/src/lib/Settings/Categories/Debug.svelte
+++ b/src/lib/Settings/Categories/Debug.svelte
@@ -24,12 +24,12 @@
 
 <SettingCheckboxToggle setting="debugDummyLists" text={$locale().debug.dummyLists} />
 
-<button on:click={clearCaches}>{$locale().debug.clearCaches}</button>
+<button onclick={clearCaches}>{$locale().debug.clearCaches}</button>
 
 <Spacer />
 
 <button
-  on:click={() => {
+  onclick={() => {
     settings.reset();
     addNotification(
       options({
@@ -47,7 +47,7 @@
 <Spacer />
 
 <button
-  on:click={async () => {
+  onclick={async () => {
     await localforage.clear();
     addNotification(
       options({
diff --git a/src/lib/Settings/Categories/Display.svelte b/src/lib/Settings/Categories/Display.svelte
index d9dad534..d60da05a 100644
--- a/src/lib/Settings/Categories/Display.svelte
+++ b/src/lib/Settings/Categories/Display.svelte
@@ -283,7 +283,7 @@
     min="50"
     placeholder="116.609"
     size="3"
-    on:change={() => {
+    onchange={() => {
       if ($settings.displayCoverWidth === null) {
         $settings.displayCoverWidth = 116.609;
 
@@ -387,7 +387,7 @@ Anime sort order
 
 <br />
 
-<select bind:value={$settings.displayAoButa} on:change={onHelperChange}>
+<select bind:value={$settings.displayAoButa} onchange={onHelperChange}>
   <option value="mai">{$locale().settings.display.categories.helper.options.mai}</option>
   <option value="mai_2">{$locale().settings.display.categories.helper.options.mai} #2</option>
   <option value="nodoka">{$locale().settings.display.categories.helper.options.nodoka}</option>
diff --git a/src/lib/Settings/Categories/RSSFeeds.svelte b/src/lib/Settings/Categories/RSSFeeds.svelte
index 00b0bba4..c8a47385 100644
--- a/src/lib/Settings/Categories/RSSFeeds.svelte
+++ b/src/lib/Settings/Categories/RSSFeeds.svelte
@@ -10,7 +10,7 @@
 </script>
 
 <button
-  on:click={() => {
+  onclick={() => {
     addNotification(
       options({
         heading: 'RSS feed URL copied to clipboard'
@@ -29,7 +29,7 @@ Your AniList notifications RSS feed URL
 <SettingHint lineBreak>
   This <a
     href={'#'}
-    on:click={(e) => e.preventDefault()}
+    onclick={(e) => e.preventDefault()}
     target="_blank"
     title={$locale().settings.rssFeeds.tooltips.rss}
     use:tooltip
diff --git a/src/lib/Settings/Categories/SettingSync.svelte b/src/lib/Settings/Categories/SettingSync.svelte
index 183dc13f..d69eab09 100644
--- a/src/lib/Settings/Categories/SettingSync.svelte
+++ b/src/lib/Settings/Categories/SettingSync.svelte
@@ -12,7 +12,7 @@
 
 {#if !$settings.settingsSync}
   <button
-    on:click={() => {
+    onclick={() => {
       $settings.settingsSync = true;
 
       fetch(root(`/api/configuration?id=${$identity.id}`)).then((response) => {
@@ -51,7 +51,7 @@
   </SettingHint>
   <Spacer />
   <button
-    on:click={() => {
+    onclick={() => {
       $settings.settingsSync = true;
 
       fetch(root(`/api/configuration`), {
@@ -75,7 +75,7 @@
   </SettingHint>
 {:else}
   <button
-    on:click={() => {
+    onclick={() => {
       $settings.settingsSync = false;
 
       addNotification(
@@ -88,7 +88,7 @@
     {$locale().settings.settingsSync.buttons.disable}
   </button>
   <button
-    on:click={() => {
+    onclick={() => {
       fetch(root(`/api/configuration?id=${$identity.id}`), {
         method: 'DELETE'
       }).then((response) => {
diff --git a/src/lib/Settings/SettingCheckboxToggle.svelte b/src/lib/Settings/SettingCheckboxToggle.svelte
index 751a085c..c9d82907 100644
--- a/src/lib/Settings/SettingCheckboxToggle.svelte
+++ b/src/lib/Settings/SettingCheckboxToggle.svelte
@@ -54,11 +54,11 @@
   };
 </script>
 
-<input type="checkbox" on:change={check} bind:checked {id} />
+<input type="checkbox" onchange={check} bind:checked {id} />
 
 <span
-  on:click={flip}
-  on:keydown={() => {
+  onclick={flip}
+  onkeydown={() => {
     return;
   }}
   role="button"
diff --git a/src/lib/Settings/SettingToggle.svelte b/src/lib/Settings/SettingToggle.svelte
index c2c3f3ff..d7e31322 100644
--- a/src/lib/Settings/SettingToggle.svelte
+++ b/src/lib/Settings/SettingToggle.svelte
@@ -11,7 +11,7 @@
 
 <a
   href={'#'}
-  on:click={() =>
+  onclick={() =>
     disabled
       ? {}
       : $settings[setting]
diff --git a/src/lib/Tools/ActivityHistory/Grid.svelte b/src/lib/Tools/ActivityHistory/Grid.svelte
index e4ad6332..b693f912 100644
--- a/src/lib/Tools/ActivityHistory/Grid.svelte
+++ b/src/lib/Tools/ActivityHistory/Grid.svelte
@@ -45,8 +45,8 @@
       <div
         class="grid-item"
         style="background-color: {gradientColour(activity.amount, highestActivity, baseHue)}"
-        on:click={() => (baseHue = Math.floor(Math.random() * 360))}
-        on:keydown={() => {
+        onclick={() => (baseHue = Math.floor(Math.random() * 360))}
+        onkeydown={() => {
           return;
         }}
         role="button"
diff --git a/src/lib/Tools/ActivityHistory/Tool.svelte b/src/lib/Tools/ActivityHistory/Tool.svelte
index e439ed4d..6f6282a6 100644
--- a/src/lib/Tools/ActivityHistory/Tool.svelte
+++ b/src/lib/Tools/ActivityHistory/Tool.svelte
@@ -88,7 +88,7 @@
           <Spacer />
         {/if}
 
-        <button on:click={screenshot}>Generate grid image</button>
+        <button onclick={screenshot}>Generate grid image</button>
       </div>
 
       <Spacer />
diff --git a/src/lib/Tools/FollowFix.svelte b/src/lib/Tools/FollowFix.svelte
index b9fddeff..58f31e8c 100644
--- a/src/lib/Tools/FollowFix.svelte
+++ b/src/lib/Tools/FollowFix.svelte
@@ -19,7 +19,7 @@
       minlength="1"
       placeholder="Username"
       bind:value={input}
-      on:keypress={(e) => {
+      onkeypress={(e) => {
         if (e.key === 'Enter') {
           submit = input;
 
@@ -28,7 +28,7 @@
         }
       }}
     />
-    <a href={'#'} on:click={() => (submit = input)}>
+    <a href={'#'} onclick={() => (submit = input)}>
       Toggle follow for {input.length === 0 ? '...' : input}
     </a>
   </p>
diff --git a/src/lib/Tools/Hayai.svelte b/src/lib/Tools/Hayai.svelte
index 79459985..1ba99d86 100644
--- a/src/lib/Tools/Hayai.svelte
+++ b/src/lib/Tools/Hayai.svelte
@@ -99,5 +99,5 @@
 
   <Spacer />
 
-  <input type="file" id="epub-file" accept=".epub" on:change={handleFileUpload} />
+  <input type="file" id="epub-file" accept=".epub" onchange={handleFileUpload} />
 </div>
diff --git a/src/lib/Tools/InputTemplate.svelte b/src/lib/Tools/InputTemplate.svelte
index c0ee4f1d..5627eda6 100644
--- a/src/lib/Tools/InputTemplate.svelte
+++ b/src/lib/Tools/InputTemplate.svelte
@@ -30,7 +30,7 @@
       type="text"
       placeholder={field}
       bind:value={input}
-      on:keypress={(e) => {
+      onkeypress={(e) => {
         if (e.key === 'Enter') {
           submission = input;
 
@@ -43,7 +43,7 @@
     />
     <button
       class="button-lined"
-      on:click={() => {
+      onclick={() => {
         submission = input;
 
         onSubmit();
diff --git a/src/lib/Tools/Picker.svelte b/src/lib/Tools/Picker.svelte
index 3f20300f..dab74599 100644
--- a/src/lib/Tools/Picker.svelte
+++ b/src/lib/Tools/Picker.svelte
@@ -10,7 +10,7 @@
 <blockquote>
   <select
     bind:value={tool}
-    on:change={() => {
+    onchange={() => {
       if (browser) goto(root(`/tools/${tool}`));
     }}
   >
diff --git a/src/lib/Tools/Tracker/Tool.svelte b/src/lib/Tools/Tracker/Tool.svelte
index 314dce18..6c7fbf1c 100644
--- a/src/lib/Tools/Tracker/Tool.svelte
+++ b/src/lib/Tools/Tracker/Tool.svelte
@@ -75,7 +75,7 @@
   <input type="url" placeholder="URL" bind:value={url} />
   <input type="text" placeholder="Title" bind:value={title} />
   <input type="number" placeholder="Progress (defaults to 0)" bind:value={progress} />
-  <button class="button-lined" on:click={() => addEntry(url, title, progress)}> Add </button>
+  <button class="button-lined" onclick={() => addEntry(url, title, progress)}> Add </button>
 
   <Spacer />
 
@@ -96,7 +96,7 @@
               type="number"
               value={entry.progress}
               size={3}
-              on:change={(e) =>
+              onchange={(e) =>
                 adjustEntry(entry.id, e.target ? e.target.value || entry.progress : entry.progress)}
             />
 
@@ -104,17 +104,17 @@
               <span class="opaque">|</span>
               <button
                 class="button-square button-action"
-                on:click={() => adjustEntry(entry.id, entry.progress - 1)}
+                onclick={() => adjustEntry(entry.id, entry.progress - 1)}
                 >-
               </button>
               <button
                 class="button-square button-action"
-                on:click={() => adjustEntry(entry.id, entry.progress + 1)}
+                onclick={() => adjustEntry(entry.id, entry.progress + 1)}
               >
                 +
               </button>
               <span class="opaque">|</span>
-              <button on:click={() => deleteEntry(entry.id)}>Remove</button>
+              <button onclick={() => deleteEntry(entry.id)}>Remove</button>
             </span>
           </div>
         </li>
diff --git a/src/lib/Tools/Wrapped/Media.svelte b/src/lib/Tools/Wrapped/Media.svelte
index ea8a989b..90e0cde3 100644
--- a/src/lib/Tools/Wrapped/Media.svelte
+++ b/src/lib/Tools/Wrapped/Media.svelte
@@ -28,7 +28,7 @@
             )}
             alt="Highest Rated Anime Cover"
             class="cover-image"
-            on:load={updateWidth}
+            onload={updateWidth}
           />
         </a>
         <div>
@@ -67,7 +67,7 @@
             )}
             alt="Highest Rated Manga Cover"
             class="cover-image"
-            on:load={updateWidth}
+            onload={updateWidth}
           />
         </a>
         <div>
diff --git a/src/lib/Tools/Wrapped/MediaExtras.svelte b/src/lib/Tools/Wrapped/MediaExtras.svelte
index 9e755ea5..78b89e36 100644
--- a/src/lib/Tools/Wrapped/MediaExtras.svelte
+++ b/src/lib/Tools/Wrapped/MediaExtras.svelte
@@ -22,7 +22,7 @@
             src={proxy(topMedia.topGenreMedia.coverImage.extraLarge)}
             alt="Highest Rated Genre Cover"
             class="cover-image"
-            on:load={updateWidth}
+            onload={updateWidth}
           />
         </a>
         <div>
@@ -53,7 +53,7 @@
             src={proxy(topMedia.topTagMedia.coverImage.extraLarge)}
             alt="Highest Rated Tag Cover"
             class="cover-image"
-            on:load={updateWidth}
+            onload={updateWidth}
           />
         </a>
         <div>
diff --git a/src/lib/Tools/Wrapped/Tool.svelte b/src/lib/Tools/Wrapped/Tool.svelte
index bc28f97e..3ec18494 100644
--- a/src/lib/Tools/Wrapped/Tool.svelte
+++ b/src/lib/Tools/Wrapped/Tool.svelte
@@ -890,7 +890,7 @@
             <div class="category-grid pure-category">
               <a
                 href={'#'}
-                on:click={(e) => {
+                onclick={(e) => {
                   e.preventDefault();
                   triggerFetch();
                 }}
@@ -922,11 +922,11 @@
       {/if}
 
       <div id="options" class="card">
-        <button on:click={screenshot} data-umami-event="Generate Wrapped"> Generate image </button>
+        <button onclick={screenshot} data-umami-event="Generate Wrapped"> Generate image </button>
         {#if !shouldFetchData}
-          <button on:click={triggerFetch} data-umami-event="Load Wrapped Data"> Load data </button>
+          <button onclick={triggerFetch} data-umami-event="Load Wrapped Data"> Load data </button>
         {:else if needsRefetch}
-          <button on:click={triggerFetch} data-umami-event="Refetch Wrapped Data">
+          <button onclick={triggerFetch} data-umami-event="Refetch Wrapped Data">
             Reload data
           </button>
         {/if}
@@ -970,9 +970,9 @@
             {/each}
           </select>
           Highest genre and tag count<br />
-          <button on:click={updateWidth}>Find best fit</button>
-          <button on:click={() => (width -= 25)}>-25px</button>
-          <button on:click={() => (width += 25)}>+25px</button>
+          <button onclick={updateWidth}>Find best fit</button>
+          <button onclick={() => (width -= 25)}>-25px</button>
+          <button onclick={() => (width += 25)}>+25px</button>
           Width adjustment<br />
         </details>
 
@@ -980,7 +980,7 @@
           <summary>Calculation</summary>
 
           <input type="checkbox" bind:checked={useFullActivityHistory} disabled={needsRefetch} />
-          Enable full-year activity<button class="smaller-button" on:click={pruneFullYear}
+          Enable full-year activity<button class="smaller-button" onclick={pruneFullYear}
             >Refresh data</button
           >
           <br />
@@ -997,7 +997,7 @@
             bind:value={startDateFilter}
             placeholder="Start date"
             disabled={needsRefetch}
-            on:change={() => {
+            onchange={() => {
               dateTicked = true;
 
               update();
@@ -1009,7 +1009,7 @@
             bind:value={endDateFilter}
             placeholder="End date"
             disabled={needsRefetch}
-            on:change={() => {
+            onchange={() => {
               dateTicked = true;
 
               update();
@@ -1037,12 +1037,12 @@
           <input
             type="text"
             bind:value={excludedKeywordsInput}
-            on:keypress={(e) => {
+            onkeypress={(e) => {
               e.key === 'Enter' && submitExcludedKeywords();
             }}
           />
           Excluded keywords
-          <button on:click={submitExcludedKeywords} title="Or click your Enter key" use:tooltip>
+          <button onclick={submitExcludedKeywords} title="Or click your Enter key" use:tooltip>
             Submit
           </button>
           <br />
diff --git a/src/lib/Tools/Wrapped/Top/Activity.svelte b/src/lib/Tools/Wrapped/Top/Activity.svelte
index a91bedfb..ea6ba592 100644
--- a/src/lib/Tools/Wrapped/Top/Activity.svelte
+++ b/src/lib/Tools/Wrapped/Top/Activity.svelte
@@ -15,7 +15,7 @@
 
 <div class="grid-item image-grid avatar-grid category top-category">
   <a href={`https://anilist.co/user/${$identity.name}`} target="_blank">
-    <img src={proxy(wrapped.avatar.large)} alt="User Avatar" on:load={updateWidth} />
+    <img src={proxy(wrapped.avatar.large)} alt="User Avatar" onload={updateWidth} />
   </a>
   <div>
     <div>
diff --git a/src/lib/Tooltip/LinkedTooltip.svelte b/src/lib/Tooltip/LinkedTooltip.svelte
index 6e468cd6..cf004345 100644
--- a/src/lib/Tooltip/LinkedTooltip.svelte
+++ b/src/lib/Tooltip/LinkedTooltip.svelte
@@ -202,9 +202,9 @@
 
 <span
   {id}
-  on:mouseenter={handleMouseEnter}
-  on:mousemove={handleMouseMove}
-  on:mouseleave={handleMouseLeave}
+  onmouseenter={handleMouseEnter}
+  onmousemove={handleMouseMove}
+  onmouseleave={handleMouseLeave}
   role="tooltip"
 >
   <slot />
diff --git a/src/lib/User/BadgeWall/BadgePreview.svelte b/src/lib/User/BadgeWall/BadgePreview.svelte
index 46aa2d46..2f4d65c7 100644
--- a/src/lib/User/BadgeWall/BadgePreview.svelte
+++ b/src/lib/User/BadgeWall/BadgePreview.svelte
@@ -106,7 +106,7 @@
     <div class="badge-preview-badge">
       {#if selectedBadge.image}
         <div role="img" class="badge-container">
-          <a href={'#'} on:click={onClick} class="badge-container-image">
+          <a href={'#'} onclick={onClick} class="badge-container-image">
             <ParallaxImage
               {source}
               alternativeText="selectedBadge.description"
@@ -184,10 +184,7 @@
       {#if selectedBadge.category}
         <b>Category:</b>
 
-        <a
-          href={`?category=${selectedBadge.category}`}
-          on:click={() => (selectedBadge = undefined)}
-        >
+        <a href={`?category=${selectedBadge.category}`} onclick={() => (selectedBadge = undefined)}>
           {selectedBadge.category}
         </a>
 
@@ -201,11 +198,11 @@
 
       <div class="badge-preview-seek">
         {#if hasPrevious}
-          <button on:click={onPrevious}>Previous</button>
+          <button onclick={onPrevious}>Previous</button>
         {/if}
 
         {#if hasNext}
-          <button on:click={onNext} style="float: right;">Next</button>
+          <button onclick={onNext} style="float: right;">Next</button>
         {/if}
       </div>
     </div>
diff --git a/src/lib/User/BadgeWall/Badges.svelte b/src/lib/User/BadgeWall/Badges.svelte
index e7e1e9f3..99d500da 100644
--- a/src/lib/User/BadgeWall/Badges.svelte
+++ b/src/lib/User/BadgeWall/Badges.svelte
@@ -22,7 +22,7 @@
   <div class="card">
     No due.moe registered badges found for this user. <a
       href={'#'}
-      on:click={(e) => e.preventDefault()}
+      onclick={(e) => e.preventDefault()}
       title="This alert does not include AWC badges."
       use:tooltip>?</a
     >
@@ -55,7 +55,7 @@
             >
               <a
                 href={`#`}
-                on:click={() => {
+                onclick={() => {
                   selectedBadge = badge;
 
                   const hiddenInput = document.querySelector('input[name="hidden"]');
diff --git a/src/lib/User/BadgeWall/FallbackBadge.svelte b/src/lib/User/BadgeWall/FallbackBadge.svelte
index 35a50a7d..3155acc5 100644
--- a/src/lib/User/BadgeWall/FallbackBadge.svelte
+++ b/src/lib/User/BadgeWall/FallbackBadge.svelte
@@ -82,9 +82,9 @@
       href={awc ? badgeToAny(badge).link : '#'}
       target="_blank"
       class="badge-container badge"
-      on:mousemove={handleMouseMove}
-      on:mouseleave={handleMouseLeave}
-      on:click={(e) => {
+      onmousemove={handleMouseMove}
+      onmouseleave={handleMouseLeave}
+      onclick={(e) => {
         if (!awc) {
           e.preventDefault();
 
@@ -100,7 +100,7 @@
         bind:this={badgeReference}
         style="transform: perspective(1000px) rotateX({$mouse.y / 10}deg) rotateY({-$mouse.x /
           10}deg); ${style}"
-        on:error={(e) => delayedReplace(e, fallback)}
+        onerror={(e) => delayedReplace(e, fallback)}
       />
     </a>
   </Tooltip>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 5ba94ec7..2ca78271 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -235,7 +235,7 @@
           <a
             class="header-item"
             href={`https://anilist.co/api/v2/oauth/authorize?client_id=${env.PUBLIC_ANILIST_CLIENT_ID}&redirect_uri=${env.PUBLIC_ANILIST_REDIRECT_URI}&response_type=code`}
-            on:click={async () => {
+            onclick={async () => {
               await localforage.setItem(
                 'redirect',
                 window.location.origin + window.location.pathname + window.location.search
diff --git a/src/routes/anilist-badges-easter-event-2025/+page.svelte b/src/routes/anilist-badges-easter-event-2025/+page.svelte
index 590b0d14..d1a18967 100644
--- a/src/routes/anilist-badges-easter-event-2025/+page.svelte
+++ b/src/routes/anilist-badges-easter-event-2025/+page.svelte
@@ -42,7 +42,7 @@
 <div class="card main-content">
   {#if page === 0}
     <p class="big-text">Welcome to the Easter Egg Hunt!</p>
-    <button on:click={() => updatePage()}>Begin Hunt</button>
+    <button onclick={() => updatePage()}>Begin Hunt</button>
     <br />
     <p>due.moe × AniList Badges</p>
   {:else if page === 1}
diff --git a/src/routes/events/group/[group]/+page.svelte b/src/routes/events/group/[group]/+page.svelte
index 2ac371f1..6d2728bb 100644
--- a/src/routes/events/group/[group]/+page.svelte
+++ b/src/routes/events/group/[group]/+page.svelte
@@ -31,7 +31,7 @@
       {#if json === null}
         <Message message="" loader="ripple" slot>
           This group may not exist. Please
-          <a href={'#'} on:click={() => location.reload()}>try again</a> later.
+          <a href={'#'} onclick={() => location.reload()}>try again</a> later.
         </Message>
       {:else}
         {@const group = asGroup(json)}
diff --git a/src/routes/hololive/[[stream]]/+page.svelte b/src/routes/hololive/[[stream]]/+page.svelte
index d5419711..15d2125c 100644
--- a/src/routes/hololive/[[stream]]/+page.svelte
+++ b/src/routes/hololive/[[stream]]/+page.svelte
@@ -66,7 +66,7 @@
     {:catch}
       <Message loader="ripple" slot>
         {$locale().hololive.parseError}
-        <a href={'#'} on:click={() => location.reload()}>Try again?</a>
+        <a href={'#'} onclick={() => location.reload()}>Try again?</a>
       </Message>
     {/await}
   {:else}
@@ -77,6 +77,6 @@
 {:catch}
   <Message loader="ripple" slot>
     {$locale().hololive.loadError} Please
-    <a href={'#'} on:click={() => location.reload()}>try again</a> later.
+    <a href={'#'} onclick={() => location.reload()}>try again</a> later.
   </Message>
 {/await}
diff --git a/src/routes/schedule/+page.svelte b/src/routes/schedule/+page.svelte
index 160add29..97b9dd5a 100644
--- a/src/routes/schedule/+page.svelte
+++ b/src/routes/schedule/+page.svelte
@@ -32,7 +32,7 @@
 <!-- <blockquote>
 	<select
 		bind:value={timeZone}
-		on:change={() =>
+		onchange={() =>
 			(subsPleasePromise = fetch(root(`/api/subsplease?tz=${timeZone}`)).then((r) => r.json()))}
 	>
 		{#each Intl.supportedValuesOf('timeZone') as zone}
diff --git a/src/routes/settings/+page.svelte b/src/routes/settings/+page.svelte
index e8b79fa1..a6223b5f 100644
--- a/src/routes/settings/+page.svelte
+++ b/src/routes/settings/+page.svelte
@@ -84,7 +84,7 @@
         class="smaller-button button-badge badge-info unclickable-button"
         title={$locale().settings.debug.tooltips.version}
         use:tooltip
-        on:click|preventDefault
+        onclick={(e) => e.preventDefault()}
         >{data.commit.slice(0, 7)}
       </button></summary
     >
diff --git a/src/routes/tools/+page.svelte b/src/routes/tools/+page.svelte
index 4014c58f..56ef8a10 100644
--- a/src/routes/tools/+page.svelte
+++ b/src/routes/tools/+page.svelte
@@ -15,7 +15,7 @@
 <div class="card">
   <div class="tool-grid">
     {#each Object.keys(tools).filter((t) => t !== 'default' && !tools[t].hidden) as t}
-      <a href={root(`/tools/${tools[t].id}`)} on:click={() => (tool = t)}>
+      <a href={root(`/tools/${tools[t].id}`)} onclick={() => (tool = t)}>
         <div class="tool-grid-tool card">
           <span class="title">
             {tools[t].name()}
diff --git a/src/routes/tools/[tool]/+page.svelte b/src/routes/tools/[tool]/+page.svelte
index 4d8dc16e..68eb0c07 100644
--- a/src/routes/tools/[tool]/+page.svelte
+++ b/src/routes/tools/[tool]/+page.svelte
@@ -47,7 +47,7 @@
     <blockquote style="margin: 0 0 0 1.5rem;">
       Did you mean "<a
         href={root(`/tools/${tools[suggestion].id}`)}
-        on:click={() => (tool = suggestion)}
+        onclick={() => (tool = suggestion)}
         style={suggestion === '...' ? 'pointer-events: none; color: inherit;' : ''}
       >
         {suggestion === '...' ? '...' : tools[suggestion].name()}</a
diff --git a/src/routes/user/[user]/+page.svelte b/src/routes/user/[user]/+page.svelte
index 0cfe05fd..7f33f170 100644
--- a/src/routes/user/[user]/+page.svelte
+++ b/src/routes/user/[user]/+page.svelte
@@ -360,7 +360,7 @@
 
       <input
         type="checkbox"
-        on:change={() => {
+        onchange={() => {
           if (userData) toggleHideMissingBadgesQuery.mutate(null).then();
         }}
         checked={preferences.hide_missing_badges}
@@ -372,7 +372,7 @@
 
       <input
         type="checkbox"
-        on:change={() => {
+        onchange={() => {
           if (userData) toggleHideAWCBadgesQuery.mutate(null).then();
         }}
         checked={preferences.hide_awc_badges}
@@ -388,11 +388,11 @@
           <div
             class="card card-small pinned-category"
             draggable="true"
-            on:dragstart={(event) => handleDragStart(event, category)}
-            on:dragover={handleDragOver}
-            on:dragenter={(event) => handleDragEnter(event, category)}
-            on:dragleave={(event) => handleDragLeave(event, category)}
-            on:drop={handleDrop}
+            ondragstart={(event) => handleDragStart(event, category)}
+            ondragover={handleDragOver}
+            ondragenter={(event) => handleDragEnter(event, category)}
+            ondragleave={(event) => handleDragLeave(event, category)}
+            ondrop={handleDrop}
             role="button"
             tabindex="0"
           >
@@ -401,7 +401,7 @@
             </span>
 
             <button
-              on:click={() => {
+              onclick={() => {
                 if (userData) toggleCategoryQuery.mutate({ category }).then();
               }}>Remove</button
             >
@@ -413,7 +413,7 @@
             <input type="text" id="category" placeholder="Category" style="width: 10em;" />
           </span>
 
-          <button class="button-lined" on:click={toggleCategory}>Add</button>
+          <button class="button-lined" onclick={toggleCategory}>Add</button>
         </span>
       </div>
 
@@ -422,7 +422,7 @@
       Biography
 
       <button
-        on:click={() => {
+        onclick={() => {
           if (userData)
             setBiographyQuery
               .mutate({
@@ -444,7 +444,7 @@
       Badge Wall Custom CSS
 
       <button
-        on:click={() => {
+        onclick={() => {
           if (userData)
             setBadgeWallCSSQuery
               .mutate({
diff --git a/src/routes/user/[user]/badges/+page.svelte b/src/routes/user/[user]/badges/+page.svelte
index c9bb7454..2abf8377 100644
--- a/src/routes/user/[user]/badges/+page.svelte
+++ b/src/routes/user/[user]/badges/+page.svelte
@@ -576,7 +576,7 @@
               of all badges from your Badge Wall.
               <Spacer />
               <button
-                on:click={async () => {
+                onclick={async () => {
                   noticeDismissed = true;
 
                   await localforage.setItem('badgeWallNoticeDismissed', 'true');
@@ -591,7 +591,7 @@
 
           <div class="card">
             {#if authorised}
-              <button on:click={setShadowHide}>Shadow Hide Badges</button>
+              <button onclick={setShadowHide}>Shadow Hide Badges</button>
             {/if}
 
             {#if isOwner && authorised}
@@ -600,7 +600,7 @@
 
             {#if isOwner}
               <button
-                on:click={() => {
+                onclick={() => {
                   selectedBadge = undefined;
                   editMode = !editMode;
                 }}
@@ -611,7 +611,7 @@
               </button>
               <span style="margin: 0 0.625rem;">•</span>
               <button
-                on:click={() => {
+                onclick={() => {
                   selectedBadge = undefined;
                   importMode = !importMode;
                 }}
@@ -622,7 +622,7 @@
               </button>
               <span style="margin: 0 0.625rem;">•</span>
               <button
-                on:click={() => {
+                onclick={() => {
                   selectedBadge = undefined;
                   migrateMode = !migrateMode;
                 }}
@@ -631,7 +631,7 @@
               </button>
               <span style="margin: 0 0.625rem;">•</span>
               <button
-                on:click={() => {
+                onclick={() => {
                   selectedBadge = undefined;
                   hideMode = !hideMode;
                 }}
@@ -639,11 +639,11 @@
                 Hide Category
               </button>
               <!-- <!-- <span style="margin: 0 0.625rem;">•</span> -->
-              <!-- <button on:click={() => exportBadges(groupedBadges)}>Export Badges</button> -->
+              <!-- <button onclick={() => exportBadges(groupedBadges)}>Export Badges</button> -->
 
               {#if shadowHidden}
                 <span style="margin: 0 0.625rem;">•</span>
-                <button on:click={setShadowHide}>Un-shadow Hide Badges</button>
+                <button onclick={setShadowHide}>Un-shadow Hide Badges</button>
               {/if}
 
               {#if editMode && isOwner}
@@ -807,7 +807,7 @@
                       />
                     </span>
                   </Dropdown>
-                  <button class="button-lined" on:click={submitBadge}
+                  <button class="button-lined" onclick={submitBadge}
                     >{selectedBadge
                       ? $locale().user.badges.editMode.update
                       : $locale().user.badges.editMode.add}</button
@@ -816,7 +816,7 @@
                     {$locale().user.badges.editMode.or}
                     <button
                       class="button-lined"
-                      on:click={() => {
+                      onclick={() => {
                         if (selectedBadge) removeBadge(selectedBadge);
                       }}>{$locale().user.badges.editMode.delete}</button
                     >
@@ -869,7 +869,7 @@
         />
 
         {#if authorised}
-          <button on:click={shadowHideBadge}>
+          <button onclick={shadowHideBadge}>
             {#if selectedBadge && selectedBadge.shadow_hidden}
               Un-shadow
             {:else}
@@ -921,7 +921,7 @@
     <Spacer />
 
     <button
-      on:click={() => {
+      onclick={() => {
         importMode = false;
         importImages = undefined;
       }}
@@ -929,7 +929,7 @@
     >
       {$locale().user.badges.importMode.cancel}
     </button>
-    <button on:click={() => parsePost()} class="button-lined" style="float: right;">
+    <button onclick={() => parsePost()} class="button-lined" style="float: right;">
       {$locale().user.badges.importMode.fetch}
     </button>
 
@@ -941,7 +941,7 @@
       <button
         class="button-lined no-shadow"
         data-umami-event="Remove All Badges"
-        on:click={removeAllBadges}
+        onclick={removeAllBadges}
       >
         {$locale({
           values: {
@@ -963,7 +963,7 @@
         }
       }).user.badges.importMode.importConfirm}&nbsp;
       <button
-        on:click={() => importBadges()}
+        onclick={() => importBadges()}
         class="button-lined no-shadow"
         data-umami-event="Import Badges"
       >
@@ -1003,7 +1003,7 @@
   <Spacer />
 
   <button
-    on:click={() => {
+    onclick={() => {
       importMode = false;
       importImages = undefined;
     }}
@@ -1011,7 +1011,7 @@
   >
     {$locale().user.badges.importMode.cancel}
   </button>
-  <button on:click={() => migrateCategory()} class="button-lined" style="float: right;">
+  <button onclick={() => migrateCategory()} class="button-lined" style="float: right;">
     Migrate
   </button>
 </Popup>
@@ -1039,7 +1039,7 @@
   <Spacer />
 
   <button
-    on:click={() => {
+    onclick={() => {
       hideMode = false;
       importImages = undefined;
     }}
@@ -1047,7 +1047,7 @@
   >
     {$locale().user.badges.importMode.cancel}
   </button>
-  <button on:click={() => hideCategory()} class="button-lined" style="float: right;"
+  <button onclick={() => hideCategory()} class="button-lined" style="float: right;"
     >Toggle Visibility</button
   >
 </Popup>
-- 
cgit v1.2.3