Skip to content

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

Pages mailing and steps is done

parent b3b45c67
Show whitespace changes
Inline Side-by-side
Showing with 2664 additions and 25 deletions
src/mailing.html 0 → 100644
View file @ 90bfec98
<!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">
<div href="#" class="choice-lang prompt">
RU
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">EN</a>
</div>
</div>
<div href="#" class="choice-city prompt">
Нижний Новгород
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">Казань</a>
<a href="#">Москва</a>
</div>
</div>
</div>
<div class="col-auto header-top-middle">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</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>
<div href="#" class="prompt help">
Помощь
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">Полезные статьи</a>
<a href="#">Часто задаваемые вопросы</a>
<a href="#">Как пользоваться сервисом</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="header-top-tablet">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-top-tablet__left">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</a>
</div>
<div class="col-auto header-top-tablet__middle">
<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>
</div>
<div class="col-auto header-top-tablet__right">
<a href="#" class="button-help">
<img src="./img/icon_button_help.svg" alt="">
</a>
</div>
</div>
</div>
</div>
<div class="header-mode-mobile">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</a>
</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" class="main-logo" alt="">
<img src="./img/logo_mobile.svg" class="mobile-logo" alt="">
</a>
<p>Быстрый поиск узкоквалифицированной работы</p>
</div>
<div class="col header-bottom-right">
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_search.svg" alt="">
<p>Найти<br> работника</p>
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
<p>Разместить<br> вакансию</p>
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success.svg" alt="">
<p>Доступ к базе</p>
</a>
<a href="#" class="button-text login hidden">
<img class="img-svg" src="./img/icon_enter.svg" alt="">
<p>Войти</p>
</a>
<div class="header-profile">
<a href="#" class="button-text profile">
<img class="img-svg" src="./img/icon_profile.svg" alt="">
<p>Иван Иванов</p>
</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 header-scroll-left">
<a href="#">
<img src="./img/logo_fixed.svg" alt="">
</a>
</div>
<div class="col-auto header-scroll-middle">
<div href="#" class="button-text choice-mode prompt">
Ищу работника
<img class="img-svg" src="./img/arrow_down_scroll.svg" alt="">
<div class="prompt__block">
<a href="#">Ищу работу</a>
</div>
</div>
</div>
<div class="col-7 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">
<img class="img-svg" src="./img/icon_search_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success_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="">
<p>Иван Иванов</p>
</a>
<a href="#" class="button-text logout">
<img class="img-svg" src="./img/icon_logout_scroll.svg" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="header-scroll-mobile">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-scroll-mobile-left">
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_search_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success_scroll.svg" alt="">
</a>
</div>
<div class="col-auto header-scroll-mobile-right">
<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="">
<p>Иван Иванов</p>
</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="menu menu-main">
<div class="menu-title">
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__help">
<p class="menu-content-block__title">Помощь</p>
<a href="#">Полезные статьи</a>
<a href="#">Часто задаваемые вопросы</a>
<a href="#">Как пользоваться сервисом</a>
</div>
<div class="menu-content-block menu-content-block__change">
<p class="menu-content-block__title">Язык</p>
<div class="menu-content-block__points">
<p>Русский</p>
<a href="#" class="button-text change-ref" data-change="lang">
Изменить
<img class="img-svg" src="./img/arrow_change.svg" alt="">
</a>
</div>
</div>
<div class="menu-content-block menu-content-block__change">
<p class="menu-content-block__title">Город</p>
<div class="menu-content-block__points">
<p>Нижний Новгород</p>
<a href="#" class="button-text change-ref" data-change="city">
Изменить
<img class="img-svg" src="./img/arrow_change.svg" alt="">
</a>
</div>
</div>
</div>
<div class="menu menu-submenu" data-change="lang">
<div class="menu-submenu-title">
<div class="menu-submenu-title__block">
<a href="#" class="back-menu">
<img class="img-svg" src="./img/arrow_back_change.svg" alt="">
</a>
<p>Язык</p>
</div>
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__values">
<a href="#">Русский</a>
<a href="#">Таджикский</a>
<a href="#">Узбекский</a>
</div>
</div>
</div>
<div class="menu menu-submenu" data-change="city">
<div class="menu-submenu-title">
<div class="menu-submenu-title__block">
<a href="#" class="back-menu">
<img class="img-svg" src="./img/arrow_back_change.svg" alt="">
</a>
<p>Город</p>
</div>
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__values">
<a href="#">Нижний Новгород</a>
<a href="#">Москва</a>
<a href="#">Казань</a>
</div>
</div>
</div>
</div>
<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">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить вакансию
</a>
<a href="#" class="button-text base-resume" data-count="6 дн.">
<img class="img-svg" src="./img/icon_base_success.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">
<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_mailing.svg" alt="">
Рассылка
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_order.svg" alt="">
Мои заказы
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_watch.svg" alt="">
История заказов
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_statistics.svg" alt="">
Статистика
</a>
</div>
</div>
<div class="col-9">
<button type="button" class="other-button button-account">
<img class="img-svg" src="./img/icon_burger.svg" alt="">
</button>
<div class="mailing">
<p>Наши пользователи уже оценили опцию «Рассылка вакансий». С ее помощью легко и удобно узнавать об обновлениях вакансий в интересующих вас сферах. Не обязательно несколько раз в день просматривать изменения на сайте — достаточно открыть письмо с рассылкой. Теперь удобнее стал шаблон составления подписки на рассылку и изменилось ее оформление!</p>
<div class="block-mt-dark-blue">
<form action="" name="mailing">
<div class="block-mb-blue">
<h2>Выберите вакансии для рассылки</h2>
<div class="row block-mt-green">
<div class="col-4">
<div class="block-checkbox">
<label for="vacancy1">
<input type="checkbox" id="vacancy1" name="vacancy" hidden="">
<div class="check"></div>
<p>Столяр-обивщик</p>
</label>
</div>
</div>
<div class="col-4">
<div class="block-checkbox">
<label for="vacancy2">
<input type="checkbox" id="vacancy2" name="vacancy" hidden="">
<div class="check"></div>
<p>Упаковщик</p>
</label>
</div>
</div>
<div class="col-4">
<div class="block-checkbox">
<label for="vacancy3">
<input type="checkbox" id="vacancy3" name="vacancy" hidden="">
<div class="check"></div>
<p>Помощник мастера</p>
</label>
</div>
</div>
<div class="col-4">
<div class="block-checkbox">
<label for="vacancy4">
<input type="checkbox" id="vacancy4" name="vacancy" hidden="">
<div class="check"></div>
<p>Мастер</p>
</label>
</div>
</div>
<div class="col-4">
<div class="block-checkbox">
<label for="vacancy5">
<input type="checkbox" id="vacancy5" name="vacancy" hidden="">
<div class="check"></div>
<p>Стикеровщик</p>
</label>
</div>
</div>
</div>
</div>
<div class="block-mb-blue">
<h2>Выберите регион</h2>
<div class="block-mt-green">
<div class="container-compressed">
<label for="region">Регион</label>
<select name="region" id="region">
<option value="region1">Московская область</option>
<option value="region2">Нижегородская область</option>
</select>
</div>
</div>
</div>
<div class="block-mb-blue">
<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>
<p>Разнорабочий</p>
</label>
</div>
<div class="block-checkbox">
<label for="loader">
<input type="checkbox" id="loader" name="loader" hidden="">
<div class="check"></div>
<p>Грузчик</p>
</label>
</div>
<div class="block-checkbox">
<label for="production-worker">
<input type="checkbox" id="production-worker" name="production-worker" hidden="">
<div class="check"></div>
<p>Рабочий на производство</p>
</label>
</div>
<div class="block-checkbox">
<label for="packer">
<input type="checkbox" id="packer" name="packer" hidden="">
<div class="check"></div>
<p>Фасовщик</p>
</label>
</div>
<div class="block-checkbox">
<label for="washer">
<input type="checkbox" id="washer" name="washer" hidden="">
<div class="check"></div>
<p>Мойщик</p>
</label>
</div>
<div class="block-checkbox">
<label for="сompositor">
<input type="checkbox" id="сompositor" name="сompositor" hidden="">
<div class="check"></div>
<p>Наборщик</p>
</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>
<p>Упаковщик</p>
</label>
</div>
<div class="block-checkbox">
<label for="sticker">
<input type="checkbox" id="sticker" name="sticker" hidden="">
<div class="check"></div>
<p>Стикеровщик</p>
</label>
</div>
<div class="block-checkbox">
<label for="cleaner">
<input type="checkbox" id="cleaner" name="cleaner" hidden="">
<div class="check"></div>
<p>Уборщик</p>
</label>
</div>
<div class="block-checkbox">
<label for="cashier">
<input type="checkbox" id="cashier" name="cashier" hidden="">
<div class="check"></div>
<p>Кассир</p>
</label>
</div>
<div class="block-checkbox">
<label for="merchandiser">
<input type="checkbox" id="merchandiser" name="merchandiser" hidden="">
<div class="check"></div>
<p>Мерчендайзер</p>
</label>
</div>
<div class="block-checkbox">
<label for="seller">
<input type="checkbox" id="seller" name="seller" hidden="">
<div class="check"></div>
<p>Продавец</p>
</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>
<p>Автомойщик</p>
</label>
</div>
<div class="block-checkbox">
<label for="gas-tanker">
<input type="checkbox" id="gas-tanker" name="gas-tanker" hidden="">
<div class="check"></div>
<p>Автозаправщик</p>
</label>
</div>
<div class="block-checkbox">
<label for="waiter">
<input type="checkbox" id="waiter" name="waiter" hidden="">
<div class="check"></div>
<p>Официант</p>
</label>
</div>
<div class="block-checkbox">
<label for="maid">
<input type="checkbox" id="maid" name="maid" hidden="">
<div class="check"></div>
<p>Горничная</p>
</label>
</div>
<div class="block-checkbox">
<label for="courier">
<input type="checkbox" id="courier" name="courier" hidden="">
<div class="check"></div>
<p>Курьер</p>
</label>
</div>
<div class="block-checkbox">
<label for="rush-job">
<input type="checkbox" id="rush-job" name="rush-job" hidden="">
<div class="check"></div>
<p>Срочная работа</p>
</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>
<div class="block-mb-green">
<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-mb-blue 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-mb-blue">
<h2>Выберите тариф</h2>
<div class="block-mt-green">
<div class="rates">
<div class="rates-header">
<div class="rates-header-row">
<div class="rates-header-row-block rates-opportunities-column"></div>
<div class="rates-header-row-block rates-name-column">
<p>Старт</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Стандарт</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Бизнес</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Профи</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Профи Плюс</p>
</div>
</div>
</div>
<div class="rates-content">
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Рассылка 100 соискателям</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Рассылка 300 соискателям</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Рассылка 500 соискателям</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Рассылка 1 000 соискателям</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Рассылка 2 000 соискателям</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Рассылка 5 000 соискателям</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row rates-content-row__price">
<div class="rates-content-row-block rates-price-column"></div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>1 000 руб.</p>
</div>
<div class="block-mt-orange">
<div class="old-price-value">
<p>1 400 руб.</p>
</div>
</div>
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>2 500 руб.</p>
</div>
<!-- <div class="old-price-value">
<p>1 400 руб.</p>
</div> -->
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>4 800 руб.</p>
</div>
<!-- <div class="old-price-value">
<p>1 400 руб.</p>
</div> -->
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>5 200 руб.</p>
</div>
<div class="block-mt-orange">
<div class="old-price-value">
<p>7 400 руб.</p>
</div>
</div>
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>7 000 руб.</p>
</div>
<!-- <div class="old-price-value">
<p>1 400 руб.</p>
</div> -->
</div>
</div>
<div class="rates-content-row rates-content-row__choice">
<div class="rates-content-row-block rates-choice-column"></div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-start">
<input type="radio" id="rate-start" name="rate" hidden="" checked>
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-standard">
<input type="radio" id="rate-standard" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-business">
<input type="radio" id="rate-business" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-pro">
<input type="radio" id="rate-pro" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-pro-plus">
<input type="radio" id="rate-pro-plus" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<input type="submit" name="send-out" id="send-out" value="Разослать" class="main-button">
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<footer class="footer">
<div class="container">
<div class="row justify-content-between">
<div class="col-3 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 class="wrapper-shadow"></div>
<div class="modal-form" id="modal-feedback">
<div class="close-modal">
<a href="#">
Закрыть
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-yellow">
<h2>Обратная связь</h2>
<div class="block-mt-blue">
<form action="" name="form-feedback" id="form-feedback" data-ajax="true">
<div class="block-mb-yellow">
<label for="name-feedback">Имя <span>*</span></label>
<input type="text" name="name-feedback" id="name-feedback" pattern="[^-\s0-9`~!@#№$%^&*()_=+\\|\[\]{};:',.<>\/?]+$" placeholder="ВАШЕ ИМЯ" data-required="true">
</div>
<div class="block-mb-yellow">
<label for="phone-feedback">Телефон <span>*</span></label>
<input type="text" name="phone-feedback" id="phone-feedback" pattern="^((8|\+7)[\- ]?)?(\(?\d{3}\)?[\- ]?)?[\d\- ]{7,10}$" placeholder="+7" data-required="true">
</div>
<div class="block-mb-yellow">
<label for="email-feedback">E-mail</label>
<input type="text" name="email-feedback" id="email-feedback" pattern="^([a-z0-9_-]+\.)*[a-z0-9_-]+@[a-z0-9_-]+(\.[a-z0-9_-]+)*\.[a-z]{2,6}$" placeholder="E-MAIL">
</div>
<div class="block-mb-green">
<label for="message-feedback">Сообщение <span>*</span></label>
<textarea name="message-feedback" id="message-feedback" data-required="true"></textarea>
</div>
<p class="block-mb-green" style="font-size: 14px;"><span>*</span> - поля, обязательные для заполнения</p>
<p class="block-mb-green" style="font-size: 14px;">Нажимая кнопку «Отправить», Вы даёте своё согласие на обработку персональных данных</p>
<div class="wrapper-button-center">
<input type="submit" class="main-button" id="submit-feedback" name="submit-feedback" value="Отправить">
</div>
</form>
</div>
</div>
</div>
<div class="modal-form successful-sending">
<div class="close-modal">
<a href="#">
Закрыть
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-yellow">
<h2>Спасибо за обращение!</h2>
<p class="block-mt-blue">Наш менеджер свяжется с Вами в ближайшее время.</p>
</div>
</div>
<div class="modal-form modal-form__account" id="modal-account">
<div class="close-modal">
<a href="#">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-orange">
<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">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить вакансию
</a>
<a href="#" class="button-text base-resume" data-count="6 дн.">
<img class="img-svg" src="./img/icon_base_success.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">
<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_mailing.svg" alt="">
Рассылка
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_order.svg" alt="">
Мои заказы
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_watch.svg" alt="">
История заказов
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_statistics.svg" alt="">
Статистика
</a>
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
src/main.html
View file @ 90bfec98
...@@ -450,6 +450,12 @@ ...@@ -450,6 +450,12 @@
<li> <li>
<a href="post-vacancy-step4.html">Разместить вакансию - Шаг 4</a> <a href="post-vacancy-step4.html">Разместить вакансию - Шаг 4</a>
</li> </li>
<li>
<a href="post-vacancy-step5.html">Разместить вакансию - Шаг 5</a>
</li>
<li>
<a href="mailing.html">Рассылка</a>
</li>
</ul> </ul>
</div> </div>
</div> </div>
......
src/post-resume-step1.html
View file @ 90bfec98
...@@ -386,7 +386,7 @@ ...@@ -386,7 +386,7 @@
<p class="block-mb-blue" style="font-size: 14px;">Нажимая кнопку «Далее», Вы даёте своё согласие на обработку персональных данных</p> <p class="block-mb-blue" style="font-size: 14px;">Нажимая кнопку «Далее», Вы даёте своё согласие на обработку персональных данных</p>
<div class="transfer-steps"> <div class="transfer-steps">
<!-- <button type="button" class="other-button disabled" id="prev-step-resume">Назад</button> --> <!-- <button type="button" class="other-button disabled" id="prev-step-resume">Назад</button> -->
<button type="button" class="main-button" id="next-step">Далее</button> <a href="#" class="main-button" id="next-step">Далее</a>
</div> </div>
</div> </div>
</form> </form>
......
src/post-resume-step2.html
View file @ 90bfec98
...@@ -666,8 +666,8 @@ ...@@ -666,8 +666,8 @@
</div> </div>
</form> </form>
<div class="transfer-steps"> <div class="transfer-steps">
<button type="button" class="other-button" id="prev-step">Назад</button> <a href="#" class="other-button" id="prev-step">Назад</a>
<button type="button" class="main-button" id="next-step">Далее</button> <a href="#" class="main-button" id="next-step">Далее</a>
</div> </div>
</div> </div>
</div> </div>
......
src/post-resume-step3.html
View file @ 90bfec98
...@@ -391,8 +391,8 @@ ...@@ -391,8 +391,8 @@
</a> </a>
</div> </div>
<div class="transfer-steps block-mt-blue"> <div class="transfer-steps block-mt-blue">
<button type="button" class="other-button" id="prev-step">Назад</button> <a href="#" class="other-button" id="prev-step">Назад</a>
<button type="button" class="main-button" id="next-step">Далее</button> <a href="#" class="main-button" id="next-step">Далее</a>
</div> </div>
</div> </div>
</div> </div>
......
src/post-vacancy-step1.html
View file @ 90bfec98
...@@ -401,7 +401,7 @@ ...@@ -401,7 +401,7 @@
<p class="block-mt-green" style="font-size: 14px;">Нажимая кнопку «Далее», Вы даёте своё согласие на обработку персональных данных</p> <p class="block-mt-green" style="font-size: 14px;">Нажимая кнопку «Далее», Вы даёте своё согласие на обработку персональных данных</p>
<div class="transfer-steps block-mt-blue"> <div class="transfer-steps block-mt-blue">
<!-- <button type="button" class="other-button disabled" id="prev-step-resume">Назад</button> --> <!-- <button type="button" class="other-button disabled" id="prev-step-resume">Назад</button> -->
<button type="button" class="main-button" id="next-step">Далее</button> <a href="#" class="main-button" id="next-step">Далее</a>
</div> </div>
</div> </div>
</form> </form>
......
src/post-vacancy-step2.html
View file @ 90bfec98
...@@ -661,8 +661,8 @@ ...@@ -661,8 +661,8 @@
</div> </div>
</div> </div>
<div class="transfer-steps"> <div class="transfer-steps">
<button type="button" class="other-button" id="prev-step">Назад</button> <a href="#" class="other-button" id="prev-step">Назад</a>
<button type="button" class="main-button" id="next-step">Далее</button> <a href="#" class="main-button" id="next-step">Далее</a>
</div> </div>
</div> </div>
</form> </form>
......
src/post-vacancy-step3.html
View file @ 90bfec98
...@@ -346,7 +346,7 @@ ...@@ -346,7 +346,7 @@
<a href="#" class="steps-post__step steps-post__step_disabled">Шаг 4. Моя вакансия</a> <a href="#" class="steps-post__step steps-post__step_disabled">Шаг 4. Моя вакансия</a>
</div> </div>
<div class="block-mt-blue"> <div class="block-mt-blue">
<form action="" name="post-vacancy-step2" id="post-vacancy-step2"> <form action="" name="post-vacancy-step3" id="post-vacancy-step3">
<div class="container-compressed"> <div class="container-compressed">
<div class="block-mb-green"> <div class="block-mb-green">
<div class="block-post"> <div class="block-post">
...@@ -461,18 +461,55 @@ ...@@ -461,18 +461,55 @@
</div> </div>
</div> </div>
</div> </div>
<!-- <div class="block-mb-green"> <div class="block-mb-blue">
<div class="block-post">
</div> --> <div class="row">
<div class="col-4">
<div class="block-post__name">
<p>Дополнительные требования:</p>
</div>
</div>
<div class="col-8">
<div class="row">
<div class="col-12">
<div class="block-checkbox">
<label for="no-criminal">
<input type="checkbox" id="no-criminal" name="additional-requirements" hidden="">
<div class="check"></div>
<p>Отсутствие судимостей</p>
</label>
</div>
</div>
<div class="col-12">
<div class="block-checkbox">
<label for="no-contraindication">
<input type="checkbox" id="no-contraindications" name="additional-requirements" hidden="">
<div class="check"></div>
<p>Отсутствие медицинских противопоказаний для осуществления физического труда</p>
</label>
</div>
</div>
<div class="col-12">
<div class="block-checkbox">
<label for="up-to-year">
<input type="checkbox" id="up-to-year" name="additional-requirements" hidden="">
<div class="check"></div>
<p>До 1 года</p>
</label>
</div>
</div>
<div class="col-12">
<label for="other-requirements">Другое</label>
<textarea name="other-requirements" id="other-requirements" style="height: 88px;"></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="transfer-steps"> <div class="transfer-steps">
<button type="button" class="other-button" id="prev-step">Назад</button> <a href="#" class="other-button" id="prev-step">Назад</a>
<button type="button" class="main-button" id="next-step">Далее</button> <a href="#" class="main-button" id="next-step">Далее</a>
</div> </div>
</div> </div>
</form> </form>
......
src/post-vacancy-step4.html
View file @ 90bfec98
<!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">
<div href="#" class="choice-lang prompt">
RU
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">EN</a>
</div>
</div>
<div href="#" class="choice-city prompt">
Нижний Новгород
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">Казань</a>
<a href="#">Москва</a>
</div>
</div>
</div>
<div class="col-auto header-top-middle">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</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>
<div href="#" class="prompt help">
Помощь
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">Полезные статьи</a>
<a href="#">Часто задаваемые вопросы</a>
<a href="#">Как пользоваться сервисом</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="header-top-tablet">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-top-tablet__left">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</a>
</div>
<div class="col-auto header-top-tablet__middle">
<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>
</div>
<div class="col-auto header-top-tablet__right">
<a href="#" class="button-help">
<img src="./img/icon_button_help.svg" alt="">
</a>
</div>
</div>
</div>
</div>
<div class="header-mode-mobile">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</a>
</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" class="main-logo" alt="">
<img src="./img/logo_mobile.svg" class="mobile-logo" alt="">
</a>
<p>Быстрый поиск узкоквалифицированной работы</p>
</div>
<div class="col header-bottom-right">
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_search.svg" alt="">
<p>Найти<br> работника</p>
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
<p>Разместить<br> вакансию</p>
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success.svg" alt="">
<p>Доступ к базе</p>
</a>
<a href="#" class="button-text login hidden">
<img class="img-svg" src="./img/icon_enter.svg" alt="">
<p>Войти</p>
</a>
<div class="header-profile">
<a href="#" class="button-text profile">
<img class="img-svg" src="./img/icon_profile.svg" alt="">
<p>Иван Иванов</p>
</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 header-scroll-left">
<a href="#">
<img src="./img/logo_fixed.svg" alt="">
</a>
</div>
<div class="col-auto header-scroll-middle">
<div href="#" class="button-text choice-mode prompt">
Ищу работника
<img class="img-svg" src="./img/arrow_down_scroll.svg" alt="">
<div class="prompt__block">
<a href="#">Ищу работу</a>
</div>
</div>
</div>
<div class="col-7 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">
<img class="img-svg" src="./img/icon_search_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success_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="">
<p>Иван Иванов</p>
</a>
<a href="#" class="button-text logout">
<img class="img-svg" src="./img/icon_logout_scroll.svg" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="header-scroll-mobile">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-scroll-mobile-left">
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_search_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success_scroll.svg" alt="">
</a>
</div>
<div class="col-auto header-scroll-mobile-right">
<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="">
<p>Иван Иванов</p>
</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="menu menu-main">
<div class="menu-title">
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__help">
<p class="menu-content-block__title">Помощь</p>
<a href="#">Полезные статьи</a>
<a href="#">Часто задаваемые вопросы</a>
<a href="#">Как пользоваться сервисом</a>
</div>
<div class="menu-content-block menu-content-block__change">
<p class="menu-content-block__title">Язык</p>
<div class="menu-content-block__points">
<p>Русский</p>
<a href="#" class="button-text change-ref" data-change="lang">
Изменить
<img class="img-svg" src="./img/arrow_change.svg" alt="">
</a>
</div>
</div>
<div class="menu-content-block menu-content-block__change">
<p class="menu-content-block__title">Город</p>
<div class="menu-content-block__points">
<p>Нижний Новгород</p>
<a href="#" class="button-text change-ref" data-change="city">
Изменить
<img class="img-svg" src="./img/arrow_change.svg" alt="">
</a>
</div>
</div>
</div>
<div class="menu menu-submenu" data-change="lang">
<div class="menu-submenu-title">
<div class="menu-submenu-title__block">
<a href="#" class="back-menu">
<img class="img-svg" src="./img/arrow_back_change.svg" alt="">
</a>
<p>Язык</p>
</div>
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__values">
<a href="#">Русский</a>
<a href="#">Таджикский</a>
<a href="#">Узбекский</a>
</div>
</div>
</div>
<div class="menu menu-submenu" data-change="city">
<div class="menu-submenu-title">
<div class="menu-submenu-title__block">
<a href="#" class="back-menu">
<img class="img-svg" src="./img/arrow_back_change.svg" alt="">
</a>
<p>Город</p>
</div>
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__values">
<a href="#">Нижний Новгород</a>
<a href="#">Москва</a>
<a href="#">Казань</a>
</div>
</div>
</div>
</div>
<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 current-ref">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить вакансию
</a>
<a href="#" class="button-text base-resume" data-count="6 дн.">
<img class="img-svg" src="./img/icon_base_success.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">
<img class="img-svg" src="./img/icon_favorites.svg" alt="">
Избранное
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_mailing.svg" alt="">
Рассылка
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_order.svg" alt="">
Мои заказы
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_watch.svg" alt="">
История заказов
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_statistics.svg" alt="">
Статистика
</a>
</div>
</div>
<div class="col-9">
<button type="button" class="other-button button-account">
<img class="img-svg" src="./img/icon_burger.svg" alt="">
</button>
<div class="post">
<p>Основная цель резюме – выделить тебя на фоне других соискателей, привлечь внимание работодателя и, в конечном итоге, пригласить тебя на собеседование. А это сделать очень непросто. Представь себе на минуту тот факт, что почтовый ящик твоего потенциального работодателя засыпают десятками и даже сотнями (зависит от размера компании) резюме в день. И на просмотр твоего резюме он потратит максимум 30 секунд – и в течение этого маленького времени решится твоя дальнейшая судьба и дается ответ на главный вопрос работодателя: подходит ли мне этот сотрудник?</p>
<div class="block-mt-blue">
<div class="steps-post">
<a href="#" class="steps-post__step">Шаг 3. Требования к кандидату</a>
<div class="steps-post__arrow steps-post__arrow_passed">
<img class="img-svg" src="./img/arrow_step.svg" alt="">
</div>
<a href="#" class="steps-post__step steps-post__step_current">Шаг 4. Моя вакансия</a>
<div class="steps-post__arrow">
<img class="img-svg" src="./img/arrow_step.svg" alt="">
</div>
<a href="#" class="steps-post__step steps-post__step_disabled">Шаг 5. Выбор тарифа</a>
</div>
<div class="block-mt-blue">
<h2>Помощник мастера</h2>
<div class="brief-information block-mb-blue block-mt-blue">
<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>
<div class="brief-information-block__contacts">
<p class="brief-information-block__name">
<img src="./img/icon_profile.svg" alt="">
Петров Василий Иванович
</p>
<a href="mailto:chapai@gmail.ru" class="brief-information-block__email">
<img src="./img/icon_mail.svg" alt="">
chapai@gmail.ru
</a>
<a href="tel:79876543210" class="brief-information-block__phone">
<img src="./img/icon_phone.svg" alt="">
+79876543210
</a>
</div>
</div>
</div>
</div>
<div class="detailed-description block-mb-blue">
<h2>Основные данные</h2>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Предполагаемый доход:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>30 000 руб.</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Адрес:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>г. Нижний Новгород, ул. Ивана Романова, д. 2</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Описание:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>Текст о компании – это краткая презентация фирмы. Он рассказывает, чем занимается компания, какие у нее достижения, чем она отличается от конкурентов, как фирма появилась и развивалась. Цель текста о компании – сформировать у читателей доверие к фирме. Когда человек находит сайт компании в интернете, он не может заглянуть в ее офис, лично поговорить с менеджерами. Он не знает, есть ли за яркой вывеской в виде сайта реальная компания. А если и есть, то не обманут ли его? Возможно, компания появилась вчера и завтра закроется? Текст о компании должен развеять сомнения клиента и показать, что фирма надежная, и с ней можно работать. В данном мастер-классе мы расскажем, как правильно написать текст о компании для сайта.</p>
</div>
</div>
</div>
</div>
</div>
<div class="detailed-description block-mb-blue">
<h2>Условия работы</h2>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Тип занятости:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>Полный день, гибкий график</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>График работы:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>Полная занятость, временная работа, частичная занятость</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Авансирование:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>Да</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Проживание:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>Не предоставляется</p>
</div>
</div>
</div>
</div>
</div>
<div class="detailed-description block-mb-blue">
<h2>Требования к кандидату</h2>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Возраст:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>от 20 до 45 лет</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Стаж работы:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>1-3 года</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Отсутствие судимостей:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>Да</p>
</div>
</div>
</div>
</div>
<div class="detailed-description-block">
<div class="row">
<div class="col-3">
<div class="detailed-description-block__name">
<p>Наличие медкнижки:</p>
</div>
</div>
<div class="col-9">
<div class="detailed-description-block__text">
<p>Да</p>
</div>
</div>
</div>
</div>
</div>
<div class="wrapper-map block-mb-blue">
<iframe src="https://yandex.ru/map-widget/v1/?um=constructor%3A805e8a92d74677c7d0faadbbe38c16ccd54442663acf6a9591c2c8ce6d3b9c9e&amp;source=constructor" width="100%" height="100%" frameborder="0"></iframe>
</div>
<div class="transfer-steps">
<div class="transfer-steps__left">
<a href="#" class="other-button" id="back-to-edit">Вернуться к редактированию</a>
<a href="#" class="other-button" id="save">Сохранить</a>
</div>
<div class="transfer-steps__right">
<a href="#" class="main-button" id="choose-rate">Выбрать тариф</a>
</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-3 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 class="wrapper-shadow"></div>
<div class="modal-form" id="modal-feedback">
<div class="close-modal">
<a href="#">
Закрыть
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-yellow">
<h2>Обратная связь</h2>
<div class="block-mt-blue">
<form action="" name="form-feedback" id="form-feedback" data-ajax="true">
<div class="block-mb-yellow">
<label for="name-feedback">Имя <span>*</span></label>
<input type="text" name="name-feedback" id="name-feedback" pattern="[^-\s0-9`~!@#№$%^&*()_=+\\|\[\]{};:',.<>\/?]+$" placeholder="ВАШЕ ИМЯ" data-required="true">
</div>
<div class="block-mb-yellow">
<label for="phone-feedback">Телефон <span>*</span></label>
<input type="text" name="phone-feedback" id="phone-feedback" pattern="^((8|\+7)[\- ]?)?(\(?\d{3}\)?[\- ]?)?[\d\- ]{7,10}$" placeholder="+7" data-required="true">
</div>
<div class="block-mb-yellow">
<label for="email-feedback">E-mail</label>
<input type="text" name="email-feedback" id="email-feedback" pattern="^([a-z0-9_-]+\.)*[a-z0-9_-]+@[a-z0-9_-]+(\.[a-z0-9_-]+)*\.[a-z]{2,6}$" placeholder="E-MAIL">
</div>
<div class="block-mb-green">
<label for="message-feedback">Сообщение <span>*</span></label>
<textarea name="message-feedback" id="message-feedback" data-required="true"></textarea>
</div>
<p class="block-mb-green" style="font-size: 14px;"><span>*</span> - поля, обязательные для заполнения</p>
<p class="block-mb-green" style="font-size: 14px;">Нажимая кнопку «Отправить», Вы даёте своё согласие на обработку персональных данных</p>
<div class="wrapper-button-center">
<input type="submit" class="main-button" id="submit-feedback" name="submit-feedback" value="Отправить">
</div>
</form>
</div>
</div>
</div>
<div class="modal-form successful-sending">
<div class="close-modal">
<a href="#">
Закрыть
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-yellow">
<h2>Спасибо за обращение!</h2>
<p class="block-mt-blue">Наш менеджер свяжется с Вами в ближайшее время.</p>
</div>
</div>
<div class="modal-form modal-form__account" id="modal-account">
<div class="close-modal">
<a href="#">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-orange">
<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 current-ref">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить вакансию
</a>
<a href="#" class="button-text base-resume" data-count="6 дн.">
<img class="img-svg" src="./img/icon_base_success.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">
<img class="img-svg" src="./img/icon_favorites.svg" alt="">
Избранное
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_mailing.svg" alt="">
Рассылка
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_order.svg" alt="">
Мои заказы
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_watch.svg" alt="">
История заказов
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_statistics.svg" alt="">
Статистика
</a>
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
src/post-vacancy-step5.html
View file @ 90bfec98
<!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">
<div href="#" class="choice-lang prompt">
RU
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">EN</a>
</div>
</div>
<div href="#" class="choice-city prompt">
Нижний Новгород
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">Казань</a>
<a href="#">Москва</a>
</div>
</div>
</div>
<div class="col-auto header-top-middle">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</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>
<div href="#" class="prompt help">
Помощь
<img class="img-svg" src="./img/arrow_down.svg" alt="">
<div class="prompt__block">
<a href="#">Полезные статьи</a>
<a href="#">Часто задаваемые вопросы</a>
<a href="#">Как пользоваться сервисом</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="header-top-tablet">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-top-tablet__left">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</a>
</div>
<div class="col-auto header-top-tablet__middle">
<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>
</div>
<div class="col-auto header-top-tablet__right">
<a href="#" class="button-help">
<img src="./img/icon_button_help.svg" alt="">
</a>
</div>
</div>
</div>
</div>
<div class="header-mode-mobile">
<a href="#" class="choice-mode">Ищу работу</a>
<a href="#" class="choice-mode choice-mode_active">Ищу работника</a>
</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" class="main-logo" alt="">
<img src="./img/logo_mobile.svg" class="mobile-logo" alt="">
</a>
<p>Быстрый поиск узкоквалифицированной работы</p>
</div>
<div class="col header-bottom-right">
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_search.svg" alt="">
<p>Найти<br> работника</p>
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
<p>Разместить<br> вакансию</p>
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success.svg" alt="">
<p>Доступ к базе</p>
</a>
<a href="#" class="button-text login hidden">
<img class="img-svg" src="./img/icon_enter.svg" alt="">
<p>Войти</p>
</a>
<div class="header-profile">
<a href="#" class="button-text profile">
<img class="img-svg" src="./img/icon_profile.svg" alt="">
<p>Иван Иванов</p>
</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 header-scroll-left">
<a href="#">
<img src="./img/logo_fixed.svg" alt="">
</a>
</div>
<div class="col-auto header-scroll-middle">
<div href="#" class="button-text choice-mode prompt">
Ищу работника
<img class="img-svg" src="./img/arrow_down_scroll.svg" alt="">
<div class="prompt__block">
<a href="#">Ищу работу</a>
</div>
</div>
</div>
<div class="col-7 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">
<img class="img-svg" src="./img/icon_search_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success_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="">
<p>Иван Иванов</p>
</a>
<a href="#" class="button-text logout">
<img class="img-svg" src="./img/icon_logout_scroll.svg" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="header-scroll-mobile">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-auto header-scroll-mobile-left">
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_search_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_resume_scroll.svg" alt="">
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_base_success_scroll.svg" alt="">
</a>
</div>
<div class="col-auto header-scroll-mobile-right">
<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="">
<p>Иван Иванов</p>
</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="menu menu-main">
<div class="menu-title">
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__help">
<p class="menu-content-block__title">Помощь</p>
<a href="#">Полезные статьи</a>
<a href="#">Часто задаваемые вопросы</a>
<a href="#">Как пользоваться сервисом</a>
</div>
<div class="menu-content-block menu-content-block__change">
<p class="menu-content-block__title">Язык</p>
<div class="menu-content-block__points">
<p>Русский</p>
<a href="#" class="button-text change-ref" data-change="lang">
Изменить
<img class="img-svg" src="./img/arrow_change.svg" alt="">
</a>
</div>
</div>
<div class="menu-content-block menu-content-block__change">
<p class="menu-content-block__title">Город</p>
<div class="menu-content-block__points">
<p>Нижний Новгород</p>
<a href="#" class="button-text change-ref" data-change="city">
Изменить
<img class="img-svg" src="./img/arrow_change.svg" alt="">
</a>
</div>
</div>
</div>
<div class="menu menu-submenu" data-change="lang">
<div class="menu-submenu-title">
<div class="menu-submenu-title__block">
<a href="#" class="back-menu">
<img class="img-svg" src="./img/arrow_back_change.svg" alt="">
</a>
<p>Язык</p>
</div>
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__values">
<a href="#">Русский</a>
<a href="#">Таджикский</a>
<a href="#">Узбекский</a>
</div>
</div>
</div>
<div class="menu menu-submenu" data-change="city">
<div class="menu-submenu-title">
<div class="menu-submenu-title__block">
<a href="#" class="back-menu">
<img class="img-svg" src="./img/arrow_back_change.svg" alt="">
</a>
<p>Город</p>
</div>
<a href="#" class="menu__close">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="menu-content">
<div class="menu-content-block menu-content-block__values">
<a href="#">Нижний Новгород</a>
<a href="#">Москва</a>
<a href="#">Казань</a>
</div>
</div>
</div>
</div>
<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 current-ref">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить вакансию
</a>
<a href="#" class="button-text base-resume" data-count="6 дн.">
<img class="img-svg" src="./img/icon_base_success.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">
<img class="img-svg" src="./img/icon_favorites.svg" alt="">
Избранное
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_mailing.svg" alt="">
Рассылка
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_order.svg" alt="">
Мои заказы
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_watch.svg" alt="">
История заказов
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_statistics.svg" alt="">
Статистика
</a>
</div>
</div>
<div class="col-9">
<button type="button" class="other-button button-account">
<img class="img-svg" src="./img/icon_burger.svg" alt="">
</button>
<div class="post">
<p>Основная цель резюме – выделить тебя на фоне других соискателей, привлечь внимание работодателя и, в конечном итоге, пригласить тебя на собеседование. А это сделать очень непросто. Представь себе на минуту тот факт, что почтовый ящик твоего потенциального работодателя засыпают десятками и даже сотнями (зависит от размера компании) резюме в день. И на просмотр твоего резюме он потратит максимум 30 секунд – и в течение этого маленького времени решится твоя дальнейшая судьба и дается ответ на главный вопрос работодателя: подходит ли мне этот сотрудник?</p>
<div class="block-mt-blue">
<div class="steps-post">
<a href="#" class="steps-post__step">Шаг 3. Требования к кандидату</a>
<div class="steps-post__arrow steps-post__arrow_passed">
<img class="img-svg" src="./img/arrow_step.svg" alt="">
</div>
<a href="#" class="steps-post__step">Шаг 4. Моя вакансия</a>
<div class="steps-post__arrow steps-post__arrow_passed">
<img class="img-svg" src="./img/arrow_step.svg" alt="">
</div>
<a href="#" class="steps-post__step steps-post__step_current">Шаг 5. Выбор тарифа</a>
</div>
<div class="block-mt-blue">
<div class="block-mb-blue">
<form action="" name="post-vacancy-step5" id="post-vacancy-step5">
<div class="rates">
<div class="rates-header">
<div class="rates-header-row">
<div class="rates-header-row-block rates-opportunities-column"></div>
<div class="rates-header-row-block rates-name-column">
<p>Старт</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Стандарт</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Бизнес</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Профи</p>
</div>
<div class="rates-header-row-block rates-name-column">
<p>Профи Плюс</p>
</div>
</div>
</div>
<div class="rates-content">
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Размещение 30 дней</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Выделение вакансии</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Поднятие вакансии</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Выделение вакансии</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Размещение 30 дней</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row">
<div class="rates-content-row-block rates-opportunities-column">
<p>Выделение вакансии</p>
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_unavailable">
<img src="./img/icon_list_close.svg" alt="">
</div>
<div class="rates-content-row-block rates-name-column rates-name-column_available">
<img src="./img/icon_list_open.svg" alt="">
</div>
</div>
<div class="rates-content-row rates-content-row__price">
<div class="rates-content-row-block rates-price-column"></div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>1 000 руб.</p>
</div>
<div class="block-mt-orange">
<div class="old-price-value">
<p>1 400 руб.</p>
</div>
</div>
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>2 500 руб.</p>
</div>
<!-- <div class="old-price-value">
<p>1 400 руб.</p>
</div> -->
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>4 800 руб.</p>
</div>
<!-- <div class="old-price-value">
<p>1 400 руб.</p>
</div> -->
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>5 200 руб.</p>
</div>
<div class="block-mt-orange">
<div class="old-price-value">
<p>7 400 руб.</p>
</div>
</div>
</div>
<div class="rates-content-row-block rates-price-value-column">
<div class="current-price-value">
<p>7 000 руб.</p>
</div>
<!-- <div class="old-price-value">
<p>1 400 руб.</p>
</div> -->
</div>
</div>
<div class="rates-content-row rates-content-row__choice">
<div class="rates-content-row-block rates-choice-column"></div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-start">
<input type="radio" id="rate-start" name="rate" hidden="" checked>
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-standard">
<input type="radio" id="rate-standard" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-business">
<input type="radio" id="rate-business" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-pro">
<input type="radio" id="rate-pro" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
<div class="rates-content-row-block rates-choice-value-column">
<div class="block-radio">
<label for="rate-pro-plus">
<input type="radio" id="rate-pro-plus" name="rate" hidden="">
<div class="radio"></div>
</label>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<div class="transfer-steps">
<a href="#" class="other-button" id="back">Назад</a>
<a href="#" class="main-button" id="pay">Оплатить</a>
</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-3 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 class="wrapper-shadow"></div>
<div class="modal-form" id="modal-feedback">
<div class="close-modal">
<a href="#">
Закрыть
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-yellow">
<h2>Обратная связь</h2>
<div class="block-mt-blue">
<form action="" name="form-feedback" id="form-feedback" data-ajax="true">
<div class="block-mb-yellow">
<label for="name-feedback">Имя <span>*</span></label>
<input type="text" name="name-feedback" id="name-feedback" pattern="[^-\s0-9`~!@#№$%^&*()_=+\\|\[\]{};:',.<>\/?]+$" placeholder="ВАШЕ ИМЯ" data-required="true">
</div>
<div class="block-mb-yellow">
<label for="phone-feedback">Телефон <span>*</span></label>
<input type="text" name="phone-feedback" id="phone-feedback" pattern="^((8|\+7)[\- ]?)?(\(?\d{3}\)?[\- ]?)?[\d\- ]{7,10}$" placeholder="+7" data-required="true">
</div>
<div class="block-mb-yellow">
<label for="email-feedback">E-mail</label>
<input type="text" name="email-feedback" id="email-feedback" pattern="^([a-z0-9_-]+\.)*[a-z0-9_-]+@[a-z0-9_-]+(\.[a-z0-9_-]+)*\.[a-z]{2,6}$" placeholder="E-MAIL">
</div>
<div class="block-mb-green">
<label for="message-feedback">Сообщение <span>*</span></label>
<textarea name="message-feedback" id="message-feedback" data-required="true"></textarea>
</div>
<p class="block-mb-green" style="font-size: 14px;"><span>*</span> - поля, обязательные для заполнения</p>
<p class="block-mb-green" style="font-size: 14px;">Нажимая кнопку «Отправить», Вы даёте своё согласие на обработку персональных данных</p>
<div class="wrapper-button-center">
<input type="submit" class="main-button" id="submit-feedback" name="submit-feedback" value="Отправить">
</div>
</form>
</div>
</div>
</div>
<div class="modal-form successful-sending">
<div class="close-modal">
<a href="#">
Закрыть
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-yellow">
<h2>Спасибо за обращение!</h2>
<p class="block-mt-blue">Наш менеджер свяжется с Вами в ближайшее время.</p>
</div>
</div>
<div class="modal-form modal-form__account" id="modal-account">
<div class="close-modal">
<a href="#">
<img class="img-svg" src="./img/icon_close_modal.svg" alt="">
</a>
</div>
<div class="modal-form-content block-mt-orange">
<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 current-ref">
<img class="img-svg" src="./img/icon_resume.svg" alt="">
Разместить вакансию
</a>
<a href="#" class="button-text base-resume" data-count="6 дн.">
<img class="img-svg" src="./img/icon_base_success.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">
<img class="img-svg" src="./img/icon_favorites.svg" alt="">
Избранное
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_mailing.svg" alt="">
Рассылка
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_order.svg" alt="">
Мои заказы
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_watch.svg" alt="">
История заказов
</a>
<a href="#" class="button-text">
<img class="img-svg" src="./img/icon_statistics.svg" alt="">
Статистика
</a>
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
src/scss/_media.scss
View file @ 90bfec98
...@@ -180,12 +180,12 @@ ...@@ -180,12 +180,12 @@
{ {
display: none; display: none;
} }
.subscription form .other-position .button-text .subscription form .other-position .button-text, .mailing form .other-position .button-text
{ {
margin-left: 0; margin-left: 0;
margin-top: 17px; margin-top: 17px;
} }
.subscription form .other-position .subscription form .other-position, .mailing form .other-position
{ {
flex-direction: column; flex-direction: column;
} }
......
src/scss/style.scss
View file @ 90bfec98
...@@ -4762,7 +4762,7 @@ input[type="submit"] ...@@ -4762,7 +4762,7 @@ input[type="submit"]
// Страница Подписка // Страница Подписка
.subscription .subscription, .mailing
{ {
form form
{ {
...@@ -4771,6 +4771,14 @@ input[type="submit"] ...@@ -4771,6 +4771,14 @@ input[type="submit"]
margin-top: 0; margin-top: 0;
margin-bottom: 22px; margin-bottom: 22px;
} }
.col-4 .block-checkbox:last-child
{
margin-bottom: 0;
}
.col-4 .block-checkbox:first-child
{
margin-bottom: 22px;
}
.other-position .other-position
{ {
display: flex; display: flex;
...@@ -4878,6 +4886,20 @@ input[type="submit"] ...@@ -4878,6 +4886,20 @@ input[type="submit"]
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
&__left
{
display: flex;
align-items: center;
a:nth-child(2)
{
margin-left: 20px;
}
}
&__right
{
display: flex;
align-items: center;
}
.disabled .disabled
{ {
opacity: 0; opacity: 0;
...@@ -5597,6 +5619,119 @@ hr ...@@ -5597,6 +5619,119 @@ hr
margin: 0; margin: 0;
} }
// Таблица Тарифы
.rates
{
background-color: #fff;
border-top: 4px solid #dddce8;
box-shadow: 0 10px 20px 0 rgba(15,20,91,.1);
&-header
{
padding: 22px 20px;
&-row
{
display: flex;
justify-content: space-between;
align-items: center;
&-block
{
p
{
font-family: Raleway Bold;
font-size: 14px;
font-stretch: normal;
font-style: normal;
line-height: 1;
letter-spacing: normal;
color: $color-primary;
}
}
}
}
&-content
{
&-row
{
padding: 22px 20px;
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #dddce8;
}
&-row__price
{
align-items: flex-start;
}
}
&-opportunities-column, &-choice-column, &-price-column
{
display: flex;
justify-content: flex-start;
align-items: center;
width: 30%;
}
&-name-column, &-choice-value-column
{
display: flex;
justify-content: center;
align-items: center;
width: 14%;
}
&-price-value-column
{
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
width: 14%;
.current-price-value
{
p
{
font-family: Montserrat Bold;
font-size: 16px;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: $color-primary;
}
}
.old-price-value
{
p
{
font-family: Montserrat Regular;
font-size: 16px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
color: $color-disabled;
position: relative;
}
p:before
{
content: "";
position: absolute;
width: 100%;
height: 2px;
background-color: #eb5757;
top: 8px;
left: 0;
right: 0;
}
}
}
label
{
margin: 0;
}
}
// Футер // Футер
......
src/subscription.html
View file @ 90bfec98
...@@ -396,7 +396,7 @@ ...@@ -396,7 +396,7 @@
<label for="seller"> <label for="seller">
<input type="checkbox" id="seller" name="seller" hidden=""> <input type="checkbox" id="seller" name="seller" hidden="">
<div class="check"></div> <div class="check"></div>
<p>Не требуется</p> <p>Продавец</p>
</label> </label>
</div> </div>
</div> </div>
......
webpack.config.js
View file @ 90bfec98
...@@ -12,7 +12,7 @@ const pages = ['index', 'articles', 'faq', 'vacancies-list', 'current-article', ...@@ -12,7 +12,7 @@ const pages = ['index', 'articles', 'faq', 'vacancies-list', 'current-article',
'current-article-employer', 'service-rules-employer', 'access-account-employer', 'tariffs', 'password-recovery-employer', 'registration-employer', 'current-article-employer', 'service-rules-employer', 'access-account-employer', 'tariffs', 'password-recovery-employer', 'registration-employer',
'resumes-list', 'resumes-map', 'current-resume-employer', 'resume-paid', 'current-vacancy-employer', 'favorites-employer', 'my-vacancies', 'resumes-list', 'resumes-map', 'current-resume-employer', 'resume-paid', 'current-vacancy-employer', 'favorites-employer', 'my-vacancies',
'response-employer', 'response-vacancy-employer1', 'response-vacancy-employer2', 'employee-invitation', 'payment-services', 'invoice-payment', 'my-orders', 'response-employer', 'response-vacancy-employer1', 'response-vacancy-employer2', 'employee-invitation', 'payment-services', 'invoice-payment', 'my-orders',
'post-vacancy-step1', 'post-vacancy-step2', 'post-vacancy-step3', 'post-vacancy-step4', 'post-vacancy-step5']; 'post-vacancy-step1', 'post-vacancy-step2', 'post-vacancy-step3', 'post-vacancy-step4', 'post-vacancy-step5', 'mailing', 'profile-employer', 'profile-editing-employer'];
const webpackConfig = { const webpackConfig = {
context: path.resolve(__dirname, 'src'), 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