добавлена локализация для попапа

This commit is contained in:
DmitriyB
2022-08-05 17:38:33 +05:00
parent dce012dcb6
commit 1a00a1f0bc
2 changed files with 35 additions and 8 deletions
+11 -8
View File
@@ -1,6 +1,8 @@
import React from "react";
import React, { useContext } from "react";
import { PinkButton } from "../../mainPart/pinkButton";
import './popup.css';
import { LangDict } from "../../langDict";
import { ContextLang } from "../../ContextLang";
type TProps = {
logo?: string
@@ -13,6 +15,7 @@ type TProps = {
}
export const Popup:React.FC<TProps> = React.memo((props) => {
const {lang} = useContext(ContextLang);
return <div className="popup-container" style={{padding: props.type === "title-input-button" ? '48px 48px 26px 48px' : ''}}>
{
props.logo
@@ -23,23 +26,23 @@ export const Popup:React.FC<TProps> = React.memo((props) => {
props.type === 'title-button' && props?.onClickSecond
? <div className="popup-title-button">
<div className="popup-title-button-container">
<span className="popup-title-button-title">Начать новую демонстрацию</span>
<PinkButton textButton="Начать" onClick={props.onClickFirst} width='100%' />
<span className="popup-title-button-title">{LangDict.startNewDemoButton[lang]}</span>
<PinkButton textButton={LangDict.start[lang]} onClick={props.onClickFirst} width='100%' />
</div>
<span className="popup-line"></span>
<div className="popup-title-button-container">
<span className="popup-title-button-title">Подключиться к существующей</span>
<PinkButton textButton="Подключиться" onClick={props.onClickSecond} width='100%' />
<span className="popup-title-button-title">{LangDict.connectToExist[lang]}</span>
<PinkButton textButton={LangDict.connectToDemoButton[lang]} onClick={props.onClickSecond} width='100%' />
</div>
</div>
: <div className="popup-title-input-container">
<span className="popup-title-input-title">Укажите код подключения <br/> или вставьте ссылку</span>
<span className="popup-title-input-title">{LangDict.promtConnectFirst[lang]}<br/>{LangDict.promtConnectSecond[lang]}</span>
<div className="popup-title-input-input-container">
<input type={'text'} className='popup-title-input-input' value={props.accessCode} onChange={e => props.setAccessCode(e.target.value)} />
<PinkButton textButton="Продолжить" onClick={props.onClickFirst} width='100%' />
<PinkButton textButton={LangDict.continue[lang]} onClick={props.onClickFirst} width='100%' />
<span className="popup-line"></span>
</div>
<button className="popup-title-input-back-button" onClick={() => props.onClickChange()}>Выбор способа демонстрации</button>
<button className="popup-title-input-back-button" onClick={() => props.onClickChange()}>{LangDict.selecеDemoMode[lang]}</button>
</div>
}
</div>
+24
View File
@@ -142,5 +142,29 @@ export const LangDict = {
back: {
ru: 'Назад',
en: 'Back'
},
start: {
ru: 'Начать',
en: 'Start'
},
connectToExist: {
ru: 'Подключиться к существующей',
en: 'Connect to an existing one.'
},
promtConnectFirst: {
ru: 'Укажите код подключения',
en: 'Specify connection code'
},
promtConnectSecond: {
ru: 'или вставьте ссылку',
en: 'or paste the link'
},
continue: {
ru: 'Продолжить',
en: 'Continue'
},
selecеDemoMode: {
ru: 'Выбор способа демонстрации',
en: 'Selecting a demonstration method'
}
};