Added mobilmenu param option.

This commit is contained in:
Fredrik Jonsson 2017-08-14 22:01:13 +02:00
commit 59bc1494af
3 changed files with 9 additions and 8 deletions

View file

@ -33,11 +33,7 @@
</footer> </footer>
</div> </div>
<div class="mobile-nav-wrapper hidden"> {{ if $.Param "mobilemenu" }}{{ partial "mobilemenu.html" . }}{{ end -}}
<div class="mobile-nav-cover"></div>
<a href="#navigation" class="mobile-nav-toggle" aria-haspopup="true" role="button">{{ i18n "menu_mobile" }}</a>
<div class="mobile-nav-sheet"></div>
</div>
{{ partial "scripts.html" . -}} {{ partial "scripts.html" . -}}
{{ partialCached "scripts_cache.html" . -}} {{ partialCached "scripts_cache.html" . -}}
</body> </body>

View file

@ -0,0 +1,5 @@
<div class="mobile-nav-wrapper hidden">
<div class="mobile-nav-cover"></div>
<a href="#navigation" class="mobile-nav-toggle" aria-haspopup="true" role="button">{{ i18n "menu_mobile" }}</a>
<div class="mobile-nav-sheet"></div>
</div>

View file

@ -11,15 +11,15 @@
$('html').removeClass('nojs').addClass('js'); $('html').removeClass('nojs').addClass('js');
// Activate the mobil menu for small screens. // Activate the mobil menu for small screens.
if (window.matchMedia) { if (window.matchMedia && $('.mobile-nav-wrapper').length) {
var mq = window.matchMedia('(max-width: 666px)'); var mq = window.matchMedia('(max-width: 666px)');
if (mq.matches) { if (mq.matches) {
// Show mobile menu. // Show mobile menu.
$('.mobile-nav-wrapper').removeClass('hidden'); $('.mobile-nav-wrapper').removeClass('hidden');
// Populate the mobile nav sheet. // Populate the mobile nav sheet.
$('.header__region').removeClass('header__region region hidden').addClass('js-region').appendTo('.mobile-nav-sheet'); $('.header__region').filter(':not(:empty)').removeClass('header__region region hidden').addClass('js-region').appendTo('.mobile-nav-sheet');
$('.main-menu').addClass('hidden').clone().removeClass('main-menu layout__navigation layout__full hidden hidden').addClass('js-main-menu').appendTo('.mobile-nav-sheet').find('.navbar').removeClass('navbar').addClass('js-navbar'); $('.main-menu').addClass('hidden').clone().removeClass('main-menu layout__navigation layout__full hidden').addClass('js-main-menu').appendTo('.mobile-nav-sheet').find('.navbar').removeClass('navbar').addClass('js-navbar');
// Toggle the mobile nav sheet. // Toggle the mobile nav sheet.
$('.mobile-nav-cover, .mobile-nav-toggle').on('click toushstart', function (e) { $('.mobile-nav-cover, .mobile-nav-toggle').on('click toushstart', function (e) {