diff --git a/components/settings/LanguageButton.js b/components/settings/LanguageButton.js
index 1a9bd33b..66cf1108 100644
--- a/components/settings/LanguageButton.js
+++ b/components/settings/LanguageButton.js
@@ -1,5 +1,4 @@
import React from 'react';
-import Head from 'next/head';
import { menuOptions } from 'lib/lang';
import useLocale from 'hooks/useLocale';
import MenuButton from 'components/common/MenuButton';
@@ -13,36 +12,32 @@ export default function LanguageButton() {
setLocale(value);
}
+ switch (locale) {
+ case 'zn-CN':
+ import('@fontsource/noto-sans-sc/400.css');
+ import('@fontsource/noto-sans-sc/500.css');
+ import('@fontsource/noto-sans-sc/700.css');
+ break;
+ case 'zh-TW':
+ import('@fontsource/noto-sans-tc/400.css');
+ import('@fontsource/noto-sans-tc/500.css');
+ import('@fontsource/noto-sans-tc/700.css');
+ break;
+ case 'ja-JP':
+ import('@fontsource/noto-sans-jp/400.css');
+ import('@fontsource/noto-sans-jp/500.css');
+ import('@fontsource/noto-sans-jp/700.css');
+ break;
+ }
+
return (
- <>
-
- {locale === 'zh-CN' && (
-
- )}
- {locale === 'zh-TW' && (
-
- )}
- {locale === 'ja-JP' && (
-
- )}
-
- }
- options={menuOptions}
- value={locale}
- menuClassName={styles.menu}
- renderValue={option => option?.display}
- onSelect={handleSelect}
- />
- >
+ }
+ options={menuOptions}
+ value={locale}
+ menuClassName={styles.menu}
+ renderValue={option => option?.display}
+ onSelect={handleSelect}
+ />
);
}
diff --git a/package.json b/package.json
index f1b4a6ad..41809740 100644
--- a/package.json
+++ b/package.json
@@ -56,6 +56,10 @@
}
},
"dependencies": {
+ "@fontsource/inter": "^4.3.0",
+ "@fontsource/noto-sans-jp": "^4.3.0",
+ "@fontsource/noto-sans-sc": "^4.3.0",
+ "@fontsource/noto-sans-tc": "^4.3.0",
"@prisma/client": "2.21.2",
"@reduxjs/toolkit": "^1.5.1",
"bcryptjs": "^2.4.3",
diff --git a/pages/_app.js b/pages/_app.js
index 71327059..47fdf5d2 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -10,6 +10,8 @@ import { messages } from 'lib/lang';
import 'styles/variables.css';
import 'styles/bootstrap-grid.css';
import 'styles/index.css';
+import '@fontsource/inter/400.css';
+import '@fontsource/inter/600.css';
const Intl = ({ children }) => {
const [locale] = useLocale();
@@ -38,10 +40,6 @@ export default function App({ Component, pageProps }) {
-
diff --git a/yarn.lock b/yarn.lock
index aca7b2cc..877e0d54 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1135,6 +1135,26 @@
minimatch "^3.0.4"
strip-json-comments "^3.1.1"
+"@fontsource/inter@^4.3.0":
+ version "4.3.0"
+ resolved "https://registry.yarnpkg.com/@fontsource/inter/-/inter-4.3.0.tgz#deb5c5d5d2ce0d8d16173a68ba1e961741ef6d30"
+ integrity sha512-qtUF+Fn9vH4O7V/13kOeemEJpQfhTMxtnOJzJw3kY7SOwl1cbs4fnd9QnQOczU3AVBJEPF1ik639uvaOg7g43A==
+
+"@fontsource/noto-sans-jp@^4.3.0":
+ version "4.3.0"
+ resolved "https://registry.yarnpkg.com/@fontsource/noto-sans-jp/-/noto-sans-jp-4.3.0.tgz#e1a715f24e199d9bd8a9e14e7fffea24cbd228b2"
+ integrity sha512-EbPYK7/08Qll9SR+BvX23y4+v/uH+wJmblIQKRT76f7OZotIIbX3Sx7QGImhEidhPh4LpRdpQYJPnCw6UxtD6A==
+
+"@fontsource/noto-sans-sc@^4.3.0":
+ version "4.3.0"
+ resolved "https://registry.yarnpkg.com/@fontsource/noto-sans-sc/-/noto-sans-sc-4.3.0.tgz#fa720aef0cc9396ae37dc6c488d2301ae6719455"
+ integrity sha512-AqtGDzgX5mFEe3eLMvawqHOOcr3HKg2ExXip5h7PTnKUP7pJynIhRtpDjJgNeWNocamX8fQhiXtf1EW1IqIgDQ==
+
+"@fontsource/noto-sans-tc@^4.3.0":
+ version "4.3.0"
+ resolved "https://registry.yarnpkg.com/@fontsource/noto-sans-tc/-/noto-sans-tc-4.3.0.tgz#68037d03f4de203f6ed8246562301b12b06fe665"
+ integrity sha512-WjCk+II1TPcd749w+o1as4DQXtg/mOXA3y9/cIE+iU6f8Knt1eOlvH7akfMwtjN0PmtaUcMHWe2HqI6gZNDjeQ==
+
"@formatjs/cli@^2.13.16":
version "2.13.16"
resolved "https://registry.yarnpkg.com/@formatjs/cli/-/cli-2.13.16.tgz#1664e17d0671623ffbbd1bcdcbf4a84f2de429fd"