feat: add responsive sidebar overlay at <960px and reduced-motion support

This commit is contained in:
Brian Krabach
2026-03-27 17:00:07 -07:00
parent 4e7e461077
commit 67da2e9aa2
2 changed files with 132 additions and 2 deletions
+33
View File
@@ -903,6 +903,10 @@ body {
.toast {
animation: none;
}
.session-sidebar {
transition: none;
}
}
/* ============================================================
@@ -920,3 +924,32 @@ body {
width: auto;
display: block;
}
/* ============================================================
Responsive overlay sidebar at <960px
============================================================ */
@media (max-width: 959px) {
.session-sidebar {
position: fixed;
left: 0;
top: 0;
height: 100%;
z-index: 200;
width: 240px;
min-width: 240px;
transition: transform 0.25s ease;
transform: translateX(0);
box-shadow: 2px 0 16px rgba(0,0,0,0.5);
}
.session-sidebar.sidebar--collapsed {
width: 240px;
min-width: 240px;
transform: translateX(-100%);
}
.sidebar-collapse-btn {
display: none;
}
}