eptm_dashboard/assets/responsive.css
2026-05-08 00:34:51 +02:00

64 lines
1.2 KiB
CSS

/* Reset default margins and padding */
* {
box-sizing: border-box;
}
body, html {
width: 100%;
max-width: 100%;
margin: 0;
padding: 0;
height: 100%;
overflow: hidden;
}
#root, #__next {
height: 100%;
}
/* App shell: viewport-bounded with internal scroll on content */
.content-area {
width: 100%;
max-width: 100%;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
}
/* Mobile: hide desktop sidebar, account for fixed topbar (56px) */
@media (max-width: 767px) {
.sidebar-desktop { display: none !important; }
.content-area {
margin-left: 0 !important;
width: 100% !important;
padding-top: calc(56px + 0.75rem) !important;
padding-left: 0.75rem !important;
padding-right: 0.75rem !important;
padding-bottom: 0.75rem !important;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1024px) {
.content-area {
padding: 1rem !important;
}
}
/* Desktop: hide mobile topbar */
@media (min-width: 768px) {
.topbar-mobile { display: none !important; }
}
/* Ensure responsive images and content */
img {
max-width: 100%;
height: auto;
display: block;
}
/* Ensure flex containers wrap properly */
.content-area > * {
min-width: 0;
max-width: 100%;
}