diff options
-rw-r--r-- | docs/style.css | 69 |
1 files changed, 52 insertions, 17 deletions
diff --git a/docs/style.css b/docs/style.css index ec60864..f95623f 100644 --- a/docs/style.css +++ b/docs/style.css | |||
@@ -1,5 +1,21 @@ | |||
1 | @import url('https://rsms.me/inter/inter.css'); | 1 | @import url('https://rsms.me/inter/inter.css'); |
2 | 2 | ||
3 | .feed-button { | ||
4 | float: right; | ||
5 | text-decoration: none; | ||
6 | color: var(--black) !important; | ||
7 | background-color: var(--cyan); | ||
8 | font-size: 0.8rem; | ||
9 | padding: 0.3rem 0.5rem; | ||
10 | margin: -0.5rem 0; | ||
11 | border: 0px solid var(--dark-white); | ||
12 | border-radius: 0.2rem; | ||
13 | } | ||
14 | |||
15 | ::-moz-selection, ::selection { | ||
16 | background: var(--cyan); | ||
17 | } | ||
18 | |||
3 | :root { | 19 | :root { |
4 | --cyan: #79ffe1; | 20 | --cyan: #79ffe1; |
5 | --pink: #d344e2; | 21 | --pink: #d344e2; |
@@ -9,6 +25,25 @@ | |||
9 | --dark-white: #eeeeee; | 25 | --dark-white: #eeeeee; |
10 | } | 26 | } |
11 | 27 | ||
28 | @media (prefers-color-scheme: dark) { | ||
29 | :root { | ||
30 | --cyan: #79ffe1; | ||
31 | --pink: #ff3299; | ||
32 | --black: #dedede; | ||
33 | --light-black: #ccc; | ||
34 | --white: #000; | ||
35 | --dark-white: #323232; | ||
36 | } | ||
37 | .feed-button { | ||
38 | color: var(--white) !important; | ||
39 | background: var(--cyan); | ||
40 | } | ||
41 | ::-moz-selection, ::selection { | ||
42 | color: var(--white); | ||
43 | background: var(--cyan); | ||
44 | } | ||
45 | } | ||
46 | |||
12 | body { font-family: 'Inter', sans-serif; } | 47 | body { font-family: 'Inter', sans-serif; } |
13 | @supports (font-variation-settings: normal) { | 48 | @supports (font-variation-settings: normal) { |
14 | body { | 49 | body { |
@@ -31,6 +66,21 @@ html { | |||
31 | font-size: 17px; | 66 | font-size: 17px; |
32 | } | 67 | } |
33 | 68 | ||
69 | h1, h2, h3 { | ||
70 | margin-top: 4rem; | ||
71 | } | ||
72 | h4, h5, h6 { | ||
73 | margin-top: 2rem; | ||
74 | } | ||
75 | |||
76 | .subheading { | ||
77 | font-weight: 400; | ||
78 | font-size: 0.8rem; | ||
79 | color: var(--light-black); | ||
80 | margin-top: 2rem; | ||
81 | margin-bottom: 2rem; | ||
82 | } | ||
83 | |||
34 | table { | 84 | table { |
35 | width: 100%; | 85 | width: 100%; |
36 | border-collapse: collapse; | 86 | border-collapse: collapse; |
@@ -106,7 +156,7 @@ pre > code { | |||
106 | 156 | ||
107 | img { | 157 | img { |
108 | max-width: 100%; | 158 | max-width: 100%; |
109 | border: 1px solid var(--dark-white); | 159 | border: 2px solid var(--dark-white); |
110 | border-radius: 0.4rem; | 160 | border-radius: 0.4rem; |
111 | box-shadow: 0 0 1.5rem 0.5rem rgba(0, 0, 0, 0.15); | 161 | box-shadow: 0 0 1.5rem 0.5rem rgba(0, 0, 0, 0.15); |
112 | } | 162 | } |
@@ -130,17 +180,6 @@ hr { | |||
130 | border-top: 2px solid var(--dark-white); | 180 | border-top: 2px solid var(--dark-white); |
131 | } | 181 | } |
132 | 182 | ||
133 | .feed-button { | ||
134 | float: right; | ||
135 | text-decoration: none; | ||
136 | color: var(--black) !important; | ||
137 | background-color: var(--cyan); | ||
138 | font-size: 0.8rem; | ||
139 | padding: 0.3rem 0.5rem; | ||
140 | margin: -0.5rem 0; | ||
141 | border: 0px solid var(--dark-white); | ||
142 | border-radius: 0.2rem; | ||
143 | } | ||
144 | 183 | ||
145 | .intro { | 184 | .intro { |
146 | font-size: 0.8rem; | 185 | font-size: 0.8rem; |
@@ -207,11 +246,6 @@ ul { | |||
207 | list-style: lower-greek inside none; | 246 | list-style: lower-greek inside none; |
208 | } | 247 | } |
209 | 248 | ||
210 | |||
211 | ::-moz-selection, ::selection { | ||
212 | background: var(--cyan); | ||
213 | } | ||
214 | |||
215 | .stats { | 249 | .stats { |
216 | float: right; | 250 | float: right; |
217 | text-align: right; | 251 | text-align: right; |
@@ -239,3 +273,4 @@ ul { | |||
239 | cursor: pointer; | 273 | cursor: pointer; |
240 | box-shadow: none; | 274 | box-shadow: none; |
241 | } | 275 | } |
276 | |||