Compare commits
12 commits
33fbda0e9d
...
986a5c45ce
Author | SHA1 | Date | |
---|---|---|---|
![]() |
986a5c45ce | ||
![]() |
cabe184b26 | ||
![]() |
82f16001be | ||
![]() |
b72959de74 | ||
![]() |
8072886809 | ||
![]() |
275e3d27e4 | ||
![]() |
84acd10234 | ||
![]() |
2f20804952 | ||
![]() |
1070824023 | ||
![]() |
895e65c192 | ||
![]() |
a5f5dad59c | ||
![]() |
de47f656c7 |
|
@ -18,3 +18,23 @@
|
||||||
.nested-links a{
|
.nested-links a{
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.menu-btn {
|
||||||
|
display: none;
|
||||||
|
color: white;
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
.nav-links {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.nav-links {
|
||||||
|
display: none;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.menu-btn {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -10,15 +10,39 @@
|
||||||
<div class="flex-l items-center">
|
<div class="flex-l items-center">
|
||||||
{{ partial "i18nlist.html" . }}
|
{{ partial "i18nlist.html" . }}
|
||||||
{{ if .Site.Menus.main }}
|
{{ if .Site.Menus.main }}
|
||||||
<ul class="{{ cond (eq $.Site.Language.LanguageDirection "rtl") "pr0 ml3" "pl0 mr3" }}">
|
<nav>
|
||||||
{{ range .Site.Menus.main }}
|
<div class="menu-btn">
|
||||||
<li class="list f5 f4-ns fw4 dib {{ cond (eq $.Site.Language.LanguageDirection "rtl") "pl3" "pr3" }}">
|
<div class="dib">☰ Menu</div>
|
||||||
<a class="hover-white no-underline white-90" href="{{ .URL }}" title="{{ i18n "pageTitle" . }}">
|
</div>
|
||||||
|
<div class="nav-links">
|
||||||
|
{{ range .Site.Menus.main }}
|
||||||
|
<a class="link hover-white white-90 no-underline f5 f4-ns {{ cond (eq $.Site.Language.LanguageDirection "rtl") "pl3" "pr3" }} " href="{{ .URL }}" title="{{ i18n "pageTitle" . }}">
|
||||||
{{ .Name }}
|
{{ .Name }}
|
||||||
</a>
|
</a>
|
||||||
</li>
|
{{ end }}
|
||||||
{{ end }}
|
</div>
|
||||||
</ul>
|
</nav>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var navLinks = document.querySelector('.nav-links');
|
||||||
|
document.querySelector('.menu-btn').addEventListener('click', function() {
|
||||||
|
if (navLinks.style.display === 'none') {
|
||||||
|
navLinks.style.display = 'flex';
|
||||||
|
} else {
|
||||||
|
navLinks.style.display = 'none';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Adjust menu when window is resized
|
||||||
|
window.addEventListener('resize', function() {
|
||||||
|
if (window.innerWidth > 600) {
|
||||||
|
navLinks.style.display = 'flex';
|
||||||
|
} else {
|
||||||
|
navLinks.style.display = 'none';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
{{ partialCached "social-follow.html" . }}
|
{{ partialCached "social-follow.html" . }}
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue