Eric Bower
·
2026-09-14
1*,
2::before,
3::after {
4 box-sizing: border-box;
5}
6
7::-moz-focus-inner {
8 border-style: none;
9 padding: 0;
10}
11:-moz-focusring {
12 outline: 1px dotted ButtonText;
13}
14:-moz-ui-invalid {
15 box-shadow: none;
16}
17
18:root {
19 --line-height: 1.3rem;
20 --grid-height: 0.65rem;
21}
22
23html {
24 background-color: var(--bg-color);
25 color: var(--text-color);
26 font-size: 16px;
27 line-height: var(--line-height);
28 font-family:
29 -apple-system,
30 BlinkMacSystemFont,
31 "Segoe UI",
32 Roboto,
33 Oxygen,
34 Ubuntu,
35 Cantarell,
36 "Fira Sans",
37 "Droid Sans",
38 "Helvetica Neue",
39 Arial,
40 sans-serif,
41 "Apple Color Emoji",
42 "Segoe UI Emoji",
43 "Segoe UI Symbol";
44 -webkit-text-size-adjust: 100%;
45 -moz-tab-size: 4;
46 -o-tab-size: 4;
47 tab-size: 4;
48}
49
50body {
51 margin: 0 auto;
52 padding: 0 1rem;
53}
54
55img {
56 max-width: 100%;
57 height: auto;
58}
59
60b,
61strong {
62 font-weight: bold;
63}
64
65code,
66kbd,
67samp,
68pre {
69 font-family: monospace;
70}
71
72code,
73kbd,
74samp {
75 border: 2px solid var(--code);
76}
77
78pre > code {
79 background-color: inherit;
80 padding: 0;
81 border: none;
82 border-radius: 0;
83}
84
85code {
86 font-size: 90%;
87 border-radius: 0.3rem;
88 padding: 0.025rem 0.3rem;
89 border: 1px solid var(--border);
90}
91
92pre {
93 border: 1px solid var(--border);
94 padding: var(--grid-height);
95 border-radius: 1px;
96 overflow-x: auto;
97}
98
99h1,
100h2,
101h3,
102h4 {
103 font-style: normal;
104 font-size: 1rem;
105 font-weight: bold;
106 line-height: var(--line-height);
107 margin: 0 0 var(--grid-height) 0;
108 padding: 0;
109 border: 0;
110}
111
112path {
113 fill: var(--text-color);
114}
115
116a {
117 text-decoration: none;
118 color: var(--text-color);
119}
120
121a:hover,
122a:visited:hover {
123 color: var(--visited);
124 text-decoration: underline;
125}
126
127a:visited {
128 color: var(--text-color);
129}
130
131header {
132 margin: 1rem auto;
133}
134
135p {
136 margin-top: var(--line-height);
137 margin-bottom: var(--line-height);
138}
139
140footer {
141 text-align: center;
142}
143
144.font-bold {
145 font-weight: bold;
146}
147
148.mono {
149 font-family: monospace;
150}
151
152.text-sm {
153 font-size: 0.8rem;
154}
155
156.flex {
157 display: flex;
158}
159
160.flex-col {
161 flex-direction: column;
162}
163
164.flex-wrap {
165 flex-wrap: wrap;
166}
167
168.items-center {
169 align-items: center;
170}
171
172.m-0 {
173 margin: 0;
174}
175
176.mb {
177 margin-bottom: var(--grid-height);
178}
179
180.mb-0 {
181 margin-bottom: 0;
182}
183
184.my {
185 margin-top: var(--grid-height);
186 margin-bottom: var(--grid-height);
187}
188
189.px {
190 padding-left: 0.5rem;
191 padding-right: 0.5rem;
192}
193
194.py {
195 padding-top: var(--grid-height);
196 padding-bottom: var(--grid-height);
197}
198
199.justify-between {
200 justify-content: space-between;
201}
202
203.justify-center {
204 justify-content: center;
205}
206
207.gap {
208 gap: var(--grid-height);
209}
210
211.gap-2 {
212 gap: var(--line-height);
213}
214
215.group {
216 display: flex;
217 flex-direction: column;
218 gap: var(--grid-height);
219}
220
221.group-2 {
222 display: flex;
223 flex-direction: column;
224 gap: var(--line-height);
225}
226
227.flex-1 {
228 flex: 1;
229}
230
231.container {
232 max-width: 900px;
233 margin: 0 auto;
234}
235
236.box {
237 border: 2px solid var(--grey-light);
238 padding: var(--grid-height);
239}
240
241.border-b {
242 border-bottom: 1px solid var(--border);
243}
244
245.border-b:last-child {
246 border-bottom: 0;
247}
248
249.box {
250 margin: 1rem 0;
251 padding: var(--grid-height);
252 border: 1px solid var(--border);
253}
254
255.border-visited {
256 border-color: var(--visited);
257}
258
259.tree-size {
260 width: 60px;
261 text-align: right;
262}
263
264.tree-path {
265 text-wrap: wrap;
266}
267
268.sticky {
269 position: sticky;
270 top: 0;
271 left: 0;
272 background-color: var(--bg-color);
273}
274
275.white-space-bs {
276 white-space: break-spaces;
277}
278
279.btn-nav {
280 border-radius: 4px;
281 padding: 6px 10px;
282 border: 1px solid var(--border);
283}
284
285.btn-nav:hover, .btn-active {
286 border-color: var(--visited);
287 text-decoration: none;
288 color: var(--text-color);
289}
290
291@media only screen and (max-width: 900px) {
292 body {
293 padding: 0 0.5rem;
294 }
295
296 header {
297 margin: 0;
298 }
299
300 .flex-collapse {
301 flex-direction: column;
302 }
303
304 .tree-commit {
305 display: none;
306 }
307}
308
309.color-green {
310 color: var(--success);
311}
312
313.color-red {
314 color: var(--admin);
315}
316
317.chroma .gi {
318 font-weight: normal !important;
319}
320
321.diff-container {
322 width: 100%;
323 overflow-x: auto;
324 border: 1px solid var(--border);
325 border-radius: 4px;
326 margin: var(--grid-height) 0;
327}
328
329.diff-table {
330 width: 100%;
331 border-collapse: collapse;
332 font-family: monospace;
333 font-size: 0.88em;
334 line-height: var(--line-height);
335 tab-size: 4;
336 margin: 0;
337}
338
339.diff-line {
340 vertical-align: top;
341}
342
343.diff-num {
344 width: 1%;
345 min-width: 2.5rem;
346 padding: 0 0.5rem;
347 text-align: right;
348 color: var(--diff-num-text, var(--grey-light));
349 user-select: none;
350 -webkit-user-select: none;
351 font-size: 0.85em;
352 white-space: nowrap;
353 scroll-margin-top: 4rem;
354}
355
356.diff-num a {
357 color: inherit;
358 text-decoration: none;
359 display: block;
360}
361
362.diff-num a:hover {
363 color: var(--link-color);
364 text-decoration: underline;
365}
366
367.diff-num-old {
368 border-right: 1px solid transparent;
369}
370
371.diff-num-new {
372 border-right: 1px solid var(--border);
373}
374
375.diff-line:has(.diff-num:target),
376.diff-line:target {
377 background-color: rgba(189, 147, 249, 0.2) !important;
378 outline: 1px solid var(--visited);
379}
380
381.diff-gutter {
382 width: 1%;
383 min-width: 1.2rem;
384 padding: 0 0.25rem;
385 text-align: center;
386 user-select: none;
387 -webkit-user-select: none;
388 font-weight: bold;
389}
390
391.diff-code {
392 padding: 0 0.5rem;
393 white-space: pre;
394 font-family: inherit;
395 width: 100%;
396}
397
398.diff-line-add {
399 background-color: var(--diff-add-bg, rgba(102, 248, 89, 0.12));
400}
401
402.diff-line-add .diff-gutter {
403 color: var(--diff-add-gutter, var(--success));
404}
405
406.diff-line-delete {
407 background-color: var(--diff-del-bg, rgba(243, 139, 168, 0.12));
408}
409
410.diff-line-delete .diff-gutter {
411 color: var(--diff-del-gutter, var(--admin));
412}
413
414.diff-line-hunk {
415 background-color: var(--diff-hunk-bg, rgba(139, 233, 253, 0.08));
416}
417
418.diff-line-hunk .diff-code,
419.diff-line-hunk .diff-num {
420 color: var(--diff-hunk-text, var(--link-color));
421}
422