alihan/seedbox-lite-torrent
1
0
Fork 0
mirror of https://github.com/hotheadhacker/seedbox-lite.git synced 2025-09-02 00:51:36 +03:00
Code Issues Packages Projects Releases Wiki Activity

Refactor layout styles for improved sidebar positioning and responsiveness

Browse Source
This commit is contained in:
Salman Qureshi
2025-08-10 03:09:24 +05:30
parent 3b62115b15
commit 80a3f28717
1 changed files with 32 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
client/src/components/Layout.css
View File

@@ -1,5 +1,4 @@
.layout {
display: flex;
min-height: 100vh;
background: #0a0a0a;
}
@@ -58,7 +57,10 @@
display: flex;
flex-direction: column;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
position: fixed;
left: 0;
top: 0;
bottom: 0;
z-index: 999;
box-shadow: 2px 0 12px rgba(0, 0, 0, 0.2);
}
@@ -311,15 +313,11 @@
/* Main Content */
.main-content {
flex: 1;
background: #0a0a0a;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
min-height: 100vh;
overflow-x: hidden;
}
.main-content.expanded {
margin-left: 0;
width: 100%;
}
/* Mobile Overlay */
@@ -464,6 +462,33 @@
}
}
/* Desktop layout with proper sidebar margins */
@media (min-width: 769px) {
.mobile-header {
display: none;
}
.sidebar {
position: fixed;
left: 0;
top: 0;
bottom: 0;
}
.main-content {
margin-left: 280px; /* Account for sidebar width */
margin-top: 0;
}
.main-content.expanded {
margin-left: 80px; /* Account for collapsed sidebar width */
}
.mobile-overlay {
display: none;
}
}
/* Extra small mobile devices */
@media (max-width: 480px) {
.mobile-header {