Standardize responsive breakpoints (Refs #130)
CI / checks (push) Successful in 5m20s

This commit is contained in:
2026-10-10 19:44:55 -04:00
parent 7442c6fd15
commit d2b2958700
6 changed files with 214 additions and 14 deletions
+6 -5
View File
@@ -115,11 +115,12 @@
onMount(() => {
const stopTimeZone = startTimeZonePreference();
const desktop = window.matchMedia('(min-width: 961px)');
// Keep this identical to the sidebar's CSS query, including fractional widths.
const mobileNavigation = window.matchMedia('(max-width: 960px)');
const closeDrawer = () => {
if (desktop.matches) drawerOpen = false;
if (!mobileNavigation.matches) drawerOpen = false;
};
desktop.addEventListener('change', closeDrawer);
mobileNavigation.addEventListener('change', closeDrawer);
const shortcuts = Object.fromEntries(
visibleNavigation(data.user?.role ?? 'viewer')
@@ -181,7 +182,7 @@
window.addEventListener('keydown', onKey);
return () => {
stopTimeZone();
desktop.removeEventListener('change', closeDrawer);
mobileNavigation.removeEventListener('change', closeDrawer);
window.removeEventListener('keydown', onKey);
if (armTimer) clearTimeout(armTimer);
};
@@ -705,7 +706,7 @@
margin-left: 0;
}
}
@media (max-width: 720px) {
@media (max-width: 640px) {
.app-header {
padding-inline: var(--space-2);
gap: var(--space-1);