mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-04-25 00:36:31 +02:00
42 lines
996 B
CSS
42 lines
996 B
CSS
.dashboardWrapper {
|
|
grid-template-columns: min-content auto;
|
|
grid-template-areas: "sidebar main";
|
|
--header-height: 5rem;
|
|
--footer-height: 2rem;
|
|
--small-spacing: 1rem; /* tw class: gap-4, m-4 etc. */
|
|
--large-spacing: 2rem; /* tw class: gap-8, m-8 etc. */
|
|
--header-size: calc(var(--header-height) + var(--small-spacing));
|
|
--footer-size: calc(var(--footer-height) + var(--small-spacing));
|
|
}
|
|
|
|
.dashboardSidebar {
|
|
grid-area: sidebar;
|
|
}
|
|
|
|
.dashboardMain {
|
|
@apply gap-[var(--large-spacing)];
|
|
grid-area: main;
|
|
grid-template-rows: var(--header-height) calc(
|
|
100vh - (var(--header-height) + var(--footer-height))
|
|
);
|
|
grid-template-areas: "header" "content";
|
|
}
|
|
|
|
.dashboardHeader {
|
|
grid-area: header;
|
|
}
|
|
|
|
.dashboardContent {
|
|
grid-area: content;
|
|
}
|
|
|
|
.dashboardContentWrapper {
|
|
@apply gap-[var(--small-spacing)];
|
|
min-height: calc(
|
|
100vh -
|
|
(
|
|
var(--header-size) + var(--footer-size) + var(--small-spacing) +
|
|
var(--small-spacing)
|
|
)
|
|
);
|
|
}
|