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

Moving components and creating jsconfig

Browse Source
This commit is contained in:
MaxOvs19
2023-05-29 15:01:38 +03:00
parent 3b605280b2
commit 5865c59ba3
24 changed files with 185 additions and 237 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/components/Modal/ModalRegistration/ModalRegistration.jsx Normal file
View File

@ -0,0 +1,79 @@
import React from "react";
import ModalLayout from "../../Common/ModalLayout/ModalLayout";
import BaseButton from "../../Common/BaseButton/BaseButton";
import telegramLogo from "../../../assets/icons/tgLogo.svg";
import doc from "../../../assets/icons/doc.svg";
import anyMoment from "../../../assets/icons/anyMoment.svg";
import "./modalRegistration.scss";
export const ModalRegistration = ({ active, setActive }) => {
return (
<ModalLayout active={active} setActive={setActive} styles={"registration"}>
<div className="registration-body__left">
<h2>
Подключайтесь к <p>itguild.</p>
</h2>
<p className="registration-body__left-desc">
Зарегистрируйтесь и назначайте собеседования любым специалистам без
задержек
</p>
<div className="input-body">
<div className="input-body__box">
<h5>Ваше имя</h5>
<input></input>
<h5>E-mail</h5>
<input></input>
</div>
<div className="input-body__box">
<h5>Название компании</h5>
<input></input>
<h5>Пароль</h5>
<input></input>
</div>
</div>
<div className="button-box">
<BaseButton
onClick={(e) => e.preventDefault()}
styles={"button-box__submit"}
>
Отправить
</BaseButton>
<h5>
У вас уже есть аккаунт? <p>Войти</p>
</h5>
</div>
</div>
<div className="registration-body__right">
<h4>Отказ от специалиста в любой момент</h4>
<div className="registration-body__right-text">
<img src={anyMoment}></img>
<p>
Поменяйте, откажитесь или возьмите еще специалиста в любой момент
работы.
</p>
</div>
<h4>100% постоплата</h4>
<div className="registration-body__right-text">
<img src={doc}></img>
<p>
Договор не подразумевает какую‑либо оплату до того, как вы
арендовали специалиста
</p>
</div>
<h4>Есть вопросы?</h4>
<div className="registration-body__right-text">
<img src={telegramLogo}></img>
<p>Напишите нам в Телеграм. Мы с удовольствием ответим!</p>
</div>
</div>
<span onClick={() => setActive(false)} className="exit"></span>
</ModalLayout>
);
};
export default ModalRegistration;

128
src/components/Modal/ModalRegistration/modalRegistration.scss Normal file
View File

@ -0,0 +1,128 @@
.registration {
background: white;
display: flex;
flex-direction: row;
padding: 0;
justify-content: space-between;
border: 1px solid #dde2e4;
border-radius: 8px;
width: 1088px;
height: 529px;
&-body {
&__left {
padding: 60px 0 30px 77px;
h2 {
font-weight: 500;
font-size: 35px;
line-height: 32px;
display: flex;
justify-content: space-between;
width: 405px;
margin: 0 auto;
}
h2 > p {
font-size: 35px;
color: #52b709;
}
&-desc {
text-align: center;
width: 500px;
font-weight: 500;
font-size: 16px;
line-height: 28px;
margin: 20px auto 0 auto;
}
.input-body {
margin-top: 44px;
display: flex;
flex-direction: row;
&__box {
margin-right: 25px;
display: flex;
flex-direction: column;
h5 {
font-weight: 400;
font-size: 15px;
line-height: 18px;
}
input {
width: 294px;
height: 35px;
background: #eff2f7;
border-radius: 8px;
border: none;
margin-bottom: 35px;
padding-left: 20px;
}
}
}
.button-box {
display: flex;
flex-direction: row;
margin-top: 10px;
&__submit {
width: 174px;
height: 46px;
font-size: 18px;
margin-right: 55px;
}
h5 {
display: flex;
align-items: flex-end;
font-size: 16px;
line-height: 28px;
p {
color: #406128;
text-decoration: underline;
margin: 0 0 0 5px;
}
}
}
}
&__right {
border-left: 1px solid #f1f1f1;
padding: 80px 32px 46px 25px;
display: flex;
flex-direction: column;
justify-content: space-between;
h4 {
font-weight: 900;
font-size: 14px;
line-height: 24px;
color: #52b709;
margin-right: 100px;
width: 180px;
}
&-text {
display: flex;
flex-direction: row;
p {
font-weight: 400;
font-size: 12px;
line-height: 22px;
width: 205px;
}
img {
margin: 0 18px 20px 0;
}
}
}
}
}