]>
Commit | Line | Data |
---|---|---|
1 | html { | |
2 | scroll-behavior: smooth; | |
3 | } | |
4 | ||
5 | body { | |
6 | font-family: "Hoefler Text", "Times New Roman", serif; | |
7 | font-feature-settings: "liga" 1, "dlig" 1, "pnum" 1; | |
8 | line-height: 1.6; | |
9 | letter-spacing: 0.02em; | |
10 | } | |
11 | ||
12 | @media only screen and (min-width: 500px) { | |
13 | body { | |
14 | overflow-x: auto; | |
15 | } | |
16 | ||
17 | .columned { | |
18 | height: calc(100vh - 200px); | |
19 | width: max-content; | |
20 | } | |
21 | ||
22 | .columned .h2:not(:only-child) { | |
23 | float: left; | |
24 | margin: 0 40px; | |
25 | height: calc(100vh - 200px); | |
26 | } | |
27 | ||
28 | .columned .h2:not(:only-child) h2 { | |
29 | width: 14.6em; | |
30 | } | |
31 | ||
32 | .columned .h2:not(:only-child) .h3, | |
33 | .columned .h2:not(:only-child) li, | |
34 | .columned .h2:not(:only-child) p { | |
35 | width: 22em; | |
36 | } | |
37 | ||
38 | .columned .h2:not(:only-child) pre { width: 25em } | |
39 | } | |
40 | ||
41 | .columned .h2:first-of-type pre { | |
42 | line-height: 1; | |
43 | } | |
44 | ||
45 | blockquote, p { max-width: 45em } | |
46 | pre { max-width: 55em } | |
47 | blockquote { | |
48 | border-left: 4px solid #ccc; | |
49 | padding-left: 10px; | |
50 | } | |
51 | ||
52 | h1, h2, h3 { font-weight: normal } | |
53 | br { display: none } | |
54 | pre { | |
55 | font-family: courier, monospace; | |
56 | font-size: 14px; | |
57 | background-color: #eee; | |
58 | overflow-x: auto; | |
59 | } | |
60 | ||
61 | canvas { | |
62 | width: 64px; | |
63 | height: 64px; | |
64 | display: inline-block; | |
65 | background-color: #000; | |
66 | border: 1px solid #000; | |
67 | } | |
68 | ||
69 | @media (prefers-color-scheme: dark) { | |
70 | body { | |
71 | color: #fff; | |
72 | background: #000; | |
73 | } | |
74 | ||
75 | canvas { | |
76 | background-color: #fff; | |
77 | border: 1px solid #fff; | |
78 | } | |
79 | ||
80 | a { | |
81 | color: #5dc1fd; | |
82 | display: inline-block; | |
83 | min-height: 48px; | |
84 | } | |
85 | ||
86 | a:visited { | |
87 | color: #ed6eff; | |
88 | } | |
89 | ||
90 | pre { | |
91 | background-color: #222; | |
92 | } | |
93 | } |