DmitriyB
37 lines
1.4 KiB
TypeScript
37 lines
1.4 KiB
TypeScript
import "../../styles/styles.css";
|
|
import "./multiplayer.css";
|
|
import photo from "./Photo.png";
|
|
import photo1 from "./Photo1.png";
|
|
import photo2 from "./Photo2.png";
|
|
import photo3 from "./Photo3.png";
|
|
import { Button } from "../buttonDemo/buttonDemo"
|
|
import { Content } from "../content/content";
|
|
import { useState } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
export const Multiplayer: React.FC<any> = ({text}) => {
|
|
const [captionSmall, setCaptionSmall] = useState(true);
|
|
const {t} = useTranslation()
|
|
return (
|
|
<div
|
|
data-aos="zoom-in"
|
|
data-aos-duration="400"
|
|
className="multiplayer__container"
|
|
>
|
|
<Content isColor={false} captionSmall={captionSmall} text={text}></Content>
|
|
<div className="multiplayer__photo-container">
|
|
<img alt="device" src={photo1} className="multiplayer__image" />
|
|
<img alt="device" src={photo} className="multiplayer__image" />
|
|
<img alt="device" src={photo2} className="multiplayer__image" />
|
|
<img alt="device" src={photo3} className="multiplayer__image" />
|
|
</div>
|
|
<div className="main-block__subblock-container">
|
|
<div className={captionSmall ? " main-block__caption_small main-block_subblock " : 'main-block_subblock'}>
|
|
{t(`${text}-mainBlockSubblock`)}
|
|
<Button text={text}></Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|