Fix up the fonts and language settings

tmoitie · Sep 11, 2023 · 471905e · 471905e
1 parent 2dab005
commit 471905e
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 3 deletions.
diff --git a/src/App.js b/src/App.js
@@ -16,16 +16,27 @@ import Filters from './components/Filters';
 import styles from './styles/main.module.scss';
 
 import '@blueprintjs/core/lib/css/blueprint.css';
-import CoachDaveSponsor from "./components/CoachDaveSponsor";
+import CoachDaveSponsor from './components/CoachDaveSponsor';
+
+import './styles/fonts.css';
 
 export default function App(): React.Node {
-  const { t } = useTranslation();
+  const { t, i18n } = useTranslation();
   const dispatch = useDispatch();
 
   React.useEffect(() => {
     dispatch(startListener());
+
+    return () => {};
   }, []);
 
+  React.useEffect(() => {
+    document.body.dir = i18n.dir();
+    document.documentElement.setAttribute('lang', i18n.language);
+
+    return () => {};
+  }, [i18n.language]);
+
   return (
     <div>
       <Navbar />

diff --git a/src/index.html b/src/index.html
@@ -21,7 +21,8 @@
     <meta name="msapplication-TileImage" content="/static/mstile-144x144.png">
     <meta name="theme-color" content="#ec232c">
     <meta name=viewport content="width=device-width, initial-scale=1">
-    <link href="https://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css?family=Noto+Sans&subset=latin,latin-ext" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css?family=Noto+Sans+JP:wght@400;500;600;700&display=swap" rel="stylesheet">
   </head>
   <body>
     <div id='root' class='padbox'></div>

diff --git a/src/styles/fonts.css b/src/styles/fonts.css
@@ -0,0 +1,15 @@
+html body,
+html input::placeholder,
+html button,
+html input {
+  font-family: 'Noto Sans', sans-serif;
+}
+
+
+html[lang="ja"] body,
+html[lang="ja"] input::placeholder,
+html[lang="ja"] button,
+html[lang="ja"] input {
+  font-family: 'Noto Sans JP', sans-serif;
+}
+