aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--src/App.js19
-rw-r--r--src/components/Card.js12
-rw-r--r--src/i18n.js25
3 files changed, 51 insertions, 5 deletions
diff --git a/src/App.js b/src/App.js
index d05f151..5fdb388 100644
--- a/src/App.js
+++ b/src/App.js
@@ -5,8 +5,22 @@ import './style.css';
5import logo from '../src/images/wifi.png'; 5import logo from '../src/images/wifi.png';
6 6
7function App() { 7function App() {
8 const html = document.querySelector('html');
8 const { t, i18n } = useTranslation(); 9 const { t, i18n } = useTranslation();
9 10
11 const changeLanguage = (language) => {
12 if (language === 'fa-IR') {
13 html.style.direction = 'rtl';
14 } else {
15 html.style.direction = 'ltr';
16 }
17 i18n.changeLanguage(language);
18 };
19
20 if (i18n.language === 'fa-IR') {
21 html.style.direction = 'rtl';
22 }
23
10 return ( 24 return (
11 <div className="App"> 25 <div className="App">
12 <h1> 26 <h1>
@@ -18,7 +32,7 @@ function App() {
18 <label>{t('select')}</label> 32 <label>{t('select')}</label>
19 <select 33 <select
20 value={i18n.language} 34 value={i18n.language}
21 onChange={(e) => i18n.changeLanguage(e.target.value)} 35 onChange={(e) => changeLanguage(e.target.value)}
22 > 36 >
23 <option value="en-US">en-US</option> 37 <option value="en-US">en-US</option>
24 <option value="zh-HK">繁體中文🇭🇰</option> 38 <option value="zh-HK">繁體中文🇭🇰</option>
@@ -26,6 +40,7 @@ function App() {
26 <option value="es">es</option> 40 <option value="es">es</option>
27 <option value="pt">Português</option> 41 <option value="pt">Português</option>
28 <option value="ja">日本語</option> 42 <option value="ja">日本語</option>
43 <option value="fa-IR">Persian</option>
29 <option value="ru-RU">Русский</option> 44 <option value="ru-RU">Русский</option>
30 <option value="uk-UA">Українська</option> 45 <option value="uk-UA">Українська</option>
31 <option value="nl-NL">Nederlands</option> 46 <option value="nl-NL">Nederlands</option>
@@ -41,7 +56,7 @@ function App() {
41 <a href="https://github.com/bndw/wifi-card">{t('desc.source')}</a>. 56 <a href="https://github.com/bndw/wifi-card">{t('desc.source')}</a>.
42 </p> 57 </p>
43 58
44 <Card /> 59 <Card direction={i18n.language === 'fa-IR' ? 'rtl' : 'ltr'} />
45 </div> 60 </div>
46 ); 61 );
47} 62}
diff --git a/src/components/Card.js b/src/components/Card.js
index 298f968..bcb7acc 100644
--- a/src/components/Card.js
+++ b/src/components/Card.js
@@ -3,7 +3,7 @@ import { useEffect, useRef, useState } from 'react';
3import { useTranslation } from 'react-i18next'; 3import { useTranslation } from 'react-i18next';
4import './style.css'; 4import './style.css';
5 5
6export const Card = () => { 6export const Card = ({ direction = 'ltr' }) => {
7 const firstLoad = useRef(true); 7 const firstLoad = useRef(true);
8 const [qrvalue, setQrvalue] = useState(''); 8 const [qrvalue, setQrvalue] = useState('');
9 const [network, setNetwork] = useState({ 9 const [network, setNetwork] = useState({
@@ -64,7 +64,7 @@ export const Card = () => {
64 id="print-area" 64 id="print-area"
65 style={{ maxWidth: portrait ? '350px' : '100%' }} 65 style={{ maxWidth: portrait ? '350px' : '100%' }}
66 > 66 >
67 <h1 style={{ textAlign: portrait ? 'center' : 'left' }}> 67 <h1 style={{ textAlign: portrait ? 'center' : 'unset' }}>
68 {t('wifi.login')} 68 {t('wifi.login')}
69 </h1> 69 </h1>
70 70
@@ -74,7 +74,13 @@ export const Card = () => {
74 > 74 >
75 <QRCode 75 <QRCode
76 className="qrcode" 76 className="qrcode"
77 style={{ paddingRight: portrait ? '' : '1em' }} 77 style={
78 !portrait
79 ? direction === 'ltr'
80 ? { paddingRight: '1em' }
81 : { paddingLeft: '1em' }
82 : {}
83 }
78 value={qrvalue} 84 value={qrvalue}
79 size={175} 85 size={175}
80 /> 86 />
diff --git a/src/i18n.js b/src/i18n.js
index c6e7a06..fcb3ff9 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -209,6 +209,31 @@ const resources = {
209 select: 'Выбор языка', 209 select: 'Выбор языка',
210 }, 210 },
211 }, 211 },
212 'fa-IR': {
213 translation: {
214 title: 'کارت WiFi',
215 'desc.use':
216 'توسط اطلاعات شبکه WiFi خود یک کارت ساده چاپ کنید و آن را به یخچال بچسبانید و یا در کیف پول خود نگه دارید.',
217 'desc.privacy':
218 'اطلاعات شبکه شما هرگز به سرور ارسال نمی‌شود و هیچگونه ردیابی، آنالیز و یا تحلیل در این وب سایت انجام نمی‌شود. مشاهده ',
219 'desc.source': 'سورس کد',
220 'wifi.login': 'اتصال به شبکه WiFi',
221 'wifi.name': 'نام شبکه',
222 'wifi.name.placeholder': 'نام شبکه خود را وارد کنید',
223 'wifi.password': 'رمز‌عبور',
224 'wifi.password.placeholder': 'رمز‌عبور شبکه خود را وارد کنید',
225 'wifi.password.hide': 'رمز‌عبور را بعد از چاپ کارت مخفی کن.',
226 'wifi.password.encryption': 'رمزنگاری',
227 'wifi.tip':
228 'دوربین تلفن خود را روی تصویر (QR Code) گرفته تا به صورت خودکار به شبکه متصل شوید.',
229 'wifi.alert.name': 'اسم شبکه شما نباید خالی باشد.',
230 'wifi.alert.password.length.5': 'رمز‌عبور باید حداقل ۵ حرف داشته باشد.',
231 'wifi.alert.password.8': 'رمز‌عبور باید حداقل ۸ حرف داشته باشد.',
232 'button.rotate': 'چرخاندن',
233 'button.print': 'چاپ',
234 select: 'انتخاب زبان',
235 },
236 },
212 'uk-UA': { 237 'uk-UA': {
213 translation: { 238 translation: {
214 title: 'Карта WiFi', 239 title: 'Карта WiFi',