Fix css fonts properly
assets/css/git.css
1 | 1 | :root { | |
2 | + | --font-base: 14px; | |
3 | + | --font-sans: "DejaVu Sans", "Noto Sans", sans-serif; | |
4 | + | --font-mono: "DejaVu Sans Mono", "Noto Sans Mono", monospace; | |
5 | + | ||
2 | 6 | --white: #faf7f3; | |
3 | 7 | --darkwhite: #eae5e0; | |
4 | 8 | --gray: #d9d5d4; | |
… | |||
35 | 39 | html, body { | |
36 | 40 | margin: 0; | |
37 | 41 | padding: 0; | |
38 | - | font-family: sans-serif; | |
39 | 42 | background: var(--gray); | |
40 | 43 | color: var(--black); | |
44 | + | font-family: var(--font-sans); | |
45 | + | font-size: var(--font-base); | |
41 | 46 | } | |
42 | 47 | ||
43 | 48 | html { | |
… | |||
74 | 79 | text-align: center; | |
75 | 80 | } | |
76 | 81 | ||
77 | - | .pseudo { | |
78 | - | font-family: monospace; | |
79 | - | } | |
80 | - | ||
81 | 82 | #content { | |
82 | 83 | flex: 1; | |
83 | 84 | } | |
… | |||
118 | 119 | code { | |
119 | 120 | padding: 3px; | |
120 | 121 | background-color: var(--darkwhite); | |
122 | + | font-family: var(--font-mono); | |
121 | 123 | } | |
122 | 124 | ||
123 | 125 | .project .instructions code { | |
… | |||
155 | 157 | #mire .blue { | |
156 | 158 | background: var(--blue); | |
157 | 159 | } | |
160 | + | ||
158 | 161 | #mire .green { | |
159 | 162 | background: var(--darkergreen); | |
160 | 163 | } | |
164 | + | ||
161 | 165 | #mire .red { | |
162 | 166 | background: var(--red); | |
163 | 167 | } | |
168 | + | ||
164 | 169 | #mire .orange { | |
165 | 170 | background: var(--orange); | |
166 | 171 | } |
assets/css/gitile.css
5 | 5 | */ | |
6 | 6 | ||
7 | 7 | :root { | |
8 | + | --font-base: 14px; | |
9 | + | --font-sans: "DejaVu Sans", "Noto Sans", sans-serif; | |
10 | + | --font-mono: "DejaVu Sans Mono", "Noto Sans Mono", monospace; | |
11 | + | ||
8 | 12 | /* header colors */ | |
9 | 13 | --blue: #6eaee6; | |
10 | 14 | --darkblue: #176ecb; | |
… | |||
88 | 92 | padding: 0; | |
89 | 93 | min-height: 100%; | |
90 | 94 | background: var(--darkwhite); | |
95 | + | font-family: var(--font-sans); | |
96 | + | font-size: var(--font-base); | |
91 | 97 | } | |
92 | 98 | ||
93 | 99 | body { | |
… | |||
182 | 188 | padding: 0.5em; | |
183 | 189 | margin: 0; | |
184 | 190 | background: var(--white); | |
185 | - | line-height: 1em; | |
186 | - | font-family: monospace; | |
187 | 191 | } | |
188 | 192 | ||
189 | 193 | pre { | |
190 | - | font-size: 0.85em; | |
194 | + | font-family: var(--font-mono); | |
191 | 195 | } | |
192 | 196 | ||
193 | 197 | article.formatted-file-content > * { | |
194 | 198 | margin-left: auto; | |
195 | 199 | margin-right: auto; | |
196 | - | font-family: sans-serif; | |
197 | - | font-size: 1.05em; | |
198 | 200 | } | |
199 | 201 | ||
200 | 202 | .formatted-file-content ul { | |
… | |||
205 | 207 | border: 1px solid var(--pre-border); | |
206 | 208 | box-shadow: 1px 1px 0 var(--pre-shadow); | |
207 | 209 | overflow: auto; | |
208 | - | font-family: monospace; | |
209 | - | font-size: inherit; | |
210 | 210 | color: #353; | |
211 | 211 | } | |
212 | 212 | ||
213 | 213 | .formatted-file-content h1 { | |
214 | 214 | text-align: left; | |
215 | - | font-size: 1.9em; | |
216 | 215 | padding-bottom: 0.3em; | |
217 | 216 | border-bottom: 1px solid #ddd; | |
218 | 217 | } | |
… | |||
223 | 222 | } | |
224 | 223 | ||
225 | 224 | article.formatted-file-content { | |
226 | - | font-family: inherit; | |
227 | - | line-height: inherit; | |
228 | 225 | padding: 1em 5em; | |
229 | 226 | } | |
230 | 227 | ||
… | |||
234 | 231 | width: 100%; | |
235 | 232 | border: 1px solid var(--gray); | |
236 | 233 | margin-bottom: 1em; | |
234 | + | font-size: var(--font-base); | |
235 | + | } | |
236 | + | ||
237 | + | table.file-diff { | |
238 | + | font-family: var(--font-mono); | |
237 | 239 | } | |
238 | 240 | ||
239 | 241 | tbody tr { | |
… | |||
284 | 286 | } | |
285 | 287 | ||
286 | 288 | table.file-diff td:nth-child(3) { | |
287 | - | font-family: monospace; | |
288 | 289 | text-align: center; | |
289 | 290 | } | |
290 | 291 | ||
291 | 292 | table.file-diff .diff-line-num, table.file-content .content-line-num { | |
292 | 293 | background: var(--darkerwhite); | |
293 | 294 | color: var(--lighterblack); | |
294 | - | font-family: monospace; | |
295 | 295 | text-align: center; | |
296 | 296 | border-right: 1px solid var(--gray); | |
297 | 297 | border-left: 1px solid var(--gray); | |
… | |||
403 | 403 | display: inline-block; | |
404 | 404 | padding: 0 0.5em; | |
405 | 405 | border-right: 1px solid var(--gray); | |
406 | - | font-family: monospace; | |
407 | - | font-size: 0.85em; | |
406 | + | font-family: var(--font-mono); | |
408 | 407 | display: flex; | |
409 | 408 | align-items: center; | |
410 | 409 | } | |
… | |||
447 | 446 | background: var(--darkerwhite); | |
448 | 447 | display: inline-block; | |
449 | 448 | padding: 3px; | |
450 | - | font-family: monospace; | |
451 | - | font-size: 0.85em; | |
449 | + | font-family: var(--font-mono); | |
452 | 450 | } | |
453 | 451 | ||
454 | 452 | .formatted-file-content pre code { | |
455 | - | font-size: inherit; | |
456 | - | font-family: inherit; | |
457 | 453 | padding: 0; | |
458 | 454 | background: none; | |
459 | 455 | box-shadow: none; |