1:root {
2 --bg: #ffffff;
3 --fg: #222222;
4 --fg-muted: #666666;
5 --link: #0000ff;
6 --border: #dddddd;
7 --table-header-bg: #f6f8fa;
8 --table-row-hover-bg: #f6f8fa;
9
10 --blockquote-fg: #666666;
11 --blockquote-border: #dddddd;
12
13 --ln-fg: #999999;
14 --ln-bg: #f6f8fa;
15
16 --diff-add-bg: #e6ffec;
17 --diff-add-fg: #22863a;
18 --diff-del-bg: #ffeef0;
19 --diff-del-fg: #cb2431;
20 --diff-mod-bg: #fff5b1;
21 --diff-mod-fg: #b08800;
22 --diff-gap-bg: #cbe5ff;
23 --diff-gap-fg: #0000ff;
24 --diff-fname-bg: #ffffff;
25 --diff-fname-fg: #000000;
26
27 --alert-note: blue;
28 --alert-tip: green;
29 --alert-important: purple;
30 --alert-warning: orange;
31 --alert-caution: red;
32
33 --text-red: red;
34 --text-green: green;
35
36 --pre-code-bg: #f6f8fa;
37}
38
39* { box-sizing: border-box; }
40
41body {
42 font-family: sans-serif;
43 padding: 0.5em;
44 background-color: var(--bg);
45 color: var(--fg);
46 line-height: 130%;
47}
48
49table {
50 width: 100%;
51 border: 1px solid var(--border);
52 border-collapse: collapse;
53
54 td, th {
55 text-align: left;
56 padding: 5px;
57 border: 1px solid var(--border);
58 }
59
60 tr:hover {
61 background: var(--table-row-hover-bg);
62 }
63
64 thead {
65 background: var(--table-header-bg);
66 }
67}
68
69main {
70 margin: 2em 0;
71 display: flex;
72 flex-direction: column;
73 gap: 2em;
74}
75
76a {
77 color: var(--link);
78 text-decoration: none;
79}
80a:hover {
81 text-decoration: underline;
82}
83
84pre {
85 margin: 0;
86 overflow-x: auto;
87 scrollbar-width: none;
88 white-space: pre;
89}
90pre::-webkit-scrollbar {
91 display: none;
92}
93
94blockquote {
95 margin: 1rem 0;
96 padding: 0 1rem;
97 color: var(--blockquote-fg);
98 border-left: 0.25em solid var(--blockquote-border);
99}
100
101.text-left { text-align: left; }
102.text-center { text-align: center; }
103.text-right { text-align: right; }
104.text-medium { font-weight: 500; }
105.text-bold { font-weight: bold; }
106.text-normal { font-weight: normal; }
107.text-light { font-weight: 300; }
108.text-italic { font-style: italic; }
109.text-normal-style { font-style: normal; }
110.text-oblique { font-style: oblique; }
111.text-underline { text-decoration: underline; }
112.text-line-through { text-decoration: line-through; }
113.text-no-decoration { text-decoration: none; }
114.text-uppercase { text-transform: uppercase; }
115.text-lowercase { text-transform: lowercase; }
116.text-capitalize { text-transform: capitalize; }
117.text-nowrap { white-space: nowrap; }
118.text-wrap { white-space: normal; }
119.text-break { word-break: break-word; }
120.text-reset { text-decoration: none; color: inherit; }
121
122.margin-none { margin: 0; }
123.padding-none { padding: 0; }
124
125.stats-add { color: var(--text-green); font-family: monospace; }
126.stats-del { color: var(--text-red); font-family: monospace; }
127.filetype { font-size: small; color: var(--fg-muted); }
128
129.nav-main {
130 display: flex;
131 gap: 0.4em;
132}
133
134.nav-repository {
135 display: flex;
136 justify-content: space-between;
137
138 nav {
139 display: flex;
140 gap: 0.75em;
141 }
142}
143
144.code-view {
145 border: 1px solid var(--border);
146}
147
148.diff-table {
149 table-layout: fixed;
150 width: 100%;
151 border-collapse: collapse;
152 font-family: monospace;
153
154 td {
155 padding: 0 2px;
156 border: 0;
157 overflow: hidden;
158 vertical-align: top;
159 }
160
161 .ln {
162 color: var(--ln-fg);
163 background: var(--ln-bg);
164 text-align: right;
165 user-select: none;
166 font-size: smaller;
167 padding: 0 3px !important;
168 border-left: 1px solid var(--border);
169 border-right: 1px solid var(--border);
170 }
171
172 .code {
173 width: auto;
174 pre {
175 width: 100%;
176 display: block;
177 white-space: pre-wrap;
178 word-break: break-all;
179 }
180 }
181
182 .diff-add { background-color: var(--diff-add-bg); color: var(--diff-add-fg); }
183 .diff-del { background-color: var(--diff-del-bg); color: var(--diff-del-fg); }
184 .diff-mod { background-color: var(--diff-mod-bg); color: var(--diff-mod-fg); }
185 .diff-gap {
186 background-color: var(--diff-gap-bg);
187 color: var(--diff-gap-fg);
188 border-top: 1px solid var(--border);
189 border-bottom: 1px solid var(--border);
190 }
191 .diff-fname {
192 background-color: var(--diff-fname-bg);
193 color: var(--diff-fname-fg);
194 border-top: 1px solid var(--border);
195 border-bottom: 1px solid var(--border);
196 font-family: monospace;
197 font-size: smaller;
198 font-weight: bold;
199 }
200}
201
202.file-diffs {
203 display: flex;
204 flex-direction: column;
205 gap: 1em;
206
207 summary {
208 cursor: pointer;
209 padding-bottom: 0.2em;
210 }
211
212 .diff-table {
213 font-size: small;
214 }
215}
216
217.diffstat {
218 display: flex;
219 flex-direction: column;
220 gap: 0.5em;
221
222 .summary {
223 color: var(--fg-muted);
224 font-size: small;
225 user-select: none;
226 }
227}
228
229.code-view {
230 pre { background: none !important; }
231 code > span > span:first-child {
232 color: var(--ln-fg);
233 background: var(--ln-bg);
234 border-right: 1px solid var(--border);
235 font-size: smaller;
236 }
237}
238
239.repo-links {
240 display: flex;
241 gap: 0.5em;
242 justify-content: center;
243}
244
245.group-header {
246 th {
247 background: var(--table-header-bg);
248 }
249}
250
251.readme-content {
252 pre, code { background: var(--pre-code-bg); }
253 pre { padding: 0.5em; }
254
255 .markdown-alert {
256 padding: 0.75rem 1rem;
257 color: inherit;
258 border: 1px solid;
259 border-left: 0.25em solid;
260
261 margin-block-start: 1em;
262 margin-block-end: 1em;
263
264 .markdown-alert-title {
265 display: flex;
266 align-items: center;
267 /* font-weight: 600; */
268 margin-top: 0;
269 margin-bottom: 0.5rem;
270 gap: 0.5rem;
271
272 svg {
273 fill: currentColor;
274 width: 16px;
275 height: 16px;
276 }
277 }
278
279 p { margin-bottom: 0; }
280 p:last-child { margin-bottom: 0; }
281 }
282
283 .markdown-alert-note {
284 border-color: var(--alert-note);
285 .markdown-alert-title { color: var(--alert-note); }
286 }
287
288 .markdown-alert-tip {
289 border-color: var(--alert-tip);
290 .markdown-alert-title { color: var(--alert-tip); }
291 }
292
293 .markdown-alert-important {
294 border-color: var(--alert-important);
295 .markdown-alert-title { color: var(--alert-important); }
296 }
297
298 .markdown-alert-warning {
299 border-color: var(--alert-warning);
300 .markdown-alert-title { color: var(--alert-warning); }
301 }
302
303 .markdown-alert-caution {
304 border-color: var(--alert-caution);
305 .markdown-alert-title { color: var(--alert-caution); }
306 }
307}
308
309.pagination {
310 display: flex;
311 justify-content: center;
312 align-items: center;
313 gap: 0.5em;
314 font-size: small;
315
316 a, .disabled, .current {
317 padding: 0.2em 0.6em;
318 }
319
320 .disabled {
321 color: var(--fg-muted);
322 cursor: default;
323 }
324
325 .current {
326 font-weight: bold;
327 background: var(--table-header-bg);
328 }
329}
330
331.repository-languages {
332 margin-bottom: -1em;
333}
334
335.language-bar {
336 margin-bottom: 0.5em;
337}
338
339.language-list {
340 list-style: none;
341 padding: 0;
342 margin: 0;
343 display: flex;
344 flex-wrap: wrap;
345 gap: 1em;
346 font-size: small;
347}
348
349.language-list li {
350 display: flex;
351 align-items: center;
352 gap: 0.4em;
353}
354
355.language-color {
356 display: inline-block;
357 width: 8px;
358 height: 8px;
359 border-radius: 50%;
360}
361
362.language-name {
363 font-weight: bold;
364}
365
366.language-percentage {
367 color: var(--fg-muted);
368}
369
370footer {
371 display: flex;
372 justify-content: space-between;
373 align-items: center;
374 color: var(--fg-muted);
375 font-size: small;
376
377 .footer-rss {
378 display: flex;
379 gap: 1em;
380 }
381}
382