static/style.css (view raw)
1:root {
2 --light: #f4f4f4;
3 --cyan: #509c93;
4 --light-gray: #eee;
5 --medium-gray: #ddd;
6 --gray: #6a6a6a;
7 --dark: #444;
8 --darker: #222;
9
10 --sans-font: "InterVar", -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", sans-serif;
11 --display-font: "InterDisplay", -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", sans-serif;
12 --mono-font: 'SF Mono', SFMono-Regular, ui-monospace, 'DejaVu Sans Mono', 'Roboto Mono', Menlo, Consolas, monospace;
13}
14
15html {
16 background: var(--light);
17 -webkit-text-size-adjust: none;
18 font-family: var(--sans-font);
19}
20
21pre {
22 font-family: var(--mono-font);
23}
24
25::selection {
26 background: var(--medium-gray);
27 opacity: 0.3;
28}
29
30* {
31 box-sizing: border-box;
32 padding: 0;
33 margin: 0;
34}
35
36body {
37 max-width: 750px;
38 padding: 0 13px;
39 margin: 40px auto;
40}
41
42main, footer {
43 font-size: 1rem;
44 padding: 0;
45 line-height: 160%;
46}
47
48main h1, h2, h3, strong {
49 font-family: var(--display-font);
50 font-weight: 500;
51}
52
53strong {
54 font-weight: 500;
55}
56
57main h1 {
58 font-size: 20px;
59 padding: 10px 0 10px 0;
60}
61
62main h2 {
63 font-size: 18px;
64}
65
66main h2, h3 {
67 padding: 20px 0 15px 0;
68}
69
70nav {
71 padding: 0.4rem 0 1.5rem 0;
72}
73
74nav ul {
75 padding: 0;
76 margin: 0;
77 list-style: none;
78 padding-bottom: 20px;
79}
80
81nav ul li {
82 padding-right: 10px;
83 display: inline-block;
84}
85
86a {
87 margin: 0;
88 padding: 0;
89 box-sizing: border-box;
90 text-decoration: none;
91 word-wrap: break-word;
92}
93
94a {
95 color: var(--darker);
96 border-bottom: 1.5px solid var(--medium-gray);
97}
98
99a:hover {
100 border-bottom: 1.5px solid var(--gray);
101}
102
103.index {
104 padding-top: 2em;
105 display: grid;
106 grid-template-columns: 6em 1fr minmax(0, 7em);
107 grid-row-gap: 0.5em;
108 min-width: 0;
109}
110
111.clone-url {
112 padding-top: 2rem;
113}
114
115.clone-url pre {
116 color: var(--dark);
117 white-space: pre-wrap;
118}
119
120.desc {
121 color: var(--gray);
122 font-style: italic;
123}
124
125.tree {
126 display: grid;
127 grid-template-columns: 8em minmax(0, 1fr);
128 grid-row-gap: 0.5em;
129 grid-column-gap: 1em;
130 min-width: 0;
131}
132
133.log {
134 display: grid;
135 grid-template-columns: 20rem minmax(0, 1fr);
136 grid-row-gap: 0.8em;
137 grid-column-gap: 8rem;
138 margin-bottom: 2em;
139 padding-bottom: 1em;
140 border-bottom: 1.5px solid var(--medium-gray);
141}
142
143.log pre {
144 white-space: pre-wrap;
145}
146
147.mode {
148 font-family: var(--mono-font);
149}
150
151.readme pre {
152 white-space: pre-wrap;
153}
154
155.readme {
156 background: var(--light-gray);
157 padding: 0.5rem;
158}
159
160.diff {
161 margin: 1rem 0 1rem 0;
162 padding: 1rem 0 1rem 0;
163 border-bottom: 1.5px solid var(--medium-gray);
164}
165
166.diff pre {
167 overflow: scroll;
168}
169
170.diff-stat {
171 padding: 1rem 0 1rem 0;
172}
173
174.commit-email:before {
175 content: '<';
176}
177
178.commit-email:after {
179 content: '>';
180}
181
182.commit {
183 margin-bottom: 1rem;
184}
185
186.commit pre {
187 padding-bottom: 1rem;
188 white-space: pre-wrap;
189}
190
191.diff-stat ul li {
192 list-style: none;
193 padding-left: 0.5em;
194}
195
196.diff-add {
197 color: green;
198}
199
200.diff-del {
201 color: red;
202}
203
204.diff-noop {
205 color: var(--gray);
206}
207
208.ref {
209 font-family: var(--display-font);
210 font-size: 14px;
211 color: var(--gray);
212 display: inline-block;
213 padding-top: 0.7em;
214}
215
216.refs pre {
217 white-space: pre-wrap;
218}
219
220.refs strong {
221 padding-right: 1em;
222}
223
224.line-numbers {
225 white-space: pre-line;
226 -moz-user-select: -moz-none;
227 -khtml-user-select: none;
228 -webkit-user-select: none;
229 -o-user-select: none;
230 user-select: none;
231}
232
233.file-wrapper {
234 display: flex;
235 flex-direction: row;
236 grid-template-columns: 1rem minmax(0, 1fr);
237 gap: 1rem;
238 padding: 0.5rem;
239 background: var(--light-gray);
240}
241
242.file-content {
243 background: var(--light-gray);
244 overflow-y: hidden;
245 overflow-x: auto;
246}
247
248.diff-type {
249 color: var(--gray);
250}
251
252.commit-info {
253 color: var(--gray);
254 padding-bottom: 1.5rem;
255 font-size: 0.85rem;
256}
257
258@media (max-width: 600px) {
259 .index {
260 grid-row-gap: 0.8em;
261 }
262
263 .log {
264 grid-template-columns: 1fr;
265 grid-row-gap: 0em;
266 }
267
268 .index {
269 grid-template-columns: 1fr;
270 grid-row-gap: 0em;
271 }
272
273 .index-name:not(:first-child) {
274 padding-top: 1.5rem;
275 }
276
277 .commit-info:not(:last-child) {
278 padding-bottom: 1.5rem;
279 }
280
281 pre {
282 font-size: 0.8rem;
283 }
284}