anki/sass/base.scss
Matthias Metelka c1176a2e6c
Fix custom webview scrollbar not showing (#2085)
* Fix custom scrollbar not showing

* Move body selector out of scrollbar mixin

* Apply custom scrollbar to child elements too

* Remove some duplicate definitions

* Run prettier
2022-09-26 09:13:06 +10:00

91 lines
1.3 KiB
SCSS

@use "vars";
@use "scrollbar";
$body-color: var(--fg);
$body-bg: var(--canvas);
$link-hover-color: var(--accent-link);
$link-hover-decoration: none;
$utilities: (
"opacity": (
property: opacity,
values: (
0: 0,
25: 0.25,
50: 0.5,
75: 0.75,
100: 1,
),
),
);
@import "bootstrap/scss/bootstrap-reboot";
@import "bootstrap/scss/bootstrap-utilities";
/* Bootstrap "extensions" */
.flex-basis-100 {
flex-basis: 100%;
}
.flex-basis-75 {
flex-basis: 75%;
}
html,
body {
height: 100%;
}
html {
overflow-x: hidden;
}
body {
overscroll-behavior: none;
&:not(.isMac),
&:not(.isMac) * {
@include scrollbar.custom;
}
}
button {
/* override transition for instant hover response */
transition: color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}
pre,
code,
kbd,
samp {
unicode-bidi: normal !important;
}
.isWin {
--base-font-size: 12px;
}
.isMac {
--base-font-size: 13px;
}
.isLin {
--base-font-size: 14px;
}
[dir="rtl"] {
.form-select {
/* flip <select>'s arrow */
background-position: left 0.75rem center;
}
}
.night-mode .form-select:disabled {
background-color: var(--fg-disabled);
}
.reduced-motion * {
transition: none !important;
animation: none !important;
}