static/style.css (view raw)
1:root {
2 --bg: #fff;
3 --cyan: #509c93;
4 --light-gray: #eee;
5 --gray: #6a6a6a;
6 --code: #666;
7 --dark: #444;
8 --darker: #222;
9 --code-bg: #0000000a;
10}
11
12* {
13 box-sizing: border-box;
14 text-decoration: none;
15 padding: 0;
16 margin: 0;
17}
18
19main {
20 font-family: serif;
21 font-size: 16px;
22 padding: 0;
23 margin: 10px;
24 line-height: 160%;
25}
26
27main h1 {
28 font-size: 25px;
29 padding: 10px 0 10px 0;
30}
31
32main h2, h3 {
33 padding: 20px 0 15px 0;
34}
35
36
37.icons img {
38 max-height: 2.5rem;
39 display: inline-block;
40 vertical-align: middle;
41 image-orientation: from-image;
42 max-width: 100%;
43 padding: 0 0 5px 3px;
44 cursor: pointer;
45}
46
47a {
48 margin: 0;
49 padding: 0;
50 box-sizing: border-box;
51 text-decoration: none;
52 word-wrap: break-word;
53}
54
55main a {
56 color: var(--darker);
57 text-decoration: underline;
58}
59
60table a {
61 text-decoration: none;
62}
63
64table a:hover {
65 text-decoration: underline;
66}
67
68body {
69 max-width: 640px;
70 padding: 0 10px;
71 margin: 40px auto;
72}
73
74main article img {
75 max-width: 100%;
76 display: block;
77 margin: 0 0 15px 0;
78}
79
80main ul, main ol {
81 margin: 0 30px 7px 30px;
82}
83
84main ul ul {
85 margin-bottom: 0
86}
87
88.subtitle {
89 font-style: italic;
90 font-weight: normal;
91 font-variant: unset;
92 color: var(--dark);
93 padding: 0 0 20px 0;
94}
95
96.muted {
97 color: var(--gray);
98}
99.muted a {
100 color: var(--cyan);
101 text-decoration: underline;
102}
103
104article p {
105 padding: 7px 0 7px 0;
106}
107
108article a {
109 color: var(--cyan);
110}
111
112pre {
113 overflow-x: auto;
114 overflow-y: hidden;
115 padding: 10px;
116 min-width: 0;
117 background-color: var(--code-bg) !important;
118 font-size: 15px !important;
119 margin-bottom: 10px;
120}
121
122pre > code {
123 color: var(--code);
124}
125
126.post-date {
127 color: var(--gray);
128}
129
130table {
131 width: 100%;
132}
133
134.index-date {
135 white-space: nowrap;
136 vertical-align: baseline;
137 color: var(--gray);
138}
139
140.index-post {
141 padding-bottom: 7px;
142}
143
144nav {
145 float: right;
146 transform: translateY(30%);
147}
148
149hr {
150 max-width: 100%;
151 text-align: left;
152 margin: 20px 0 20px 0;
153}
154
155footer {
156 margin: 20px 0 40px 10px;
157}
158
159header img {
160 transform: translateY(-10%);
161}
162
163.post-date {
164 color: var(--gray);
165}
166
167blockquote {
168 margin: 7px 0 7px 0;
169}
170blockquote p {
171 font-style: italic;
172 color: var(--darker);
173 padding-left: 20px;
174 border-left: 3px solid var(--gray);
175}