src/wolnelektury/templates/header.html

   1 {% load annoy %}
   2 {% load cache %}
   3 {% load i18n %}
   4 {% load static %}
   5 {% load menu %}
   6 {% load latest_blog_posts from blog %}
   7 {% load preview_ad from catalogue_tags %}
   8
   9 {% annoy_banner_crisis %}
  10 {% annoy_banner_top %}
  11
  12 {% annoy_banner_blackout %}
  13
  14 <nav class="l-navigation" aria-label="Główna">
  15   <div class="l-container">
  16     <a href="/" class="l-navigation__logo">
  17       <img src="{% static "2022/images/logo.svg" %}" alt="WolneLektury.pl">
  18     </a>
  19     <div class="l-naviagion__search">
  20       <form action="/szukaj/" role="search">
  21         <input id="search" name="q" type="text" placeholder="szukaj tytułu, autora, motywów…" autocomplete="off" data-source="/szukaj/hint/?max=10" aria-label="szukaj">
  22       </form>
  23     </div>
  24     <div class="l-navigation__actions">
  25       <div class="l-navigation__user-actions">
  26         {% include 'user_actions.html' %}
  27       </div>
  28       <button class="l-navigation__button js-menu"
  29               aria-label="Menu" aria-haspopup="dialog" aria-controls="main-menu"
  30               >
  31         <span class="c-hamburger">
  32           <span class="bar"></span>
  33         </span>
  34       </button>
  35     </div>
  36   </div>
  37
  38   <dialog id="main-menu" class="l-navigation__menu" aria-label="Menu">
  39     <div class="l-navigation__menu__top">
  40       <div class="l-container">
  41         <a href="/" class="l-navigation__logo">
  42           <img src="{% static "2022/images/logo.svg" %}" alt="WolneLektury.pl">
  43         </a>
  44         {% include 'lang-switcher.html' with list_id="lang-desktop" %}
  45         <button class="l-navigation__button js-menu-close"
  46                 aria-label="Zamknij menu"
  47                 >
  48           <span class="c-hamburger">
  49             <span class="bar"></span>
  50           </span>
  51         </button>
  52       </div>
  53     </div>
  54
  55
  56       <div class="scrollable">
  57         <div class="l-container">
  58
  59           <div class="l-navigation__user-bar">
  60             <div class="l-navigation__user-actions">
  61               {% include 'lang-switcher.html' with list_id="lang-mobile" %}
  62               {% include 'user_actions.html' with hide_menu=True %}
  63             </div>
  64           </div>
  65
  66           <div class="l-navigation__menu__blocks">
  67             <div class="l-navigation__menu__links">
  68               {% cache 30 menu LANGUAGE_CODE %}
  69               <div class="l-navigation__menu__group">
  70                 <h2 id="menu-group-1">{% trans "Katalog" %}</h2>
  71                 <ul aria-labelledby="menu-group-1">
  72                   {% menu 'Katalog' %}
  73                 </ul>
  74               </div>
  75               <div class="l-navigation__menu__group">
  76                 <h2 id="menu-group-2">{% trans "Włącz się" %}</h2>
  77                 <ul aria-labelledby="menu-group-2">
  78                   {% menu 'Włącz się' %}
  79                 </ul>
  80               </div>
  81               <div class="l-navigation__menu__group">
  82                 <h2 id="menu-group-3">{% trans "Aktualności" %}</h2>
  83                 <ul aria-labelledby="menu-group-3">
  84                   {% latest_blog_posts %}
  85                   {% menu 'Aktualności' %}
  86                 </ul>
  87               </div>
  88               <div class="l-navigation__menu__group">
  89                 <h2 id="menu-group-4">{% trans "Narzędzia" %}</h2>
  90                 <ul aria-labelledby="menu-group-4">
  91                   {% menu 'Narzędzia' %}
  92                 </ul>
  93               </div>
  94               <div class="l-navigation__menu__group">
  95                 <h2 id="menu-group-5">{% trans "O nas" %}</h2>
  96                 <ul aria-labelledby="menu-group-5">
  97                   {% menu 'O nas' %}
  98                 </ul>
  99               </div>
 100               {% endcache %}
 101             </div>
 102
 103             <div class="l-navigation__menu__info">
 104
 105               <div class="l-navigation__menu__book">
 106                 {% preview_ad %}
 107               </div>
 108
 109               <div class="l-navigation__menu__social">
 110                 <ul aria-label="{% trans "Media społecznościowe" %}">
 111                   <li>
 112                     <a href="https://www.facebook.com/wolnelektury/"
 113                        title="Facebook" target="_blank">
 114                       <i class="icon icon-fb" aria-hidden="true"></i>
 115                     </a>
 116                   </li>
 117                   <li>
 118                     <a href="https://www.youtube.com/c/WolneLekturyYT/"
 119                        title="YouTube" target="_blank">
 120                       <i class="icon icon-yt" aria-hidden="true"></i>
 121                     </a>
 122                   </li>
 123                   <li>
 124                     <a href="https://www.instagram.com/wolnelektury/"
 125                        title="Instagram" target="_blank">
 126                       <i class="icon icon-ig" aria-hidden="true"></i>
 127                     </a>
 128                   </li>
 129                   <li>
 130                     <a href="https://twitter.com/wolnelektury"
 131                        title="Twitter" target="_blank">
 132                       <i class="icon icon-tt" aria-hidden="true"></i>
 133                     </a>
 134               </li>
 135             </ul>
 136             </div>
 137           </div>
 138         </div>
 139         </div>
 140       </div>
 141     </dialog>
 142 </nav>
 143
 144 {% block under-menu %}{% endblock %}