diff --git a/_config.yml b/_config.yml index dffdf39..2da2a58 100644 --- a/_config.yml +++ b/_config.yml @@ -12,6 +12,7 @@ include: - _headers - _redirects - js/accordion-screensaver.js + - js/mobile-nav.js exclude: - .editorconfig - .gitignore diff --git a/_includes/head.html b/_includes/head.html index b0467e9..6b9cda9 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -3,6 +3,7 @@ {{page.title}} + diff --git a/_layouts/icalendar.ics.html b/_layouts/icalendar.ics.html index d17027e..4f3f483 100644 --- a/_layouts/icalendar.ics.html +++ b/_layouts/icalendar.ics.html @@ -5,6 +5,7 @@ METHOD:PUBLISH PRODID:blr.today{{page.slug}} CALSCALE:GREGORIAN +NAME:{{page.title | strip_newlines}} X-WR-CALNAME:{{page.title | strip_newlines}} X-ORIGINAL-URL:{{page.url | absolute_url}} X-WR-CALDESC:{{page.description | strip_newlines}} diff --git a/assets/custom.css b/assets/custom.css index 4f6ef4a..9690289 100644 --- a/assets/custom.css +++ b/assets/custom.css @@ -19,6 +19,18 @@ --pink-glamour: #fab1a0; } +/* Fix mobile navigation to stay open on tap */ +@media (max-width: 40rem) { + nav ul:first-child.mobile-menu-open > li:not(:first-child):not(.sticky) { + display: block; + float: none !important; + padding: .3rem .6rem; + } + nav ul:first-child > li:first-child { + cursor: pointer; + } +} + a.fake-button { font: var(--font-h); border-radius: 4px; diff --git a/js/mobile-nav.js b/js/mobile-nav.js new file mode 100644 index 0000000..86e2303 --- /dev/null +++ b/js/mobile-nav.js @@ -0,0 +1,52 @@ +// Fix for mobile navigation - keep menu open on tap +(function() { + 'use strict'; + + // Only run on mobile screens + function isMobile() { + return window.innerWidth <= 640; // 40rem at 16px base + } + + let menuOpen = false; + + function setupMobileNav() { + if (!isMobile()) return; + + const nav = document.querySelector('nav ul:first-child'); + if (!nav) return; + + const firstLi = nav.querySelector('li:first-child'); + if (!firstLi) return; + + // Toggle menu on click + firstLi.addEventListener('click', function(e) { + menuOpen = !menuOpen; + nav.classList.toggle('mobile-menu-open', menuOpen); + e.stopPropagation(); + }); + + // Close menu when clicking outside + document.addEventListener('click', function(e) { + if (menuOpen && !nav.contains(e.target)) { + menuOpen = false; + nav.classList.remove('mobile-menu-open'); + } + }); + + // Close menu when clicking a link + const links = nav.querySelectorAll('li:not(:first-child) a'); + links.forEach(link => { + link.addEventListener('click', function() { + menuOpen = false; + nav.classList.remove('mobile-menu-open'); + }); + }); + } + + // Run on load and resize + if (document.readyState === 'loading') { + document.addEventListener('DOMContentLoaded', setupMobileNav); + } else { + setupMobileNav(); + } +})();