81eaf2fd5e
introduces a new mixin to handle webkit-based shenanigans. also adds a mixin to make keyboard navigation easier. and other small tweaks to css(like accent color and color scheme).
47 lines
812 B
SCSS
47 lines
812 B
SCSS
@use '../abstracts' as helper;
|
|
|
|
#__next,
|
|
html,
|
|
body {
|
|
min-height: 100vh;
|
|
}
|
|
|
|
#__next {
|
|
display: grid;
|
|
grid-template-rows: min-content 1fr min-content;
|
|
|
|
&:has(span[role='progressbar']) {
|
|
cursor: progress;
|
|
}
|
|
}
|
|
|
|
body {
|
|
color: var(--clr-text);
|
|
background-color: var(--clr-bg);
|
|
color-scheme: var(--clr-scheme);
|
|
accent-color: var(--clr-fill);
|
|
}
|
|
|
|
// restricting to 1600px width
|
|
.main {
|
|
--max-width: 160rem;
|
|
width: min(100%, var(--max-width));
|
|
margin-inline: auto;
|
|
}
|
|
|
|
////////////////////////////////////////////////////////
|
|
// KEYBOARD NAVIGATION
|
|
////////////////////////////////////////////////////////
|
|
:focus {
|
|
@include helper.focus-rules;
|
|
}
|
|
|
|
@supports selector(:focus-visible) {
|
|
:focus {
|
|
outline: none;
|
|
}
|
|
|
|
:focus-visible {
|
|
@include helper.focus-rules;
|
|
}
|
|
} |