thePR0M3TH3AN/Archivox
1
0
Fork 0
mirror of https://github.com/PR0M3TH3AN/Archivox.git synced 2025-09-07 14:48:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #31 from PR0M3TH3AN/codex/fix-sidebar-menu-open-close-functionality

Browse Source 
Fix sidebar toggle on desktop
This commit is contained in:
thePR0M3TH3AN
2025-07-10 15:32:44 -04:00
committed by GitHub
parent 8c788dd9cb ae1191ff1e
commit e67416d29b
3 changed files with 29 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
__tests__/responsive.test.js
View File

@@ -99,3 +99,17 @@ test('sidebar opens on small screens', async () => {
expect(bodyClass).toBe(true);
expect(sidebarLeft).toBe('0px');
});
test('sidebar toggles on large screens', async () => {
const page = await browser.newPage();
await page.setViewport({ width: 1024, height: 800 });
await page.goto(`http://localhost:${port}/`);
await page.waitForSelector('#sidebar-toggle');
await new Promise(r => setTimeout(r, 300));
let sidebarWidth = await page.evaluate(() => getComputedStyle(document.querySelector('.sidebar')).width);
expect(sidebarWidth).toBe('240px');
await page.click('#sidebar-toggle');
await new Promise(r => setTimeout(r, 300));
sidebarWidth = await page.evaluate(() => getComputedStyle(document.querySelector('.sidebar')).width);
expect(sidebarWidth).toBe('0px');
});

11
assets/theme.css
View File

@@ -114,3 +114,14 @@ main {
}
body.sidebar-open .sidebar { left: 0; }
}
@media (min-width: 769px) {
.sidebar {
transition: width 0.2s ease;
}
body:not(.sidebar-open) .sidebar {
width: 0;
padding: 0;
overflow: hidden;
}
}

4
assets/theme.js
View File

@@ -12,6 +12,10 @@ document.addEventListener('DOMContentLoaded', () => {
const stored = localStorage.getItem('theme');
if (stored) setTheme(stored);
if (window.innerWidth > 768) {
document.body.classList.add('sidebar-open');
}
sidebarToggle?.addEventListener('click', () => {
document.body.classList.toggle('sidebar-open');
});