frontend/src/styles/theme/scrollbars.scss
adrinux 46fa43d67f Migrate to bulma-css-variables and introduce dark mode (#954)
Co-authored-by: Adrian Simmons <adrian@perlucida.co.uk>
Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Co-authored-by: kolaente <k@knt.li>
Reviewed-on: vikunja/frontend#954
Reviewed-by: dpschen <dpschen@noreply.kolaente.de>
Reviewed-by: konrad <k@knt.li>
Co-authored-by: adrinux <adrian@perlucida.co.uk>
Co-committed-by: adrinux <adrian@perlucida.co.uk>
2021-11-22 21:12:54 +00:00

32 lines
622 B
SCSS

$scrollbar-height: 8px;
$scrollbar-track-color: var(--grey-200);
$scrollbar-thumb-color: var(--grey-300);
$scrollbar-hover-color: var(--grey-500);
// Chrome
::-webkit-scrollbar {
width: $scrollbar-height;
height: $scrollbar-height;
}
::-webkit-scrollbar-track {
background: $scrollbar-track-color;
border-radius: .5rem;
}
::-webkit-scrollbar-thumb {
border-radius: .5rem;
background: $scrollbar-thumb-color;
transition: all $transition;
&:hover {
background: $scrollbar-hover-color;
}
}
// Firefox
* {
scrollbar-color: $scrollbar-thumb-color $scrollbar-track-color;
scrollbar-width: thin;
}