45 lines
1.6 KiB
JavaScript
45 lines
1.6 KiB
JavaScript
import { useUser } from "../hooks/useUser";
|
|
import { Link } from "react-router-dom";
|
|
|
|
import Nav from "../components/ui/Nav";
|
|
import coverWorker from "../assets/img/illustrations/cover_worker.svg";
|
|
import screenWorker1 from "../assets/img/illustrations/screen_worker_1.svg";
|
|
import screenWorker2 from "../assets/img/illustrations/screen_worker_2.svg";
|
|
import AnimatedPage from "../components/AnimatedPage";
|
|
|
|
import Clouds from "../components/animations/Clouds";
|
|
|
|
export default function Home() {
|
|
const { screensTranslations } = useUser();
|
|
|
|
if (!screensTranslations || !screensTranslations.home) return <p>loading</p>;
|
|
const currentScreenTranslations = screensTranslations.home;
|
|
const uiTranslations = screensTranslations.ui;
|
|
|
|
return (
|
|
<>
|
|
<Clouds />
|
|
<AnimatedPage className='page-container page-container--home'>
|
|
<div className='screen screen--home'>
|
|
<Nav />
|
|
<section className='screen__content'>
|
|
<img className='cover_worker' src={coverWorker} alt='' />
|
|
<h1 className='application_title'>stay safe</h1>
|
|
<h2 className='application_subtitle'>interactive</h2>
|
|
<p className='application_description'>
|
|
{currentScreenTranslations.app_description}
|
|
</p>
|
|
<Link
|
|
title={uiTranslations.start}
|
|
to='/select-profile'
|
|
className='cta cta--construction cta--round cta--button-icon cta--play '
|
|
/>
|
|
</section>
|
|
<img className='screen_worker_1' src={screenWorker1} alt='' />
|
|
<img className='screen_worker_2' src={screenWorker2} alt='' />
|
|
</div>
|
|
</AnimatedPage>
|
|
</>
|
|
);
|
|
}
|