Skip to content

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

Pages subscription, response-vacancy is done

parent a26c4ea9
Show whitespace changes
Inline Side-by-side
Showing with 1154 additions and 22 deletions
src/access-account.html
View file @ d75400fa
......@@ -125,7 +125,7 @@
<div class="container">
<h1>Вход в личный кабинет</h1>
<div class="content-page block-mt-dark-blue">
<div class="container-compressed">
<div class="container-compressed container-compressed_center">
<form action="" name="form-enter-account" id="form-enter-account">
<div class="block-mb-orange">
<label for="phone">Телефон</label>
......
src/img/icon_plus.svg 0 → 100644
View file @ d75400fa
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 0C4.5 0 0 4.5 0 10C0 15.5 4.5 20 10 20C15.5 20 20 15.5 20 10C20 4.5 15.5 0 10 0ZM10 18C5.6 18 2 14.4 2 10C2 5.6 5.6 2 10 2C14.4 2 18 5.6 18 10C18 14.4 14.4 18 10 18ZM11 9H14V11H11V14H9V11H6V9H9V6H11V9Z" fill="#262262"/>
</svg>
src/js/main.js
View file @ d75400fa
......@@ -172,7 +172,7 @@ if(elemsSelect.length > 0)
{
new Choices(elem, {
choices: [],
placeholder: false,
placeholder: true,
searchEnabled: false,
itemSelectText: ''
});
......@@ -678,6 +678,70 @@ if(resumesFeedback.length > 0)
}
// Блок Перезвонить мне
let callMe = document.querySelector('#call-me');
let callMyself = document.querySelector('#call-myself');
let timeCall = document.querySelector('.block-radio .choices');
if(callMe && callMyself)
{
timeCall.classList.add('disabled');
[callMe, callMyself].forEach(elem => {
elem.addEventListener('change', () => {
if(elem.checked)
{
timeCall.classList.toggle('disabled');
}
});
});
}
// Добавление другой должности
let addOtherPosition = document.querySelector('.add-other-position');
let otherPositionBlock = document.querySelector('.other-position__block');
let indexPosition = 1;
if(addOtherPosition)
{
addOtherPosition.addEventListener('click', (e) => {
e.preventDefault();
let newPosition = document.createElement('input');
indexPosition++;
newPosition.type = "text";
newPosition.id = 'other-position' + indexPosition;
newPosition.name = 'other-position' + indexPosition;
newPosition.placeholder = 'ДРУГАЯ ДОЛЖНОСТЬ';
newPosition.style.marginTop = '7px';
otherPositionBlock.appendChild(newPosition);
});
}
// Выбор способа рассылки
let mailingMethodOption = document.querySelector('.mailing-method-option');
let buttonMailingPhone = document.querySelector('#mailing-phone');
let buttonMailingEmail = document.querySelector('#mailing-email');
if(buttonMailingPhone && buttonMailingEmail)
{
[buttonMailingEmail, buttonMailingPhone].forEach(button => {
button.addEventListener('change', () => {
let option = button.id;
if(mailingMethodOption.querySelector('.mailing-method-option_selected').dataset.option !== option)
{
mailingMethodOption.querySelector('.mailing-method-option_selected').classList.remove('mailing-method-option_selected');
mailingMethodOption.querySelector('div[data-option="' + option + '"]').classList.add('mailing-method-option_selected');
}
});
});
}
src/main.html
View file @ d75400fa
......@@ -192,7 +192,16 @@
<a href="response.html">Отклики</a>
</li>
<li>
<a href="current-response.html">Отклик детальная</a>
<a href="response-resume.html">Отклик на резюме</a>
</li>
<li>
<a href="response-vacancy.html">Отклик на вакансию</a>
</li>
<li>
<a href="response-vacancy-not-reg.html">Отклик на вакансию без регистрации</a>
</li>
<li>
<a href="subscription.html">Подписка</a>
</li>
</ul>
</div>
......
src/password-recovery.html
View file @ d75400fa
......@@ -125,7 +125,7 @@
<div class="container">
<h1>Восстановление пароля</h1>
<div class="content-page block-mt-dark-blue">
<div class="container-compressed">
<div class="container-compressed container-compressed_center">
<form action="" name="form-password-recovery" id="form-password-recovery" enctype="multipart/form-data">
<div class="block-mb-green">
<label for="phone">Телефон</label>
......
src/registration.html
View file @ d75400fa
......@@ -169,7 +169,7 @@
</div>
</div>
</div>
<div class="container-compressed">
<div class="container-compressed container-compressed_center">
<div class="block-mt-blue">
<div class="tabs">
<div class="tabs-items">
......
src/current-response.html → src/response-resume.html
View file @ d75400fa
......@@ -158,7 +158,7 @@
</div>
<div class="col-9">
<div class="brief-information block-mb-green">
<div class="brief-information-block" style="align-items: center;">
<div class="brief-information-block">
<div class="brief-information-block__image">
<img src="./img/logo_employer.svg" alt="">
</div>
......@@ -177,10 +177,11 @@
</p>
</div>
<div class="block-mt-blue">
<div class="container-compressed">
<h2>Хотите что-нибудь написать?</h2>
<div class="block-mt-green">
<form action="" name="answer-employer" id="answer-employer">
<label for="">Сообщение</label>
<form action="" name="form-answer-employer" id="form-answer-employer">
<label for="message">Сообщение</label>
<textarea name="message" id="message"></textarea>
<div class="block-mt-green">
<input type="submit" class="main-button" name="submit-answer" value="Отправить">
......@@ -194,6 +195,7 @@
</div>
</div>
</div>
</div>
<footer class="footer">
<div class="container">
<div class="row justify-content-between">
......
src/response-vacancy-not-reg.html 0 → 100644
View file @ d75400fa
<!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 hidden">
<img class="img-svg" src="./img/icon_favorites.svg" alt="">
Избранное
</a>
<a href="#" class="button-text feedback hidden" 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">
<img class="img-svg" src="./img/icon_enter.svg" alt="">
Войти
</a>
<div class="header-profile header-profile_hidden">
<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 hidden">
<img class="img-svg" src="./img/icon_favorites_scroll.svg" alt="">
</a>
<a href="#" class="button-text feedback hidden" 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">
<img class="img-svg" src="./img/icon_enter_scroll.svg" alt="">
</a>
<div class="header-profile header-profile_hidden">
<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="brief-information block-mb-green">
<div class="brief-information-block">
<div class="brief-information-block__image">
<img src="./img/logo_employer.svg" alt="">
</div>
<div class="brief-information-block__info">
<p class="brief-information-block__title">Компания «Мария»</p>
<p class="brief-information-block__vacancy">Вакансия <a href="#">Столяр-обивщик</a></p>
</div>
</div>
</div>
<div class="block-mt-purple">
<div class="container-compressed">
<h2>Напишите сообщение работодателю</h2>
<form action="" name="form-message-employer-not-reg" id="form-message-employer-not-reg">
<div class="block-mt-green">
<label for="message">Ваше имя</label>
<input type="text" name="name" id="name" placeholder="Ваше имя">
</div>
<div class="block-mt-green 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 class="block-mt-green">
<label for="phone">Телефон</label>
<input type="text" name="phone" id="phone" placeholder="+7">
</div>
<div class="block-mt-green">
<label for="message">Сообщение</label>
<textarea name="message" id="message"></textarea>
</div>
<p class="block-mt-green" style="font-size: 14px;">* - поля, обязательные для заполнения</p>
<p class="block-mt-green" style="font-size: 14px;">Нажимая кнопку «Зарегистрироваться», Вы даёте своё согласие на обработку персональных данных</p>
<div class="block-mt-green">
<input type="submit" class="main-button" name="submit-answer" value="Отправить">
</div>
</form>
</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/response-vacancy.html 0 → 100644
View file @ d75400fa
<!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">
<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 favorites">
<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="brief-information block-mb-green">
<div class="brief-information-block">
<div class="brief-information-block__image">
<img src="./img/logo_employer.svg" alt="">
</div>
<div class="brief-information-block__info">
<p class="brief-information-block__title">Компания «Мария»</p>
<p class="brief-information-block__vacancy">Вакансия <a href="#">Столяр-обивщик</a></p>
</div>
</div>
</div>
<div class="block-mt-purple">
<div class="container-compressed">
<h2>Напишите работодателю</h2>
<div class="block-mt-green">
<form action="" name="form-message-employer" id="form-message-employer">
<label for="message">Сообщение</label>
<textarea name="message" id="message"></textarea>
<div class="block-mt-green">
<div class="block-select-filter">
<label for="select-resume">Прикрепить резюме</label>
<select name="select-resume" id="select-resume">
<option value="0">ВЫБЕРИТЕ РЕЗЮМЕ</option>
<option value="1">Резюме 1</option>
<option value="2">Резюме 2</option>
</select>
</div>
</div>
<div class="block-mt-green">
<input type="submit" class="main-button" name="submit-answer" value="Отправить">
</div>
</form>
</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 @ d75400fa
......@@ -372,6 +372,7 @@ input[type="text"], input[type="password"]
letter-spacing: normal;
color: $color-disabled;
border: solid 2px currentColor;
width: 100%;
}
input[type="text"]::placeholder, input[type="password"]::placeholder
......@@ -430,6 +431,7 @@ select
padding-left: 20px;
}
.choices__inner
{
border: solid 2px #dddce8 !important;
......@@ -459,7 +461,7 @@ select
background-color: #ffffff;
top: 101%;
box-shadow: 0 10px 20px 0 rgba(15, 20, 91, 0.1);
height: 108px;
max-height: 108px;
overflow: auto;
}
.choices__list--dropdown::-webkit-scrollbar
......@@ -519,6 +521,28 @@ select
right: 20px;
}
.choices.disabled
{
pointer-events: none;
}
.choices.disabled .choices__inner
{
border: solid 2px #dddce8 !important;
border-color: #dddce8 !important;
background: transparent;
}
.choices.disabled .choices__list--single .choices__item
{
color: #b7b6c3 !important;
}
.choices.disabled[data-type*=select-one]:after
{
border-top-color: #dddce8;
}
// Стили для блока с файлом
.block-file
......@@ -2483,7 +2507,6 @@ button
.container-compressed
{
width: 610px;
margin: 0 auto;
form
{
input[type="text"], input[type="submit"], input[type="password"]
......@@ -2512,6 +2535,11 @@ button
}
}
.container-compressed_center
{
margin: 0 auto;
}
// Страница Регистрация
......@@ -3098,6 +3126,29 @@ ymaps[class$='pie-chart-content']
color: $color-primary;
margin-bottom: 32px;
}
&__vacancy
{
font-family: Montserrat Bold;
font-size: 16px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: $color-primary;
a
{
font-family: Montserrat Bold;
font-size: 16px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
margin-left: 17px;
padding-bottom: 7px;
}
}
&__rating
{
display: flex;
......@@ -3743,19 +3794,105 @@ input[type="submit"]
}
}
// Отклик детальная
// Отклик на резюме и на вакансию
#answer-employer
// #form-answer-employer, #form-message-employer
.container-compressed
{
label
{
display: block;
// display: block;
margin-bottom: 10px;
}
textarea
{
width: 610px;
height: 198px;
width: 100%;
}
}
// Отклик на вакансию без регистрации
.block-callback
{
display: flex;
align-items: center;
.block-radio
{
display: flex;
align-items: center;
margin-top: 0;
label
{
display: flex;
margin-bottom: 0;
}
}
.block-radio:nth-child(2)
{
margin-left: 65px;
}
.choices
{
margin-left: 23px;
width: 233px;
}
}
// Страница Подписка
.subscription
{
form
{
.block-checkbox
{
margin-top: 0;
margin-bottom: 22px;
}
.other-position
{
display: flex;
.button-text
{
margin-left: 12px;
}
}
.other-position ~ p
{
margin-top: 22px;
font-family: Montserrat Regular;
font-size: 14px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.57;
letter-spacing: normal;
color: $color-primary;
}
.mailing-method
{
&-block
{
display: flex;
.block-radio:nth-child(2)
{
margin-left: 40px;
}
}
&-option
{
.container-compressed
{
display: none;
}
.container-compressed.mailing-method-option_selected
{
display: block;
}
}
}
}
}
......
src/subscription.html 0 → 100644
View file @ d75400fa
<!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">
<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 current-ref">
<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="subscription">
<p>Наши пользователи уже оценили опцию «Рассылка вакансий». С ее помощью легко и удобно узнавать об обновлениях вакансий в интересующих вас сферах. Не обязательно несколько раз в день просматривать изменения на сайте — достаточно открыть письмо с рассылкой. Теперь удобнее стал шаблон составления подписки на рассылку и изменилось ее оформление!</p>
<div class="block-mt-dark-blue">
<form action="" id="form-subscribe" name="form-subscribe">
<h2>Выберите желаемые должности</h2>
<div class="row block-mt-green">
<div class="col-4">
<div class="block-checkbox">
<label for="handyman">
<input type="checkbox" id="handyman" name="handyman" hidden="">
<div class="check"></div>
Разнорабочий
</label>
</div>
<div class="block-checkbox">
<label for="loader">
<input type="checkbox" id="loader" name="loader" hidden="">
<div class="check"></div>
Грузчик
</label>
</div>
<div class="block-checkbox">
<label for="production-worker">
<input type="checkbox" id="production-worker" name="production-worker" hidden="">
<div class="check"></div>
Рабочий на производство
</label>
</div>
<div class="block-checkbox">
<label for="packer">
<input type="checkbox" id="packer" name="packer" hidden="">
<div class="check"></div>
Фасовщик
</label>
</div>
<div class="block-checkbox">
<label for="washer">
<input type="checkbox" id="washer" name="washer" hidden="">
<div class="check"></div>
Мойщик
</label>
</div>
<div class="block-checkbox">
<label for="сompositor">
<input type="checkbox" id="сompositor" name="сompositor" hidden="">
<div class="check"></div>
Наборщик
</label>
</div>
</div>
<div class="col-4">
<div class="block-checkbox">
<label for="packer2">
<input type="checkbox" id="packer2" name="packer2" hidden="">
<div class="check"></div>
Упаковщик
</label>
</div>
<div class="block-checkbox">
<label for="sticker">
<input type="checkbox" id="sticker" name="sticker" hidden="">
<div class="check"></div>
Стикеровщик
</label>
</div>
<div class="block-checkbox">
<label for="cleaner">
<input type="checkbox" id="cleaner" name="cleaner" hidden="">
<div class="check"></div>
Уборщик
</label>
</div>
<div class="block-checkbox">
<label for="cashier">
<input type="checkbox" id="cashier" name="cashier" hidden="">
<div class="check"></div>
Кассир
</label>
</div>
<div class="block-checkbox">
<label for="merchandiser">
<input type="checkbox" id="merchandiser" name="merchandiser" hidden="">
<div class="check"></div>
Мерчендайзер
</label>
</div>
<div class="block-checkbox">
<label for="seller">
<input type="checkbox" id="seller" name="seller" hidden="">
<div class="check"></div>
Не требуется
</label>
</div>
</div>
<div class="col-4">
<div class="block-checkbox">
<label for="car-wash">
<input type="checkbox" id="car-wash" name="car-wash" hidden="">
<div class="check"></div>
Автомойщик
</label>
</div>
<div class="block-checkbox">
<label for="gas-tanker">
<input type="checkbox" id="gas-tanker" name="gas-tanker" hidden="">
<div class="check"></div>
Автозаправщик
</label>
</div>
<div class="block-checkbox">
<label for="waiter">
<input type="checkbox" id="waiter" name="waiter" hidden="">
<div class="check"></div>
Официант
</label>
</div>
<div class="block-checkbox">
<label for="maid">
<input type="checkbox" id="maid" name="maid" hidden="">
<div class="check"></div>
Горничная
</label>
</div>
<div class="block-checkbox">
<label for="courier">
<input type="checkbox" id="courier" name="courier" hidden="">
<div class="check"></div>
Курьер
</label>
</div>
<div class="block-checkbox">
<label for="rush-job">
<input type="checkbox" id="rush-job" name="rush-job" hidden="">
<div class="check"></div>
Срочная работа
</label>
</div>
</div>
</div>
<div class="block-mt-yellow">
<div class="other-position">
<div class="container-compressed">
<div class="other-position__block">
<label for="other-position">Другая должность</label>
<input type="text" name="other-position" id="other-position" placeholder="ДРУГАЯ ДОЛЖНОСТЬ">
</div>
</div>
<a href="#" class="button-text add-other-position">
<img class="img-svg" src="./img/icon_plus.svg" alt="">
Добавить другую должность
</a>
</div>
<p>Начните вводить должность и выберите подходящую из появившегося списка</p>
</div>
<div class="block-mt-blue">
<h2>Выберите способ рассылки</h2>
<div class="block-mt-green mailing-method">
<div class="mailing-method-block">
<div class="block-radio">
<label for="mailing-phone">
<input type="radio" id="mailing-phone" name="method-mail" hidden="" checked>
<div class="radio"></div>
Телефон
</label>
</div>
<div class="block-radio">
<label for="mailing-email">
<input type="radio" id="mailing-email" name="method-mail" hidden="">
<div class="radio"></div>
E-mail
</label>
</div>
</div>
</div>
</div>
<div class="block-mt-green mailing-method-option">
<div class="container-compressed mailing-method-option_selected" data-option="mailing-phone">
<label for="phone">Телефон</label>
<input type="text" name="phone" id="phone" placeholder="+7">
</div>
<div class="container-compressed" data-option="mailing-email">
<label for="email">E-mail</label>
<input type="text" name="email" id="email" placeholder="E-mail">
</div>
</div>
<div class="block-mt-green">
<input type="submit" class="main-button" name="submit-subscribe" id="submit-subscribe" value="Подписаться">
</div>
</form>
</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
webpack.config.js
View file @ d75400fa
......@@ -7,7 +7,7 @@ const webpack = require('webpack');
const isDev = process.env.NODE_ENV = 'development';
const pages = ['index', 'articles', 'faq', 'vacancies-list', 'current-article', 'main', 'service-rules', 'access-account', 'password-recovery', 'registration', 'companies-list',
'vacancies-map', 'companies-map', 'current-vacancy', 'current-company', '404', 'profile', 'profile-editing', 'my-resumes', 'favorites-vacancies-list',
'favorites-vacancies-map', 'response', 'current-response'];
'favorites-vacancies-map', 'response', 'response-resume', 'response-vacancy', 'response-vacancy-not-reg', 'subscription'];
const webpackConfig = {
context: path.resolve(__dirname, 'src'),
......
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