159 lines
3.9 KiB
HTML
159 lines
3.9 KiB
HTML
<header>
|
|
<div class="container max-w-screen-xl sm:border-b">
|
|
<div
|
|
class="
|
|
nav-section
|
|
flex
|
|
justify-between
|
|
items-center
|
|
py-3
|
|
md:py-5
|
|
lg:py-10
|
|
"
|
|
>
|
|
<div class="logo md:pr-8 l:p-0">
|
|
<a href="{{site.url}}{{ site.baseurl }}"
|
|
><img src="{{ '/assets/img/logo.png' | relative_url }}"
|
|
/></a>
|
|
</div>
|
|
<div class="flex justify-between items-center w-9/12">
|
|
<div class="burger block sm:hidden z-50">
|
|
<button
|
|
class="
|
|
burger__button burger__button--open
|
|
fixed
|
|
top-2
|
|
right-5
|
|
w-12
|
|
h-12
|
|
"
|
|
type="button"
|
|
aria-label="Mobile menu button"
|
|
>
|
|
<img
|
|
class="burger__icon"
|
|
src="{{ '/assets/img/burger.svg' | relative_url }}"
|
|
alt="Open menu button"
|
|
/>
|
|
</button>
|
|
<button
|
|
class="
|
|
burger__button burger__button--close
|
|
hidden
|
|
fixed
|
|
top-2
|
|
right-5
|
|
w-12
|
|
h-12
|
|
"
|
|
type="button"
|
|
aria-label="Close mobile menu button"
|
|
>
|
|
<img
|
|
class="burger__icon burger__icon--close"
|
|
src="{{ '/assets/img/close.svg' | relative_url }}"
|
|
alt="Close menu button"
|
|
/>
|
|
</button>
|
|
</div>
|
|
|
|
<nav class="nav max-w-screen-xm md:max-w-screen-sl container">
|
|
<ul
|
|
class="
|
|
nav__list
|
|
hidden
|
|
sm:flex
|
|
justify-between
|
|
container
|
|
text-xs
|
|
font-semibold
|
|
md:pr-8
|
|
l:p-0
|
|
"
|
|
>
|
|
{% for nav in site.data.navigation %}
|
|
<li class="hover:opacity-50">
|
|
{% if nav.path %}
|
|
<a class="nav__link" href="{{ nav.path }}">{{ nav.title }}</a>
|
|
{% endif %} {% if nav.link %}
|
|
<a href="{{ nav.link }}" target="_blank">{{ nav.title }}</a>
|
|
{% endif %}
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</nav>
|
|
|
|
<ul class="social items-center hidden md:flex">
|
|
{% include social.html %}
|
|
</ul>
|
|
</div>
|
|
|
|
<div
|
|
class="
|
|
overlay
|
|
container
|
|
max-w-screen-sm
|
|
w-full
|
|
hidden
|
|
sm:hidden
|
|
fixed
|
|
top-0
|
|
right-0
|
|
h-screen
|
|
bg-black bg-opacity-40
|
|
z-30
|
|
"
|
|
>
|
|
<nav
|
|
class="
|
|
nav-mobile
|
|
hidden
|
|
fixed
|
|
top-0
|
|
right-0
|
|
flex flex-col
|
|
justify-between
|
|
items-center
|
|
pt-14
|
|
px-12
|
|
pb-5
|
|
bg-white
|
|
w-9/12
|
|
h-3/4
|
|
z-40
|
|
"
|
|
>
|
|
<ul
|
|
class="
|
|
nav__list
|
|
flex flex-col flex-1
|
|
justify-between
|
|
items-center
|
|
container
|
|
box-content
|
|
w-32
|
|
h-auto
|
|
max-h-nav
|
|
text-xs
|
|
font-normal
|
|
"
|
|
>
|
|
{% for nav in site.data.navigation %}
|
|
<li class="leading-loose hover:opacity-50">
|
|
{% if nav.path %}
|
|
<a class="nav__link" href="{{ nav.path }}">{{ nav.title }}</a>
|
|
{% endif %} {% if nav.link %}
|
|
<a href="{{ nav.link }}" target="_blank">{{ nav.title }}</a>
|
|
{% endif %}
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
<ul class="social items-center flex mt-8">
|
|
{% include social.html %}
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|