Update fonts for new languages

src/assets/css/base.css

@@ -1,3 +1,5 @@
+@import url('./fonts.css');
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
@@ -13,23 +15,3 @@ body {
 .text-shadow {
   text-shadow: 1px 1px 0 #000;
 }
-
-@font-face {
-  font-family: Splatoon1;
-  src: url("@/assets/fonts/5476b40d543260503fbccbbab305b1f9.woff2") format("woff2"),url("@/assets/fonts/f85b6b75e658c1758ee0b3f2262c9522.woff") format("woff")
-}
-
-@font-face {
-  font-family: Splatoon1;
-  src: url("@/assets/fonts/0e12b13c359d4803021dc4e17cecc311.woff2") format("woff2"),url("@/assets/fonts/f25982b8ab52a929938cd63f15656ecf.woff") format("woff")
-}
-
-@font-face {
-  font-family: Splatoon2;
-  src: url("@/assets/fonts/61f6c62eb1065d00c9a2bcf85e090fe4.woff2") format("woff2"),url("@/assets/fonts/b426a8e06ebdfcb82b481ab57922d6b4.woff") format("woff")
-}
-
-@font-face {
-  font-family: Splatoon2;
-  src: url("@/assets/fonts/eb82d017016045bf998cade4dac1ec22.woff2") format("woff2"),url("@/assets/fonts/b4fab2f6ac35a758f6aeb5b7054ab121.woff") format("woff")
-}

src/common/i18n.mjs

@@ -32,10 +32,9 @@ export function initializeI18n() {
       messages: { ...languages },
     });
 
-    loadLocale();
-
     // Listen for local storage changes
     window.addEventListener('storage', reload);
+    reload();
   }
 
   return i18n;
@@ -44,6 +43,23 @@ export function initializeI18n() {
 function reload() {
   i18n.global.locale.value = currentLocale().code;
   loadLocale();
+
+  switch (currentLocale().code) {
+    case 'zh-CN':
+      document.documentElement.style.setProperty("--font-family-s1", "splatoon1, splatoon1chzh, sans-serif");
+      document.documentElement.style.setProperty("--font-family-s2", "splatoon2, splatoon2chzh, sans-serif");
+      break;
+
+    case 'zh-TW':
+      document.documentElement.style.setProperty("--font-family-s1", "splatoon1, splatoon1twzh, sans-serif");
+      document.documentElement.style.setProperty("--font-family-s2", "splatoon2, splatoon2twzh, sans-serif");
+      break;
+
+    default:
+      document.documentElement.style.setProperty("--font-family-s1", "splatoon1, splatoon1jpja, sans-serif");
+      document.documentElement.style.setProperty("--font-family-s2", "splatoon2, splatoon2jpja, sans-serif");
+      break;
+  }
 }
 
 async function loadLocale() {

tailwind.config.js

@@ -27,8 +27,8 @@ module.exports = {
         },
       },
       fontFamily: {
-        splatoon1: ['Splatoon1', 'sans-serif'],
-        splatoon2: ['Splatoon2', 'sans-serif'],
+        splatoon1: 'var(--font-family-s1)',
+        splatoon2: 'var(--font-family-s2)',
       },
     },
   },