blob: 4c8669736a71603fc733ba15e17d7acea6e339b7 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
|
// Used in layout
$padding-1: 1px !default;
$padding-4: 0.25rem !default;
$padding-8: 0.5rem !default;
$padding-16: 1rem !default;
$font-size-base: 16px !default;
$font-size-12: 0.75rem !default;
$font-size-14: 0.875rem !default;
$font-size-16: 1rem !default;
$border-radius: $padding-4 !default;
$body-font-weight: normal !default;
$body-min-width: 20rem !default;
$container-max-width: 80rem !default;
$header-height: 3.5rem !default;
$menu-width: 16rem !default;
$toc-width: 16rem !default;
$mobile-breakpoint: $menu-width + $body-min-width * 1.2 + $toc-width !default;
$hint-colors: (
info: #6bf,
warning: #fd6,
danger: #f66,
) !default;
// Themes
@mixin theme-light {
--gray-100: #f8f9fa;
--gray-200: #e9ecef;
--gray-500: #adb5bd;
--color-link: #0055bb;
--color-visited-link: #8440f1;
--body-background: white;
--body-font-color: black;
--icon-filter: none;
--hint-color-info: #6bf;
--hint-color-warning: #fd6;
--hint-color-danger: #f66;
}
@mixin theme-dark {
--gray-100: rgba(255, 255, 255, 0.1);
--gray-200: rgba(255, 255, 255, 0.2);
--gray-500: rgba(255, 255, 255, 0.5);
--color-link: #84b2ff;
--color-visited-link: #b88dff;
--body-background: #343a40;
--body-font-color: #e9ecef;
--icon-filter: brightness(0) invert(1);
--hint-color-info: #6bf;
--hint-color-warning: #fd6;
--hint-color-danger: #f66;
}
|
