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

candidate auth

Browse Source
This commit is contained in:
Николай Полтщук
2023-04-04 19:07:19 +03:00
parent 615606d3e6
commit 4e61ea043d
12 changed files with 684 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/pages/RegistrationForCandidate/RegistrationForCandidate.js Normal file
View File

@ -0,0 +1,72 @@
import React from 'react';
import AuthHeader from "../../components/AuthHeader/AuthHeader";
import SideBar from "../../components/SideBar/SideBar";
import StepsForCandidate from "../../components/StepsForCandidate/StepsForCandidate"
import {Footer} from "../../components/Footer/Footer";
import BackEndImg from "../../pages/PartnerСategories/images/personalBackEnd.png"
import arrowBtn from "../../images/arrowRight.png";
import './registationForCandidate.scss'
export const RegistrationForCandidate = () => {
return(
<div className='registrationCandidate'>
<AuthHeader/>
<div className='container'>
<div className='registrationCandidate__start'>
<h2 className="auth-candidate__start__title">Хочу в команду <span>Айти специалистов</span></h2>
<div className="change-mode__arrow">
<img src={arrowBtn}></img>
</div>
<p className="auth-candidate__start__description">Для нас не имеет значение Ваша локация.</p>
<StepsForCandidate step="шаг 2 - заполните данные" />
<div className='registrationCandidate__formWrapper'>
<div className='registrationCandidate__info'>
<div className='registrationCandidate__info__category'>
<img src={BackEndImg} alt='img' />
<p>Backend разработчики</p>
</div>
<p className='registrationCandidate__info__skills'>Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript</p>
<div className='registrationCandidate__info__arrow'>
<img src={arrowBtn} alt='img' />
</div>
</div>
<form className='registrationCandidate__form'>
<div className='registrationCandidate__form__input'>
<label htmlFor="name">Ваше имя *</label>
<input id="name" type="text" placeholder="Имя" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="summary">Если есть ссылка на резюме</label>
<input id="summary" type="text" placeholder="Резюме" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="email">Ваш email *</label>
<input id="email" type="text" placeholder="Email" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="tg">Ваш телеграм*</label>
<input id="tg" type="text" placeholder="Телеграм" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="password">Придумайте пароль*</label>
<input id="password" type="text" placeholder="Пароль" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="secondPassword">Повторите пароль*</label>
<input id="secondPassword" type="text" placeholder="Пароль" />
</div>
<div className='registrationCandidate__form__submit'>
<button>Отправить</button>
</div>
</form>
</div>
</div>
</div>
<SideBar/>
<Footer/>
</div>
)
}

128
src/pages/RegistrationForCandidate/registationForCandidate.scss Normal file
View File

@ -0,0 +1,128 @@
.registrationCandidate {
font-family: "LabGrotesque", sans-serif;
position: relative;
background-color: #f1f1f1;
&__start {
display: flex;
position: relative;
flex-direction: column;
align-items: center;
margin-top: 55px;
.step {
top: 36.5%;
}
}
&__formWrapper {
position: relative;
margin-top: 200px;
display: flex;
padding: 33px 69px 32px 30px;
background: #FFFFFF;
border-radius: 12px;
width: 100%;
}
&__info {
display: flex;
flex-direction: column;
row-gap: 30px;
&__category {
display: flex;
align-items: center;
img {
width: 48px;
}
p {
margin-left: 18px;
font-weight: 500;
font-size: 18px;
line-height: 22px;
max-width: 120px;
}
}
&__skills {
max-width: 180px;
font-weight: 400;
font-size: 12px;
line-height: 20px;
color: #6F6F6F;
}
&__arrow {
width: 48px;
height: 48px;
background: #DDEEC6;
border-radius: 50px;
display: flex;
justify-content: center;
align-items: center;
img {
transform: rotate(180deg);
}
}
}
&__form {
display: flex;
flex-wrap: wrap;
margin-left: 70px;
margin-top: 20px;
row-gap: 28px;
column-gap: 55px;
&__input {
display: flex;
flex-direction: column;
width: 46%;
label {
font-weight: 400;
font-size: 15px;
line-height: 18px;
color: #000000;
margin-bottom: 15px;
}
input {
background: #EFF2F7;
border-radius: 8px;
width: 100%;
padding: 8px 12px;
border: none;
outline: none;
font-weight: 400;
font-size: 15px;
line-height: 18px;
}
}
&__submit {
width: 100%;
margin-top: 10px;
button {
border: none;
font-weight: 500;
font-size: 18px;
line-height: 32px;
color: #FFFFFF;
background: #52B709;
border-radius: 44px;
width: 180px;
height: 46px;
}
}
}
footer {
margin-top: 80px;
}
}