@import 'components/header.scss'; @import 'components/buttons_and_input'; @import 'components/util'; @import 'components/footer'; @import 'components/swap_palette'; @import 'components/dropdown_self_contained'; @import 'components/scrollbars'; @import 'components/material'; :root { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: var(--color-background); --bs-sm: 0 1px 2px rgba(0,0,0,0.05),0 1px 4px rgba(0,0,0,0.05),0 2px 8px rgba(0,0,0,0.05); --bs-md: 0 1px 3px rgba(0,0,0,0.06),0 2px 6px rgba(0,0,0,0.06),0 3px 8px rgba(0,0,0,0.09); --bs-lg: 0 1px 4px rgba(0,0,0,0.09),0 3px 8px rgba(0,0,0,0.09),0 4px 13px rgba(0,0,0,0.13); } * { /* box-sizing: border-box; */ padding: 0; margin: 0; color: var(--color-text); /*border: 1px solid red;*/ } body { width: 100vw; height: 100vh; overflow-y: hidden; } body #page_container { display:grid; grid-template-rows: [header-start]32px[header-end mid-start]1fr[mid-end footer-start]16px[footer-end]; width: 100vw; height: 100vh; background-color: var(--color-background); } header { grid-row: header-start / header-end; position:relative; z-index: 1; width:100%; height:100%; } footer { grid-row: footer-start / footer-end; background-color: var(--color-base); position:relative; z-index: 1; } #content_main { overflow-y: auto; }