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
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
|
@use "bulma/sass/utilities/initial-variables.scss" with (
$family-sans-serif: "Source Sans Pro,Roboto,Open Sans,Liberation Sans,DejaVu Sans,Verdana,Helvetica,Arial,sans-serif",
);
@use "bulma/sass/utilities/derived-variables.scss" with (
$primary: rgb(216,222,233)
);
@use "bulma/sass/base";
@use "bulma/sass/themes";
@use "bulma/sass/elements/title.scss" with (
$title-family: "'Noto Serif Display', serif",
$title-weight: 300,
);
@use "bulma/sass/grid/columns.scss";
@use "bulma/sass/elements/button.scss";
@use "bulma/sass/elements/notification.scss";
@use "bulma/sass/elements/content.scss" with (
$content-heading-weight: false,
);
@use "bulma/sass/helpers/typography.scss";
@use "bulma/sass/helpers/spacing.scss";
@use "bulma/sass/components/pagination.scss";
@use "bulma/sass/utilities/mixins.scss" as mx;
@use "bulma/sass/helpers/float.scss";
html[data-theme="dark"] {
--main-text-color: #d8dee9;
--main-background-color: #2e3440;
--side-background-color: #222;
--border-color: #4c566a;
--link-color: #88c0d0;
--link-hover-color: #d8dee9;
--link2-color: #5e81ac;
--link2-hover-color: #5e81ac;
--button-background-color: #3b4252;
--bulma-link-text: var(--link-color);
}
html[data-theme="light"] {
--main-text-color: #2e3440;
--main-background-color: #fff;
--side-background-color: #2e3440;
--border-color: #eee;
--link-color: #5e81ac;
--link2-color: #5e81ac;
--link-hover-color: #5e81ac;
--link2-hover-color: #5e81ac;
--button-background-color: #eceff4;
--bulma-link-text: var(--link-color);
}
body {
background-color: var(--main-background-color);
}
main {
font-size: 1.5em;
font-weight: 300;
}
.aside {
background-color: var(--side-background-color);
--bulma-link-text: #eceff4;
--bulma-text: #eceff4;
@include mx.desktop {
min-height: 100vh;
}
}
aside {
@include mx.desktop {
position: fixed;
left: 11%;
transform: translate(-50%, 0);
}
}
.aside .title, .aside .subtitle {
--bulma-title-family: var(--bulma-family-primary);
font-weight: 300;
}
.aside span.amp {
font-family:Baskerville,"Goudy Old Style","Palatino","Book Antiqua",serif;
font-size:110%;
font-style:italic;
}
.aside ul {
margin: 0;
list-style-type: none;
}
.content .section {
padding: unset;
}
.admonition { @extend .notification; }
.note { @extend .is-primary, .is-light; }
.danger { @extend .is-danger, .is-light }
.warning { @extend .is-warning, .is-light }
.hint { @extend .is-info, .is-light }
h1 { @extend .title, .is-1 }
h2 { @extend .title, .is-2 }
h3 { @extend .title, .is-3 }
.figure.align-center { @extend .has-text-centered }
.figure.align-left { @extend .has-text-left }
.figure.align-right { @extend .has-text-right }
|