Skip to content

A
Avalon
Commit c67493f5 authored by Sergey's avatar Sergey
Browse files
Options

Post resume steps two and three is done

parent 45a2e10e
Hide whitespace changes
Inline Side-by-side
Showing with 953 additions and 63 deletions
src/js/main.js
View file @ c67493f5
...@@ -742,19 +742,20 @@ if(buttonMailingPhone && buttonMailingEmail) ...@@ -742,19 +742,20 @@ if(buttonMailingPhone && buttonMailingEmail)
}); });
} }
// Загрузка фото // Загрузка фото
let canvasAvatar = document.querySelector('#canvas-avatar'); let canvasAvatar = document.querySelector('#canvas-avatar');
let ctx = canvasAvatar.getContext("2d");
let initialAvatar = new Image();
// Загружаем файл изображения
initialAvatar.src = "../img/img_substrate.png";
if(canvasAvatar) if(canvasAvatar)
{ {
let ctx = canvasAvatar.getContext("2d");
let initialAvatar = new Image();
// Загружаем файл изображения
initialAvatar.src = "../img/img_substrate.png";
initialAvatar.onload = function() initialAvatar.onload = function()
{ {
ctx.drawImage(initialAvatar, 0, 0, 210, 210); ctx.drawImage(initialAvatar, 0, 0, 210, 210);
...@@ -785,6 +786,156 @@ if(canvasAvatar) ...@@ -785,6 +786,156 @@ if(canvasAvatar)
} }
// Выбор должности
let position = document.querySelector('#position');
let otherPosition = document.querySelector('#other-position');
if(position && otherPosition)
{
position.addEventListener('change', () => {
console.log(1);
if(position.value === 'other')
{
otherPosition.removeAttribute('disabled');
}
else
{
otherPosition.setAttribute('disabled', 'disabled');
}
});
}
// Добавить другой город
let addOtherCity = document.querySelectorAll('.add-other-city');
let indexCity = 0
if(addOtherCity.length)
{
addOtherCity.forEach(elem => {
elem.addEventListener('click', (e) => {
e.preventDefault();
let newCity = document.createElement('input');
indexCity++;
newCity.type = "text";
newCity.id = 'other-city' + indexCity;
newCity.name = 'other-city' + indexCity;
newCity.placeholder = 'ГОРОД';
newCity.style.marginTop = '7px';
elem.parentElement.parentElement.querySelector('.block-post-resume').appendChild(newCity);
});
});
}
// Начало и конец работы
let inputWork = document.querySelectorAll('.work-period__block input');
if(inputWork.length)
{
inputWork.forEach(elem =>
{
datepicker(elem, {
formatter: (input, date, instance) =>
{
const value = date.toLocaleDateString();
input.value = value; // => '1/1/2099'
},
startDay: 0,
customDays: ['ПН', 'ВТ', 'СР', 'ЧТ', 'ПТ', 'СБ', 'ВС'],
customMonths: ['Январь', 'Февраль', 'Март', 'Апрель', 'Май', 'Июнь', 'Июль', 'Август', 'Сентябрь', 'Октябрь', 'Ноябрь', 'Декабрь'],
showAllDates: true,
overlayButton: 'Выбрать',
overlayPlaceholder: 'Укажите год'
});
});
}
// Добавление места работы
let addPlaceWork = document.querySelectorAll('.add-place-work');
let indexPlaceWork = 0;
if(addPlaceWork.length)
{
addPlaceWork.forEach(elem => {
elem.addEventListener('click', (e) =>
{
e.preventDefault();
let newForm = elem.parentElement.parentElement.querySelector('.data-form-experience').cloneNode(true);
newForm.style.marginTop = '43px';
let newInputs = newForm.querySelectorAll('input');
let newLabels = newForm.querySelectorAll('label');
let newSelects = newForm.querySelectorAll('select');
let newTextarea = newForm.querySelectorAll('textarea');
indexPlaceWork++;
newInputs.forEach(input => {
let oldName = input.name;
input.name = oldName + indexPlaceWork;
let oldId = input.id;
input.id = oldId + indexPlaceWork;
});
newLabels.forEach(label => {
let oldFor = label.getAttribute('for');
label.setAttribute('for', oldFor + indexPlaceWork);
});
newSelects.forEach(select => {
let oldName = select.name;
select.name = oldName + indexPlaceWork;
let oldId = select.id;
select.id = oldId + indexPlaceWork;
});
newTextarea.forEach(textarea => {
let oldName = textarea.name;
textarea.name = oldName + indexPlaceWork;
let oldId = textarea.id;
textarea.id = oldId + indexPlaceWork;
});
elem.parentElement.parentElement.insertBefore(newForm, elem.parentElement);
newSelects.forEach(select => {
new Choices(select, {
choices: [],
placeholder: true,
searchEnabled: false,
itemSelectText: ''
});
});
newForm.querySelectorAll('.work-period__block input').forEach(elem => {
datepicker(elem, {
formatter: (input, date, instance) =>
{
const value = date.toLocaleDateString();
input.value = value; // => '1/1/2099'
},
startDay: 0,
customDays: ['ПН', 'ВТ', 'СР', 'ЧТ', 'ПТ', 'СБ', 'ВС'],
customMonths: ['Январь', 'Февраль', 'Март', 'Апрель', 'Май', 'Июнь', 'Июль', 'Август', 'Сентябрь', 'Октябрь', 'Ноябрь', 'Декабрь'],
showAllDates: true,
overlayButton: 'Выбрать',
overlayPlaceholder: 'Укажите год'
});
});
});
});
}
......
src/main.html
View file @ c67493f5
...@@ -206,8 +206,14 @@ ...@@ -206,8 +206,14 @@
<li> <li>
<a href="post-resume-step1.html">Разместить резюме - Шаг 1</a> <a href="post-resume-step1.html">Разместить резюме - Шаг 1</a>
</li> </li>
<!-- <li> <li>
<a href="post-resume-step2.html">Разместить резюме - Шаг 2</a> <a href="post-resume-step2.html">Разместить резюме - Шаг 2</a>
</li>
<li>
<a href="post-resume-step3.html">Разместить резюме - Шаг 3</a>
</li>
<!-- <li>
<a href="post-resume-step4.html">Разместить резюме - Шаг 4</a>
</li> --> </li> -->
</ul> </ul>
</div> </div>
......
src/post-resume-step2.html
View file @ c67493f5
...@@ -172,62 +172,355 @@ ...@@ -172,62 +172,355 @@
<a href="#" class="steps-post-resume__step">Шаг 3. Опыт работы</a> <a href="#" class="steps-post-resume__step">Шаг 3. Опыт работы</a>
</div> </div>
<div class="block-mt-blue"> <div class="block-mt-blue">
<form action="" name="post-resume-step1" id="post-resume-step1"> <div class="container-compressed">
<div class="container-compressed"> <form action="" name="post-resume-step2" id="post-resume-step2">
<div class="block-mb-yellow"> <div class="block-mb-orange">
<label for="name">Имя</label> <label for="position">Желаемая должность</label>
<input type="text" placeholder="ИМЯ" name="name" id="name"> <select name="position" id="position">
<option value="1">Должность 1</option>
<option value="2">Должность 2</option>
<option value="3">Должность 3</option>
<option value="other">Другая</option>
</select>
</div> </div>
<div class="block-mb-yellow"> <div class="block-mb-yellow">
<label for="sername">Фамилия</label> <input type="text" name="other-position" id="other-position" placeholder="ЖЕЛАЕМАЯ ДОЛЖНОСТЬ" disabled>
<input type="text" placeholder="ФАМИЛИЯ" name="sername" id="sername">
</div> </div>
<div class="block-mb-yellow"> <div class="block-mb-green">
<label for="patronymic">Отчество</label> <label for="desired-salary">Желаемая зарплата, руб</label>
<input type="text" placeholder="ОТЧЕСТВО" name="patronymic" id="patronymic"> <div class="desired-salary">
<input type="text" name="desired-salary" id="desired-salary" placeholder="0">
<select name="time-salary" id="time-salary">
<option value="month">В месяц</option>
<option value="week">В неделю</option>
<option value="year">В год</option>
</select>
</div>
</div> </div>
<div class="block-mb-yellow"> <div class="block-mb-green">
<label for="birthday">Дата рождения</label> <div class="block-post-resume">
<input type="text" name="birthday" id="birthday" placeholder="ВЫБЕРИТЕ ДАТУ"> <div class="row">
<div class="col-4">
<div class="block-post-resume__name">
<p>Стаж работы:</p>
</div>
</div>
<div class="col-8">
<div class="row">
<div class="col-6">
<div class="block-radio">
<label for="no-exp">
<input type="radio" id="no-exp" name="work-experience" hidden>
<div class="radio"></div>
<p>Без опыта</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-radio">
<label for="one-three">
<input type="radio" id="one-three" name="work-experience" hidden>
<div class="radio"></div>
<p>1-3 года</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-radio">
<label for="season-work">
<input type="radio" id="season-work" name="work-experience" hidden>
<div class="radio"></div>
<p>Студент / сезоннная работа</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-radio">
<label for="three-five">
<input type="radio" id="three-five" name="work-experience" hidden>
<div class="radio"></div>
<p>3-5 лет</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-radio">
<label for="less-year">
<input type="radio" id="less-year" name="work-experience" hidden>
<div class="radio"></div>
<p>До 1 года</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-radio">
<label for="more-five">
<input type="radio" id="more-five" name="work-experience" hidden>
<div class="radio"></div>
<p>Более 5 лет</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-radio">
<label for="job-weekend">
<input type="radio" id="job-weekend" name="work-experience" hidden>
<div class="radio"></div>
<p>Подработка на выходные</p>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<div class="block-gender block-mb-green"> <div class="block-mb-green">
<p>Пол:</p> <div class="block-post-resume">
<div class="block-radio"> <label for="city">Город, в котором готов работать</label>
<label for="male"> <select name="city" id="city">
<input type="radio" id="male" name="gender" hidden="" checked> <option value="month">Москва</option>
<div class="radio"></div> <option value="week">Казань</option>
Мужской <option value="year">Нижний Новгород</option>
</label> </select>
</div> </div>
<div class="block-radio"> <div class="block-add">
<label for="female"> <a href="#" class="button-text add-other-city">
<input type="radio" id="female" name="gender" hidden=""> <img class="img-svg" src="./img/icon_plus.svg" alt="">
<div class="radio"></div> Добавить город
Женский </a>
</label>
</div> </div>
</div> </div>
<div class="block-mb-yellow"> <div class="block-mb-green">
<label for="phone">Телефон</label> <div class="block-post-resume">
<input type="text" name="phone" id="phone" placeholder="+7"> <div class="row">
<div class="col-4">
<div class="block-post-resume__name">
<p>Тип занятости:</p>
</div>
</div>
<div class="col-8">
<div class="row">
<div class="col-6">
<div class="block-checkbox">
<label for="shifts30">
<input type="checkbox" id="shifts30" name="shifts30" hidden>
<div class="check"></div>
<p>Вахта 30 смен</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="full-employment">
<input type="checkbox" id="full-employment" name="full-employment" hidden>
<div class="check"></div>
<p>Полная занятость</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="shifts45">
<input type="checkbox" id="shifts45" name="shifts45" hidden>
<div class="check"></div>
<p>Вахта 45 смен</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="part-time">
<input type="checkbox" id="part-time" name="part-time" hidden>
<div class="check"></div>
<p>Частичная занятость</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="shifts60">
<input type="checkbox" id="shifts60" name="shifts60" hidden>
<div class="check"></div>
<p>Вахта 60 смен</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="temporary-job">
<input type="checkbox" id="temporary-job" name="temporary-job" hidden>
<div class="check"></div>
<p>Временная работа</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="more-shifts60">
<input type="checkbox" id="more-shifts60" name="more-shifts60" hidden>
<div class="check"></div>
<p>Вахта более 60 смен</p>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<div class="block-mb-yellow"> <div class="block-mb-green">
<label for="email">E-mail</label> <div class="block-post-resume">
<input type="text" name="email" id="email" placeholder="E-MAIL"> <div class="row">
<div class="col-4">
<div class="block-post-resume__name">
<p>График работы:</p>
</div>
</div>
<div class="col-8">
<div class="row">
<div class="col-6">
<div class="block-checkbox">
<label for="full-day">
<input type="checkbox" id="full-day" name="full-day" hidden>
<div class="check"></div>
<p>Полный день</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="change">
<input type="checkbox" id="change" name="change" hidden>
<div class="check"></div>
<p>Смена</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="flexible-schedule">
<input type="checkbox" id="flexible-schedule" name="flexible-schedule" hidden>
<div class="check"></div>
<p>Гибкий график</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="remote-work">
<input type="checkbox" id="remote-work" name="remote-work" hidden>
<div class="check"></div>
<p>Удалённая работа</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="business-trips">
<input type="checkbox" id="business-trips" name="business-trips" hidden>
<div class="check"></div>
<p>Готов к командировкам</p>
</label>
</div>
</div>
<div class="col-6">
<div class="block-checkbox">
<label for="ready-move">
<input type="checkbox" id="ready-move" name="ready-move" hidden>
<div class="check"></div>
<p>Готов к переездам</p>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<div class="block-mb-orange"> <div class="block-mb-green">
<label for="address">Адрес</label> <div class="block-post-resume">
<input type="text" name="address" id="address" placeholder="РЕГИОН / РАЙОН, ГОРОД / Н.П., УЛИЦА"> <div class="row">
<div class="col-4">
<div class="block-post-resume__name">
<p>Способ связи:</p>
</div>
</div>
<div class="col-8">
<div class="block-callback">
<div class="block-radio">
<label for="call-myself">
<input type="radio" id="call-myself" name="callback" hidden="" checked="">
<div class="radio"></div>
Позвоню сам
</label>
</div>
<div class="block-radio">
<label for="call-me">
<input type="radio" id="call-me" name="callback" hidden="">
<div class="radio"></div>
Позвоните мне
</label>
<select name="time-call" id="time-call">
<option value="0">Время звонка</option>
<option value="10">Через 10 минут</option>
<option value="15">Через 15 минут</option>
<option value="30">Через 30 минут</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<p class="block-mb-green" style="font-size: 14px;">Начните вводить адрес и выберите подходящий из появившегося списка</p> <div class="block-mb-green">
<p class="block-mb-green" style="font-size: 14px;">* - поля, обязательные для заполнения</p> <div class="block-post-resume">
<p class="block-mb-blue" style="font-size: 14px;">Нажимая кнопку «Далее», Вы даёте своё согласие на обработку персональных данных</p> <div class="row">
<div class="transfer-steps"> <div class="col-4">
<button type="button" class="other-button" id="prev-step-resume">Назад</button> <div class="block-post-resume__name">
<button type="button" class="main-button" id="next-step-resume">Далее</button> <p>Дополнительная информация:</p>
</div>
</div>
<div class="col-8">
<div class="row">
<div class="col-12">
<div class="block-checkbox">
<label for="criminal-record">
<input type="checkbox" id="criminal-record" name="criminal-record" hidden>
<div class="check"></div>
<p>Наличие судимости</p>
</label>
</div>
</div>
<div class="col-12">
<div class="block-checkbox">
<label for="chronic-diseases">
<input type="checkbox" id="chronic-diseases" name="chronic-diseases" hidden>
<div class="check"></div>
<p>Наличие хронических заболеваний</p>
</label>
</div>
</div>
<div class="col-12">
<div class="block-checkbox">
<label for="medical-book">
<input type="checkbox" id="medical-book" name="medical-book" hidden>
<div class="check"></div>
<p>Наличие медицинской книжки</p>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
</form>
<div class="transfer-steps">
<button type="button" class="other-button" id="prev-step-resume">Назад</button>
<button type="button" class="main-button" id="next-step-resume">Далее</button>
</div> </div>
</form> </div>
</div> </div>
</div> </div>
</div> </div>
......
src/post-resume-step3.html
View file @ c67493f5
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Разместить резюме</title>
</head>
<body>
<div class="wrapper">
<header class="header">
<div class="header-top">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-top-left">
<a href="#" class="choice-lang">
RU
<img class="img-svg" src="./img/arrow_down.svg" alt="">
</a>
<a href="#" class="choice-city">
Нижний Новгород
<img class="img-svg" src="./img/arrow_down.svg" alt="">
</a>
</div>
<div class="col-auto header-top-middle">
<a href="#" class="choice-mode choice-mode_active">Ищу работу</a>
<a href="#" class="choice-mode">Ищу работника</a>
</div>
<div class="col-auto header-top-right justify-content-between">
<a href="#" class="button-text favorites">
<img class="img-svg" src="./img/icon_favorites.svg" alt="">
Избранное
</a>
<a href="#" class="button-text feedback" data-count="+16">
<img class="img-svg" src="./img/icon_feedback.svg" alt="">
Отклики
</a>
<a href="#" class="help">
Помощь
<img class="img-svg" src="./img/arrow_down.svg" alt="">
</a>
</div>
</div>
</div>
</div>
<div class="header-bottom">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-bottom-left">
<a href="#">
<img src="./img/logo.svg" alt="">
</a>
<p>Быстрый поиск узкоквалифицированной работы</p>
</div>
<div class="col-auto header-bottom-right">
<a href="#" class="button-text search-work">
<img class="img-svg" src="./img/icon_search.svg" alt="">
Найти работу
</a>
<a href="#" class="button-text release-resume">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить резюме
</a>
<a href="#" class="button-text login hidden">
<img class="img-svg" src="./img/icon_enter.svg" alt="">
Войти
</a>
<div class="header-profile">
<a href="#" class="button-text profile">
<img class="img-svg" src="./img/icon_profile.svg" alt="">
Иванов Иван
</a>
<a href="#" class="button-text logout">
<img class="img-svg" src="./img/icon_logout.svg" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="header-scroll">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto">
<a href="#">
<img src="./img/logo_fixed.svg" alt="">
</a>
</div>
<div class="col-auto">
<a href="#" class="button-text choice-mode">
Ищу работника
<img class="img-svg" src="./img/arrow_down_scroll.svg" alt="">
</a>
</div>
<div class="col-6 header-scroll-right">
<a href="#" class="button-text favorites">
<img class="img-svg" src="./img/icon_favorites_scroll.svg" alt="">
</a>
<a href="#" class="button-text feedback" data-count="+16">
<img class="img-svg" src="./img/icon_feedback_scroll.svg" alt="">
</a>
<a href="#" class="button-text search-work">
<img class="img-svg" src="./img/icon_search_scroll.svg" alt="">
</a>
<a href="#" class="button-text release-resume">
<img class="img-svg" src="./img/icon_resume_scroll.svg" alt="">
</a>
<a href="#" class="button-text login hidden">
<img class="img-svg" src="./img/icon_enter_scroll.svg" alt="">
</a>
<div class="header-profile">
<a href="#" class="button-text profile">
<img class="img-svg" src="./img/icon_profile_scroll.svg" alt="">
Иванов Иван
</a>
<a href="#" class="button-text logout">
<img class="img-svg" src="./img/icon_logout_scroll.svg" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
</header>
<div class="wrapper-content block-mt-dark-blue block-mb-purple">
<div class="container">
<h1>Разместить резюме</h1>
<div class="content-page block-mt-dark-blue">
<div class="profile-container">
<div class="row profile-container-row">
<div class="col-3">
<div class="sidebar-profile">
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_profile.svg" alt="">
Профиль
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_my_resumes.svg" alt="">
Мои резюме
</a>
<a href="#" class="button-text release-resume current-ref">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить резюме
</a>
<a href="#" class="button-text feedback" data-count="+16">
<img class="img-svg" src="./img/icon_feedback.svg" alt="">
Отклики
</a>
<a href="#" class="button-text favorites">
<img class="img-svg" src="./img/icon_favorites.svg" alt="">
Избранное
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_subscribe.svg" alt="">
Подписка
</a>
</div>
<div class="sidebar-image block-mt-blue" style="background-image: url(./img/img_banner5.png);"></div>
</div>
<div class="col-9">
<div class="post-resume">
<p>Основная цель резюме – выделить тебя на фоне других соискателей, привлечь внимание работодателя и, в конечном итоге, пригласить тебя на собеседование. А это сделать очень непросто. Представь себе на минуту тот факт, что почтовый ящик твоего потенциального работодателя засыпают десятками и даже сотнями (зависит от размера компании) резюме в день. И на просмотр твоего резюме он потратит максимум 30 секунд – и в течение этого маленького времени решится твоя дальнейшая судьба и дается ответ на главный вопрос работодателя: подходит ли мне этот сотрудник?</p>
<div class="block-mt-blue">
<div class="steps-post-resume">
<a href="#" class="steps-post-resume__step">Шаг 2. Пожелания к работе</a>
<div class="steps-post-resume__arrow">
<img src="./img/arrow_step.svg" alt="">
</div>
<a href="#" class="steps-post-resume__step steps-post-resume__step_current">Шаг 3. Опыт работы</a>
<div class="steps-post-resume__arrow">
<img src="./img/arrow_step.svg" alt="">
</div>
<a href="#" class="steps-post-resume__step">Шаг 4. Моё резюме</a>
</div>
<div class="block-mt-blue">
<div class="container-compressed">
<div class="block-skip-step">
<p>Пропустите этот шаг, если у Вас нет опыта работы</p>
<a href="#" class="other-button">Пропустить</a>
</div>
</div>
</div>
<div class="block-mt-green">
<div class="container-compressed">
<form action="" id="post-resume-step3" name="post-resume-step3">
<div class="data-form-experience">
<div class="block-mb-yellow">
<label for="company">Компания</label>
<input type="text" name="company" id="company" placeholder="КОМПАНИЯ">
</div>
<div class="block-mb-orange">
<label for="position">Желаемая должность</label>
<select name="position" id="position">
<option value="1">Должность 1</option>
<option value="2">Должность 2</option>
<option value="3">Должность 3</option>
<option value="other">Другая</option>
</select>
</div>
<div class="block-mb-yellow">
<input type="text" name="other-position" id="other-position" placeholder="ЖЕЛАЕМАЯ ДОЛЖНОСТЬ">
</div>
<div class="block-mb-yellow">
<div class="work-period">
<p>Период работы</p>
<div class="work-period__block">
<p>с</p>
<input type="text" name="start-work" id="start-work">
</div>
<div class="work-period__block">
<p>по</p>
<input type="text" name="end-work" id="end-work">
</div>
</div>
</div>
<div class="block-mb-yellow">
<div class="block-checkbox">
<label for="working">
<input type="checkbox" id="working" name="working" hidden>
<div class="check"></div>
<p>Работаю в данный момент</p>
</label>
</div>
</div>
<div class="block-mb-yellow">
<label for="city-work">Город</label>
<select name="city-work" id="city-work">
<option value="month">Москва</option>
<option value="week">Казань</option>
<option value="year">Нижний Новгород</option>
</select>
</div>
<div class="block-mb-green">
<label for="responsibility">Обязанности</label>
<textarea name="responsibility" id="responsibility"></textarea>
</div>
</div>
</form>
<div class="block-add">
<a href="#" class="button-text add-place-work">
<img class="img-svg" src="./img/icon_plus.svg" alt="">
Добавить место работы
</a>
</div>
<div class="transfer-steps block-mt-blue">
<button type="button" class="other-button" id="prev-step-resume">Назад</button>
<button type="button" class="main-button" id="next-step-resume">Далее</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<footer class="footer">
<div class="container">
<div class="row justify-content-between">
<div class="col-2 footer-left">
<a href="#">
<img src="./img/logo.svg" alt="">
</a>
</div>
<div class="col-9 footer-right">
<div class="row justify-content-between">
<div class="col-auto footer-pages">
<a href="#" class="footer-right__title">О сервисе</a>
<a href="#" class="footer-pages__link">Полезные статьи</a>
<a href="#" class="footer-pages__link">Часто задаваемые вопросы</a>
<a href="#" class="footer-pages__link">Как пользоваться сервисом</a>
</div>
<div class="col-auto footer-pages">
<a href="#" class="footer-right__title">Соискателям</a>
<a href="#" class="footer-pages__link">Разместить резюме</a>
<a href="#" class="footer-pages__link">Поиск работы</a>
<a href="#" class="footer-pages__link">Работа рядом</a>
</div>
<div class="col-auto footer-pages">
<a href="#" class="footer-right__title">Работодателям</a>
<a href="#" class="footer-pages__link">Разместить вакансию</a>
<a href="#" class="footer-pages__link">Доступ к базе резюме</a>
<a href="#" class="footer-pages__link">Реклама на сайте</a>
<a href="#" class="footer-pages__link">Метка TOP-компании</a>
</div>
<div class="col-auto footer-contacts">
<a href="#" class="footer-right__title">Контакты</a>
<div class="footer-contacts__block">
<div class="footer-contacts__block__image">
<img src="./img/icon_phone.svg" alt="">
</div>
<div class="footer-contacts__block__content">
<a href="tel:79876543210">+7 987 654 32 10</a>
<a href="tel:71234567890">+7 123 456 78 90</a>
</div>
</div>
<div class="footer-contacts__block">
<div class="footer-contacts__block__image">
<img src="./img/icon_mail.svg" alt="">
</div>
<div class="footer-contacts__block__content">
<a href="mailto:info@vaxta-online.ru">info@vaxta-online.ru</a>
</div>
</div>
<button type="button" class="main-button button-feedback">Обратная связь</button>
</div>
</div>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>
\ No newline at end of file
src/scss/style.scss
View file @ c67493f5
...@@ -695,6 +695,18 @@ ul ...@@ -695,6 +695,18 @@ ul
{ {
background-color: #b7b6c3; background-color: #b7b6c3;
} }
p
{
font-family: Montserrat Regular;
font-size: 15px;
font-weight: 400;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: $color-primary;
width: 80%;
}
} }
} }
.block-radio:hover .block-radio:hover
...@@ -755,6 +767,18 @@ ul ...@@ -755,6 +767,18 @@ ul
{ {
opacity: 1; opacity: 1;
} }
p
{
font-family: Montserrat Regular;
font-size: 15px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: $color-primary;
width: 80%;
}
} }
} }
...@@ -3939,6 +3963,11 @@ input[type="submit"] ...@@ -3939,6 +3963,11 @@ input[type="submit"]
color: $color-disabled; color: $color-disabled;
text-transform: uppercase; text-transform: uppercase;
border: 0; border: 0;
transition: .3s;
}
&__step:hover
{
color: $color-hover;
} }
&__step_current &__step_current
{ {
...@@ -3953,18 +3982,19 @@ input[type="submit"] ...@@ -3953,18 +3982,19 @@ input[type="submit"]
form form
{ {
position: relative; position: relative;
.transfer-steps }
{ }
display: flex;
justify-content: space-between; .transfer-steps
align-items: center; {
.disabled display: flex;
{ justify-content: space-between;
opacity: 0; align-items: center;
z-index: -1; .disabled
pointer-events: none; {
} opacity: 0;
} z-index: -1;
pointer-events: none;
} }
} }
...@@ -4012,6 +4042,101 @@ input[type="submit"] ...@@ -4012,6 +4042,101 @@ input[type="submit"]
} }
// Страница Разместить резюме - Шаг 2
.desired-salary
{
display: flex;
justify-content: space-between;
align-items: center;
.choices, input{
width: 49.5% !important;
}
}
.block-post-resume
{
border-top: 2px solid #DDDCE8;
padding-top: 43px;
&__name
{
font-family: Raleway Regular;
font-size: 16px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: $color-primary;
}
.block-radio, .block-checkbox
{
margin-top: 0;
margin-bottom: 22px;
}
.block-callback
{
flex-direction: column;
align-items: flex-start;
}
.block-callback .block-radio:nth-child(2)
{
margin-left: 0;
}
}
.block-add
{
margin-top: 32px;
display: flex;
}
// Разместить резюме - Шаг 3
.form-experience
{
border-bottom: 2px solid #DDDCE8;
}
.block-skip-step
{
padding-bottom: 43px;
border-bottom: 2px solid #DDDCE8;
display: flex;
align-items: center;
justify-content: space-between;
}
.work-period
{
display: flex;
align-items: center;
justify-content: space-between;
&__block
{
display: flex;
align-items: center;
input
{
width: 184px;
margin-left: 10px;
}
}
p
{
font-family: Montserrat Regular;
font-size: 15px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.88;
letter-spacing: normal;
color: $color-primary;
}
}
.footer .footer
{ {
background-color: #fff; background-color: #fff;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment