Skip to content

Commit

Permalink
add i18n config and about us heading translation
Browse files Browse the repository at this point in the history
  • Loading branch information
myix765 committed Nov 1, 2024
1 parent a0f4dfc commit 8be4dad
Show file tree
Hide file tree
Showing 5 changed files with 172 additions and 3 deletions.
141 changes: 141 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 4 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,12 @@
},
"dependencies": {
"axios": "^1.7.7",
"i18next": "^23.16.4",
"i18next-browser-languagedetector": "^8.0.0",
"i18next-http-backend": "^2.6.2",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-i18next": "^15.1.0",
"wouter": "^3.3.5"
},
"devDependencies": {
Expand Down
1 change: 1 addition & 0 deletions src/App.jsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@

import NavBar from '@/components/NavBar/NavBar'
import PageRoutes from '@/components/PageRoutes'
import "./i18n.js";

function App() {
return (
Expand Down
23 changes: 23 additions & 0 deletions src/i18n.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import i18next from "i18next";
import HttpBackend from "i18next-http-backend";
import LanguageDetector from "i18next-browser-languagedetector";
import { initReactI18next } from "react-i18next";

const loadPath = import.meta.env.VITE_I18N_PATH;

i18next
.use(HttpBackend)
.use(LanguageDetector)
.use(initReactI18next)
.init({
fallbackLng: "en",

ns: ["default"],
defaultNS: "default",

supportedLngs: ["en","ru","tr","zh"],

backend: {
loadPath: loadPath
}
})
6 changes: 3 additions & 3 deletions src/pages/About.jsx
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import founder from '../assets/founder.jpg'

import { useTranslation } from "react-i18next";

function About() {

const { t } = useTranslation();
return (
<>
<div className="flex flex-col p-10 mx-5 my-10 lg:flex-row-reverse lg:justify-between">
<div className="flex items-center justify-center lg:w-1/3">
<img src = {founder} alt = "dummy-founder-image" title = "dummy-image" className = "w-full h-auto"></img>
</div>
<div className="my-auto text-2xl lg:w-7/12 lg:text-lg lg:mr-5">
<h1 className ="text-5xl text-center py-5 lg:text-4xl lg:text-left">About Us</h1>
<h1 className ="text-5xl text-center py-5 lg:text-4xl lg:text-left">{t("about_heading")}</h1>
<p className="text-center lg:text-left">Dillar English Academy was founded by Dilnawa and Dilziba Dilmurat
Kizghin to help Uyghurs around the world learn English without cost.
With the help and commitment of our volunteer teachers, our goal is
Expand Down

0 comments on commit 8be4dad

Please sign in to comment.