60 lines
No EOL
1.7 KiB
JavaScript
60 lines
No EOL
1.7 KiB
JavaScript
export function panelToggle(responsiveSmall) {
|
|
const toggleBtn = document.querySelector('#toggle-panel');
|
|
const toggleBtnMobile = document.querySelector('#toggle-panel__mobile');
|
|
const main = document.querySelector('main');
|
|
const closeBtn = document.querySelector('.panel-left .panel__header');
|
|
|
|
function openPanel() {
|
|
main.classList.add('panel-open');
|
|
const screenWidth = window.innerWidth;
|
|
if (screenWidth <= responsiveSmall) {
|
|
console.log("small screen");
|
|
document.body.style.overflowY = 'hidden';
|
|
}
|
|
|
|
}
|
|
|
|
function closePanel() {
|
|
main.classList.remove('panel-open');
|
|
main.classList.add('panel-close');
|
|
document.body.style.overflowY = '';
|
|
}
|
|
|
|
if (toggleBtn) {
|
|
toggleBtn.addEventListener('click', (e) => {
|
|
e.stopPropagation();
|
|
openPanel();
|
|
});
|
|
}
|
|
|
|
if (toggleBtnMobile) {
|
|
toggleBtnMobile.addEventListener('click', (e) => {
|
|
e.stopPropagation();
|
|
openPanel();
|
|
});
|
|
}
|
|
|
|
if (closeBtn) {
|
|
closeBtn.addEventListener('click', closePanel);
|
|
}
|
|
}
|
|
|
|
|
|
export function tocMobile(responsiveSmall) {
|
|
const toc = document.querySelector('#toc');
|
|
const main = document.querySelector('main');
|
|
|
|
if (!toc) return;
|
|
|
|
const tocLinks = toc.querySelectorAll('a');
|
|
|
|
tocLinks.forEach(link => {
|
|
link.addEventListener('click', () => {
|
|
if (window.innerWidth <= responsiveSmall) {
|
|
main.classList.remove('panel-open');
|
|
main.classList.add('panel-close');
|
|
document.body.style.overflowY = '';
|
|
}
|
|
});
|
|
});
|
|
} |