aljaz/boris
1
1
Fork 0
mirror of https://github.com/dergigi/boris.git synced 2026-01-31 12:44:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor: DRY mobile sidepane styles - unified overlay behavior

Browse Source
This commit is contained in:
Gigi
2025-10-10 17:19:14 +01:00
parent 33cee9c0c2
commit c17a39588d
1 changed files with 21 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/index.css
View File

@@ -594,19 +594,26 @@ body.mobile-sidebar-open {
/* Mobile pane styles */
@media (max-width: 768px) {
.pane.sidebar {
/* Both sidepanes slide in as overlays */
.pane.sidebar,
.pane.highlights {
position: fixed;
top: 0;
left: 0;
width: 85%;
max-width: 320px;
height: 100vh;
height: 100dvh;
background: #1a1a1a;
z-index: 1000;
transform: translateX(-100%);
transition: transform 0.3s ease;
box-shadow: none;
display: flex;
}
/* Bookmarks sidebar from left */
.pane.sidebar {
left: 0;
transform: translateX(-100%);
}
.pane.sidebar.mobile-open {
@@ -614,6 +621,17 @@ body.mobile-sidebar-open {
box-shadow: 4px 0 12px rgba(0, 0, 0, 0.5);
}
/* Highlights sidebar from right */
.pane.highlights {
right: 0;
transform: translateX(100%);
}
.pane.highlights.mobile-open {
transform: translateX(0);
box-shadow: -4px 0 12px rgba(0, 0, 0, 0.5);
}
.pane.main {
grid-column: 1;
grid-row: 1;
@@ -628,27 +646,6 @@ body.mobile-sidebar-open {
pointer-events: none;
}
.pane.highlights {
position: fixed;
top: 0;
right: 0;
width: 85%;
max-width: 320px;
height: 100vh;
height: 100dvh;
background: #1a1a1a;
z-index: 1000;
transform: translateX(100%);
transition: transform 0.3s ease;
box-shadow: none;
display: flex;
}
.pane.highlights.mobile-open {
transform: translateX(0);
box-shadow: -4px 0 12px rgba(0, 0, 0, 0.5);
}
.mobile-sidebar-backdrop {
display: none;
position: fixed;