добавлена локализация для попапа
This commit is contained in:
@@ -1,6 +1,8 @@
|
|||||||
import React from "react";
|
import React, { useContext } from "react";
|
||||||
import { PinkButton } from "../../mainPart/pinkButton";
|
import { PinkButton } from "../../mainPart/pinkButton";
|
||||||
import './popup.css';
|
import './popup.css';
|
||||||
|
import { LangDict } from "../../langDict";
|
||||||
|
import { ContextLang } from "../../ContextLang";
|
||||||
|
|
||||||
type TProps = {
|
type TProps = {
|
||||||
logo?: string
|
logo?: string
|
||||||
@@ -13,6 +15,7 @@ type TProps = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const Popup:React.FC<TProps> = React.memo((props) => {
|
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' : ''}}>
|
return <div className="popup-container" style={{padding: props.type === "title-input-button" ? '48px 48px 26px 48px' : ''}}>
|
||||||
{
|
{
|
||||||
props.logo
|
props.logo
|
||||||
@@ -23,23 +26,23 @@ export const Popup:React.FC<TProps> = React.memo((props) => {
|
|||||||
props.type === 'title-button' && props?.onClickSecond
|
props.type === 'title-button' && props?.onClickSecond
|
||||||
? <div className="popup-title-button">
|
? <div className="popup-title-button">
|
||||||
<div className="popup-title-button-container">
|
<div className="popup-title-button-container">
|
||||||
<span className="popup-title-button-title">Начать новую демонстрацию</span>
|
<span className="popup-title-button-title">{LangDict.startNewDemoButton[lang]}</span>
|
||||||
<PinkButton textButton="Начать" onClick={props.onClickFirst} width='100%' />
|
<PinkButton textButton={LangDict.start[lang]} onClick={props.onClickFirst} width='100%' />
|
||||||
</div>
|
</div>
|
||||||
<span className="popup-line"></span>
|
<span className="popup-line"></span>
|
||||||
<div className="popup-title-button-container">
|
<div className="popup-title-button-container">
|
||||||
<span className="popup-title-button-title">Подключиться к существующей</span>
|
<span className="popup-title-button-title">{LangDict.connectToExist[lang]}</span>
|
||||||
<PinkButton textButton="Подключиться" onClick={props.onClickSecond} width='100%' />
|
<PinkButton textButton={LangDict.connectToDemoButton[lang]} onClick={props.onClickSecond} width='100%' />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
: <div className="popup-title-input-container">
|
: <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">
|
<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)} />
|
<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>
|
<span className="popup-line"></span>
|
||||||
</div>
|
</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>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -142,5 +142,29 @@ export const LangDict = {
|
|||||||
back: {
|
back: {
|
||||||
ru: 'Назад',
|
ru: 'Назад',
|
||||||
en: 'Back'
|
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'
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
Reference in New Issue
Block a user