Mikola
107 lines
3.4 KiB
React
107 lines
3.4 KiB
React
import React from "react";
|
|
import SVG from "react-inlinesvg";
|
|
import { Link } from "react-router-dom";
|
|
|
|
import { Footer } from "@components/Common/Footer/Footer";
|
|
|
|
import arrow from "assets/icons/arrows/arrowLanding.svg";
|
|
import authIcon from "assets/icons/authIcon.svg";
|
|
import clue from "assets/icons/landingClue.svg";
|
|
import telegram from "assets/icons/telegramIcon.svg";
|
|
import vk from "assets/icons/vkIcon.svg";
|
|
import codeBg from "assets/images/landingBackgroundCode.svg";
|
|
import cat from "assets/images/landingCat.png";
|
|
|
|
import "./landing.scss";
|
|
|
|
export const Landing = () => {
|
|
const opportunities = [
|
|
{
|
|
name: "<span>Аутстаффинг</span> сотрудников",
|
|
class: "outstaffing__employees",
|
|
img: cat
|
|
},
|
|
{
|
|
name: "Модуль для видеоконференций"
|
|
},
|
|
{
|
|
name: "Система контроля версий GIT"
|
|
},
|
|
{
|
|
name: "Управление задачами"
|
|
},
|
|
{
|
|
name: "Система для отчётности"
|
|
},
|
|
{
|
|
name: "Все наши предложения",
|
|
class: "outstaffing__offers",
|
|
img: arrow
|
|
}
|
|
];
|
|
|
|
return (
|
|
<section className="landing">
|
|
<div className="landing__container">
|
|
<div className="landing__head">
|
|
<h2 className="head__logo">ITGUILD</h2>
|
|
<Link className="head__signIn" to="/auth">
|
|
войти в систему
|
|
</Link>
|
|
<Link className="head__signUp" to="/auth">
|
|
<SVG src={authIcon} />
|
|
авторизация
|
|
</Link>
|
|
</div>
|
|
<div className="landing__info">
|
|
<p className="info__title">
|
|
<SVG className="code" src={codeBg} />
|
|
<span>Экосистема</span> для диджитализации бизнеса
|
|
</p>
|
|
<div className="landing__background">
|
|
<h3>ITGuild</h3>
|
|
<SVG className="clue" src={clue} />
|
|
<SVG className="code" src={codeBg} />
|
|
</div>
|
|
<div className="info__block">
|
|
<p>
|
|
Подберем и документально оформим IT-специалистов, после чего
|
|
передадим исполнителей под ваше руководство.
|
|
<br />
|
|
<br />
|
|
<span>Вы получаете полное управление над сотрудниками,</span> имея
|
|
возможность контролировать и заменять IT штат.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div className="landing__opportunities">
|
|
{opportunities.map((opportunity, index) => {
|
|
return (
|
|
<div
|
|
className={
|
|
opportunity.class ? opportunity.class : "landing__opportunity"
|
|
}
|
|
key={index}
|
|
>
|
|
{opportunity.class ? (
|
|
<div>
|
|
<p dangerouslySetInnerHTML={{ __html: opportunity.name }} />
|
|
{opportunity.img ? (
|
|
<img src={opportunity.img} alt="img" />
|
|
) : (
|
|
""
|
|
)}
|
|
</div>
|
|
) : (
|
|
<p>{opportunity.name}</p>
|
|
)}
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
<Footer />
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|