apuc/guild_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

landing

Browse Source
This commit is contained in:
Mikola
2024-04-16 17:01:13 +03:00
parent 86a784bee2
commit 066cd569d3
3 changed files with 94 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
src/pages/Landing/Landing.jsx
View File

@ -2,110 +2,128 @@ import React from "react";
import SVG from "react-inlinesvg";
import { Link } from "react-router-dom";
import authIcon from 'assets/icons/authIcon.svg'
import clue from "assets/icons/landingClue.svg"
import cat from "assets/images/landingCat.png"
import arrow from "assets/icons/arrows/arrowLanding.svg"
import vk from "assets/icons/vkIcon.svg"
import telegram from "assets/icons/telegramIcon.svg"
import codeBg from "assets/images/landingBackgroundCode.svg"
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',
name: "<span>Аутстаффинг</span> сотрудников",
class: "outstaffing__employees",
img: cat
},
{
name: 'Модуль для видеоконференций',
name: "Модуль для видеоконференций"
},
{
name: 'Система контроля версий GIT',
name: "Система контроля версий GIT"
},
{
name: 'Управление задачами',
name: "Управление задачами"
},
{
name: 'Система для отчётности',
name: "Система для отчётности"
},
{
name: 'Все наши предложения',
class: 'outstaffing__offers',
name: "Все наши предложения",
class: "outstaffing__offers",
img: arrow
}
]
];
const socials = [
{
img: vk,
to: ''
to: ""
},
{
img: telegram,
to: ''
to: ""
}
]
];
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'>
<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} />
<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} />
<SVG className="clue" src={clue} />
<SVG className="code" src={codeBg} />
</div>
<div className="info__block">
<p>
Подберем и документально оформим IT-специалистов, после чего передадим исполнителей под ваше руководство.
<br/><br/>
<span>Вы получаете полное управление над сотрудниками,</span> имея возможность контролировать и заменять IT штат.
Подберем и документально оформим 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>
})
}
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>
<div className="landing__footer">
<div className="footer__links">
<div className="footer__socials">
{socials.map((social, index) => {
return <Link to={social.to} key={index}><SVG src={social.img} /></Link>
return (
<Link to={social.to} key={index}>
<SVG src={social.img} />
</Link>
);
})}
</div>
<Link className='footer__invite' to='/auth'>Присоединиться к команде</Link>
<Link className="footer__invite" to="/auth">
Присоединиться к команде
</Link>
</div>
<div className="footer__info">
<p>
office@itguild.info
</p>
<p>
© 2024 - Outstaffing. Все права защищены
</p>
<p>office@itguild.info</p>
<p>© 2024 - Outstaffing. Все права защищены</p>
</div>
</div>
</div>