pratik/engineeringbuild-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update website

Browse Source
This commit is contained in:
Pratik
2026-06-09 20:17:22 +10:00
parent 978f5d1e6a
commit 9ec53f5a28
8 changed files with 111 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
main.js
View File

@@ -16,6 +16,12 @@ function renderSiteHeader(root) {
<div class="brand-subtitle">Telecommunications, Networking, Linux, Embedded</div>
</div>
<button class="menu-toggle" type="button" aria-expanded="false" aria-label="Open menu">
<span></span>
<span></span>
<span></span>
</button>
<nav class="site-nav" aria-label="Primary">
<a href="${root}index.html">Home</a>
@@ -84,6 +90,21 @@ document.querySelectorAll('[data-include="site-footer"]').forEach((target) => {
const mobileMenuQuery = window.matchMedia('(max-width: 720px)');
document.querySelectorAll('.menu-toggle').forEach((toggle) => {
const header = toggle.closest('.site-header');
const nav = header?.querySelector('.site-nav');
toggle.addEventListener('click', () => {
const isOpen = nav.classList.toggle('is-open');
toggle.setAttribute('aria-expanded', String(isOpen));
toggle.setAttribute('aria-label', isOpen ? 'Close menu' : 'Open menu');
if (!isOpen) {
closeMobileMenus();
}
});
});
function closeMobileMenus() {
document.querySelectorAll('.nav-group.is-open').forEach((group) => {
group.classList.remove('is-open');
@@ -113,11 +134,27 @@ document.querySelectorAll('.nav-trigger').forEach((trigger) => {
});
document.addEventListener('click', (event) => {
if (!mobileMenuQuery.matches || event.target.closest('.site-nav')) {
if (!mobileMenuQuery.matches || event.target.closest('.site-header')) {
return;
}
document.querySelectorAll('.site-nav.is-open').forEach((nav) => {
nav.classList.remove('is-open');
});
document.querySelectorAll('.menu-toggle').forEach((toggle) => {
toggle.setAttribute('aria-expanded', 'false');
toggle.setAttribute('aria-label', 'Open menu');
});
closeMobileMenus();
});
mobileMenuQuery.addEventListener('change', closeMobileMenus);
mobileMenuQuery.addEventListener('change', () => {
document.querySelectorAll('.site-nav.is-open').forEach((nav) => {
nav.classList.remove('is-open');
});
document.querySelectorAll('.menu-toggle').forEach((toggle) => {
toggle.setAttribute('aria-expanded', 'false');
toggle.setAttribute('aria-label', 'Open menu');
});
closeMobileMenus();
});