templates/Theme/regiovacatures/pages/pages_header.html.twig line 1

Open in your IDE?
  1. {% import "page/macro/node.html.twig" as node %}
  2. {% import "@default/page/macro/multiLang.html.twig" as multiLang %}
  4. {% block content %}
  5.     {% if (app.request.attributes.get('_route') != 'vacancy_detail') %}
  6.         <div class="hide-in-pb" data-url="{{ path('applicant_open_modal_snippet') }}"></div>
  7.     {% endif %}
  8.     <div class="mobile-menu" id="o-wrapper">
  9.         <nav id="c-menu--slide-left" class="c-menu c-menu--slide-right">
  10.             <div class="head">
  11.                 <a class="navbar-brand" href="{{ path('homepage') }}"
  12.                    title="{{ site_company_name|default('Getnoticed') }}">
  13.                     <img loading="lazy" src="{{ media_asset(config_setting('site_logo')) }}"
  14.                          alt="{{ site_company_name|default('Getnoticed') }}">
  15.                 </a>
  16.                 <button class="c-menu__close navbar-toggle">
  17.                     <i class="far fa-times"></i>
  18.                 </button>
  19.             </div>
  20.             <div class="wrapper">
  21.                 <ul class="c-menu__items">
  22.                     <li class="d-lg-none c-menu__item">
  23.                         <a class="c-menu__link" href="{{ path('vacancies') }}">{{ 'Vacancies'|trans }}</a>
  24.                     </li>
  25.                     <li class="d-lg-none c-menu__item">
  26.                         <a class="c-menu__link" href="{{ path('voor-werkgevers') }}">{{ 'For employers'|trans }}</a>
  27.                     </li>
  28.                     {% import "page/macro/mobile_menu.node.html.twig" as mobileNode %}
  30.                     {% for page in pages %}
  31.                         {{ mobileNode.nodeLink(page) }}
  32.                     {% endfor %}
  33.                     {% if feature('feature_jobalert_menu') %}
  34.                         <li class="c-menu c-menu__item navbox">
  35.                             <a href="{{ path('jobalert') }}" data-component="JobAlertModal">
  36.                                 <i class="far fa-bell"></i> {{ 'Job Alert'|trans }}</a>
  37.                         </li>
  38.                     {% endif %}
  39.                     {% if site_translation_locales|length > 1 %}
  40.                         <li class="extra-menu">
  41.                             {{ multiLang.languageSelect() }}
  42.                         </li>
  43.                     {% endif %}
  44.                 </ul>
  45.                 <ul class="user-nav">
  46.                     <li><a href="#" data-component="XhrFormModal" data-endpoint="{{ path('applicant_open_snippet_headless') }}"
  47.                            class="is-btn is-btn-outlined-primary is-border-1 is-color-black">
  48.                             {{ 'Upload CV'|trans }}</a></li>
  49.                     <li class="is-padding-x-10">
  50.                         <a class="is-btn is-background-color-primary"
  51.                            href="{{ path('pages_user_dashboard') }}">
  52.                             <i class="fal fa-user-alt is-margin-right-10"></i>Mijn MBO Banen
  53.                         </a>
  54.                     </li>
  55.                 </ul>
  56.             </div>
  57.         </nav><!-- /c-menu slide-left -->
  58.     </div>
  59.     <div id="c-mask" class="c-mask"></div><!-- /c-mask -->
  62.     <header class="fixed d-none d-md-block">
  63.         <div class="head-bar">
  64.             <div class="container-fluid">
  65.                 <ul class="secondary-nav">
  66.                     {% for item in topNavigation %}
  67.                         {{ node.nodeLink(item) }}
  68.                     {% endfor %}
  69.                 </ul>
  70.             </div>
  71.         </div>
  72.         <div class="container-fluid">
  73.             <div class="head">
  74.                 <div class="flex-group">
  75.                     <div class="d-inline-flex align-items-center">
  76.                         <a class="navbar-brand" href="{{ path('homepage') }}"
  77.                            title="{{ site_company_name|default('Getnoticed') }}">
  78.                             <img loading="lazy" src="{{ media_asset(config_setting('site_logo')) }}"
  79.                                  alt="{{ site_company_name|default('Getnoticed') }}">
  80.                         </a>
  81.                     </div>
  82.                     <nav class="header-nav">
  83.                         <ul class="d-flex align-items-center">
  84.                             <li class="d-none d-lg-inline-flex">
  85.                                 <a href="{{ path('vacancies') }}">{{ 'Vacancies'|trans }}</a>
  86.                             </li>
  87.                             <li class="d-none d-lg-inline-flex">
  88.                                 <a href="{{ path('voor-werkgevers') }}">{{ 'For employers'|trans }}</a>
  89.                             </li>
  90.                             <li data-component="MenuMobile"
  91.                                 class="mobile is-line-height-10 is-margin-left-20 is-margin-left-mobile-0 is-margin-right-40 is-margin-right-mobile-0">
  92.                                 <button type="button" id="c-button--slide-left"
  93.                                         class="navbar-toggle c-button--slide-left d-inline-flex flex-wrap">
  94.                                     <span class="sr-only">Toggle navigation</span>
  95.                                     <span class="icon-bar"></span>
  96.                                     <span class="icon-bar"></span>
  97.                                     <span class="icon-bar"></span>
  98.                                 </button>
  99.                             </li>
  100.                             <li><a href="#" data-component="XhrFormModal" data-endpoint="{{ path('applicant_open_snippet_headless') }}"
  101.                                    class="is-btn is-btn-outlined-accent is-border-1 is-color-black is-margin-right-15">
  102.                                     {{ 'Upload CV'|trans }}</a></li>
  103.                             <li class="is-padding-x-10">
  104.                                 <a class="is-btn is-background-color-primary"
  105.                                    href="{{ path('pages_user_dashboard') }}">
  106.                                     <i class="fal fa-user-alt is-margin-right-10"></i>Mijn MBO Banen
  107.                                 </a>
  108.                             </li>
  109.                         </ul>
  110.                     </nav>
  111.                 </div>
  112.             </div>
  113.         </div>
  114.     </header>
  116.     <!-- mobile header -->
  117.     <header class="fixed d-block d-md-none">
  118.         <div class="container-fluid">
  119.             <div class="head">
  120.                 <div class="flex-group">
  121.                     <div data-component="MenuMobile">
  122.                         <button type="button" id="c-button--slide-left"
  123.                                 class="navbar-toggle c-button--slide-left d-inline-flex flex-wrap">
  124.                             <span class="sr-only">Toggle navigation</span>
  125.                             <span class="icon-bar"></span>
  126.                             <span class="icon-bar"></span>
  127.                             <span class="icon-bar"></span>
  128.                         </button>
  129.                     </div>
  130.                     <div class="d-inline-flex align-items-center">
  131.                         <a class="navbar-brand is-margin-0" href="{{ path('homepage') }}"
  132.                            title="{{ site_company_name|default('Getnoticed') }}">
  133.                             <img loading="lazy" src="{{ media_asset(config_setting('site_logo')) }}"
  134.                                  alt="{{ site_company_name|default('Getnoticed') }}">
  135.                         </a>
  136.                     </div>
  137.                     <nav class="header-nav">
  138.                         <ul class="d-flex align-items-center">
  139.                             <li><a href="{{ path('user_login') }}"> <i
  140.                                             class="fal fa-user-circle is-font-size-28"></i></a></li>
  141.                         </ul>
  142.                     </nav>
  143.                 </div>
  144.             </div>
  145.         </div>
  146.     </header>
  149.     <!-- start search overlay -->
  150.     <div class="is-overlay is-overlay--fullscreen search-overlay">
  151.         <div class="flex-group">
  152.             <form data-component="SearchVacancyBox" action="{{ path('vacancies') }}" method="get">
  153.                 <div class="form-row">
  154.                     <div class="col-12">
  155.                         <div class="input-group">
  156.                             <div class="icon icon__secondary"><i class="fal fa-search"></i></div>
  157.                             <input type="text" name="search" class="form-control is-rounded-0 is-padding-left-40"
  158.                                    placeholder="{{ 'Function or keyword'|trans }} ...">
  159.                         </div>
  160.                     </div>
  161.                 </div>
  162.                 <div class="row">
  163.                     <div class="flex-group pb-0">
  164.                         <div class="input-group justify-content-center">
  165.                             <button class="is-btn is-btn__accent is-btn--search is-btn__responsive" type="submit"
  166.                                     data-settings='{"class": "buttonProps"}'>{{ 'Search'|trans }}
  167.                             </button>
  168.                         </div>
  169.                     </div>
  170.                 </div>
  171.             </form>
  173.             <nav class="overlay-close">
  174.                 <div class="container">
  175.                     <div class="row">
  176.                         <div class="flex-group">
  177.                             <a href="javascript:void(0)" class="close-btn c-align">
  178.                                 <i class="fal fa-times"></i> {{ 'Close'|trans }}
  179.                             </a>
  180.                         </div>
  181.                     </div>
  182.                 </div>
  183.             </nav>
  184.         </div>
  185.     </div>
  186.     <!-- end searchOverlay -->
  187. {% endblock %}