Files: c34e6abec00814abf64ee003f1558a19da00f040 / style.css
6083 bytesRaw
1 | body { |
2 | font-family: sans-serif; |
3 | } |
4 | |
5 | * { |
6 | word-break: break-word; |
7 | } |
8 | |
9 | .screen { |
10 | position: absolute; |
11 | top: 0px; bottom: 0px; |
12 | left: 0px; right: 0px; |
13 | overflow-y: hidden; |
14 | } |
15 | |
16 | .column { |
17 | display: flex; |
18 | flex-direction: column; |
19 | } |
20 | |
21 | .row { |
22 | display: flex; |
23 | flex-direction: row; |
24 | } |
25 | |
26 | .end { |
27 | justify-content: flex-end; |
28 | } |
29 | |
30 | .wrap { |
31 | display: flex; |
32 | flex-direction: row; |
33 | flex-wrap: wrap; |
34 | } |
35 | |
36 | .no-shrink { |
37 | flex-shrink: 0; |
38 | } |
39 | |
40 | .expand { |
41 | justify-content: space-between; |
42 | } |
43 | |
44 | .scroll-y { |
45 | overflow-y: auto; |
46 | min-height: 0px; |
47 | } |
48 | |
49 | .scroll-x { |
50 | overflow-x: auto; |
51 | min-width: 0px; |
52 | } |
53 | |
54 | pre { |
55 | white-space: pre-wrap; |
56 | word-wrap: break-word; |
57 | } |
58 | |
59 | p { |
60 | margin-top: .35ex; |
61 | } |
62 | |
63 | hr { |
64 | border: solid #eee; |
65 | clear: both; |
66 | border-width: 1px 0 0; |
67 | height: 0; |
68 | margin-bottom: .9em; |
69 | } |
70 | |
71 | input, textarea { |
72 | border: none; |
73 | border-radius: .2em; |
74 | font-family: sans-serif; |
75 | } |
76 | |
77 | textarea { |
78 | padding: .5em; |
79 | } |
80 | |
81 | button { |
82 | background: #fff; |
83 | color: #666; |
84 | border: 1px solid #bbb; |
85 | border-radius: .5em; |
86 | padding: .7em; |
87 | margin: .5em; |
88 | cursor: pointer; |
89 | text-transform: uppercase; |
90 | font-weight: bold; |
91 | font-size: .7em; |
92 | } |
93 | |
94 | button:hover { |
95 | background: #ccc; |
96 | border: 1px solid #bbb; |
97 | } |
98 | |
99 | .menu { |
100 | position: absolute; |
101 | top: .5em; |
102 | right: .5em; |
103 | padding-top: .5em; |
104 | padding-bottom: .5em; |
105 | padding-right: 1em; |
106 | padding-left: 1em; |
107 | background: #f5f5f5; |
108 | border: 1px solid #eee; |
109 | box-shadow: 3px 0px 3px #ccc; |
110 | border-radius: .2em; |
111 | } |
112 | |
113 | /* scrolling feeds, threads */ |
114 | |
115 | .scroller { |
116 | width: 100%; |
117 | } |
118 | |
119 | .scroller__wrapper { |
120 | flex: 1; |
121 | max-width: 600px; |
122 | margin-left: auto; |
123 | margin-right: auto; |
124 | } |
125 | |
126 | /* compose */ |
127 | |
128 | .compose { |
129 | width: 100%; |
130 | margin-top: .5em; |
131 | margin-bottom: .5em; |
132 | box-shadow: #dadada 1px 2px 8px; |
133 | } |
134 | |
135 | .compose button { |
136 | float: right; |
137 | } |
138 | |
139 | /* messages */ |
140 | |
141 | .message { |
142 | display: block; |
143 | flex-basis: 0; |
144 | word-wrap: break-word; |
145 | display: inline-block; |
146 | border: 1px solid #eee; |
147 | margin-bottom: 1em; |
148 | } |
149 | |
150 | .message_meta input { |
151 | font-size: .8em; |
152 | } |
153 | |
154 | .message_meta { |
155 | margin-left: auto; |
156 | } |
157 | |
158 | .message_meta > * { |
159 | margin-left: .5ex; |
160 | } |
161 | |
162 | .message_actions { |
163 | float: right; |
164 | margin-right: .5ex; |
165 | margin-bottom: .5ex; |
166 | } |
167 | |
168 | .title { |
169 | padding: .5ex; |
170 | } |
171 | |
172 | .message img { |
173 | max-width: 100%; |
174 | } |
175 | |
176 | .actions > * { |
177 | padding-left: 5px; |
178 | margin-left: 1px; |
179 | } |
180 | |
181 | .actions > :not(:last-child) { |
182 | border-right: 2px solid #eee; |
183 | padding-right: 5px; |
184 | } |
185 | |
186 | .message > .title > .avatar { |
187 | margin-left: 0; |
188 | } |
189 | |
190 | .message_content { |
191 | padding: .5ex; |
192 | } |
193 | |
194 | /* -- suggest box */ |
195 | |
196 | .suggest-box > * { |
197 | display: block; |
198 | } |
199 | |
200 | .suggest-box ul { |
201 | list-style-type: none; |
202 | padding-left: -2em; |
203 | } |
204 | |
205 | .suggest-box .selected { |
206 | background: #eee; |
207 | } |
208 | |
209 | .suggest-box { |
210 | width: max-content; |
211 | background: white; |
212 | border-radius: 1em; |
213 | } |
214 | |
215 | /* avatar */ |
216 | |
217 | .avatar { |
218 | display: flex; |
219 | flex-direction: row; |
220 | } |
221 | |
222 | .avatar--large { |
223 | width: 10em; |
224 | height: 10em; |
225 | } |
226 | |
227 | .avatar--thumbnail { |
228 | width: 2.5em; |
229 | height: 2.5em; |
230 | margin-right: .5ex; |
231 | } |
232 | |
233 | .avatar--fullsize { |
234 | width: 100%; |
235 | } |
236 | |
237 | .profile { |
238 | padding: .5ex; |
239 | overflow: auto; |
240 | } |
241 | |
242 | .profile input { |
243 | width: 100%; |
244 | } |
245 | |
246 | .profile__info { |
247 | margin-left: .5em; |
248 | } |
249 | |
250 | /* lightbox - used in message-confirm */ |
251 | |
252 | .lightbox { |
253 | overflow: auto; |
254 | padding: 1.5em; |
255 | margin-top: 3em; |
256 | margin-bottom: 3em; |
257 | width: 600px; |
258 | background: #f5f5f5; |
259 | margin-left: auto; |
260 | margin-right: auto; |
261 | border: 1px solid #eee; |
262 | border-radius: .2em; |
263 | box-shadow: #dadada 1px 2px 8px; |
264 | } |
265 | |
266 | /* searchprompt */ |
267 | |
268 | .searchprompt { |
269 | float: left; |
270 | width: 85%; |
271 | height: 2em; |
272 | margin-top: .3em; |
273 | border-radius: 1em; |
274 | padding-left: .2em; |
275 | margin-left: 1em; |
276 | margin-right: 1em; |
277 | } |
278 | |
279 | /* TextNodeSearcher highlights */ |
280 | |
281 | .highlight { |
282 | background: #f5f5f5; |
283 | } |
284 | |
285 | /* avatar editor */ |
286 | |
287 | .hypercrop__canvas { |
288 | width: 100%; |
289 | } |
290 | |
291 | /* gitssb */ |
292 | |
293 | .git-table-wrapper { |
294 | max-height: 12em; |
295 | overflow: auto; |
296 | word-break: break-all; |
297 | margin: 1em 0; |
298 | } |
299 | |
300 | .git-table-wrapper table { |
301 | width: 100%; |
302 | } |
303 | |
304 | /* --- network status --- */ |
305 | |
306 | .status { |
307 | width: .7em; |
308 | height: .7em; |
309 | margin: .7em; |
310 | border-radius: 100%; |
311 | background: green; |
312 | } |
313 | |
314 | .error { |
315 | background: red; |
316 | } |
317 | |
318 | /* themes */ |
319 | |
320 | .theme { |
321 | margin-left: 1ex; |
322 | } |
323 | |
324 | .themes__form { |
325 | margin: 1ex; |
326 | } |
327 | |
328 | |
329 | /* tabs */ |
330 | |
331 | .header { |
332 | background: #f5f5f5; |
333 | border-bottom: 1px inset; |
334 | flex-shrink: 0; |
335 | } |
336 | |
337 | .header__tabs { |
338 | width: 100%; |
339 | min-width: 0px; |
340 | } |
341 | |
342 | /* --- hypertabs ------- */ |
343 | |
344 | .hypertabs__tabs { |
345 | min-width: 0px; |
346 | width: 100%; |
347 | } |
348 | |
349 | .hypertabs__tab { |
350 | overflow-x: hidden; |
351 | min-width: 0px; |
352 | width: 100%; |
353 | } |
354 | |
355 | .hypertabs__button { |
356 | overflow-x: hidden; |
357 | min-width: 0px; |
358 | width: 100%; |
359 | } |
360 | |
361 | .hypertabs__tab { |
362 | color: black; |
363 | background: #eee; |
364 | border-right: 1px solid #ddd; |
365 | border-top-left-radius: 5px; |
366 | margin-left: -3px; |
367 | border-bottom: none; |
368 | padding-top: .56em; |
369 | padding-left: 1em; |
370 | width: 100%; |
371 | } |
372 | |
373 | .hypertabs__tab > a { |
374 | color: black; |
375 | text-decoration: none; |
376 | white-space: nowrap; |
377 | font-size: .9em; |
378 | } |
379 | |
380 | .hypertabs--selected { |
381 | background: #eee; |
382 | border-top-right-radius: 5px; |
383 | z-index: 1; |
384 | } |
385 | |
386 | .hypertabs__x { |
387 | display: none; |
388 | transform: translate(-5px, -3px); |
389 | } |
390 | |
391 | .hypertabs--selected .hypertabs__x { |
392 | display: block; |
393 | } |
394 | |
395 | a:link, a:visited, a:active { |
396 | color: #0088cc; |
397 | text-decoration: none; |
398 | } |
399 | |
400 | a:hover, |
401 | a:focus { |
402 | color: #005580; |
403 | text-decoration: underline; |
404 | } |
405 | |
406 | .navbar a:link, |
407 | .navbar a:visited, |
408 | .navbar a:active { |
409 | color: #666; |
410 | font-weight: normal; |
411 | } |
412 | |
413 | .navbar a:hover, |
414 | .navbar a:focus { |
415 | color: #333; font-weight: normal; |
416 | } |
417 | |
418 | .message_content div > span { |
419 | font-size: 0.8rem; |
420 | margin-bottom: 0.7rem; |
421 | display: block; |
422 | color: #888; |
423 | } |
424 | |
425 | .message_content div > span a { |
426 | color: #005d8c; |
427 | } |
428 | |
429 | .message { |
430 | padding: 0.3rem; |
431 | border: none; |
432 | border-radius: 2px; |
433 | box-shadow: #dadada 1px 2px 8px; |
434 | } |
435 | |
436 | .header { |
437 | box-shadow: 3px 0px 3px #ccc; |
438 | } |
439 | |
440 | .hypertabs__tabs a:link, |
441 | .hypertabs__tabs a:visited, |
442 | .hypertabs__tabs a:active { |
443 | color: #666; |
444 | text-decoration: none; |
445 | } |
446 | |
447 | .hypertabs__tabs a:hover, |
448 | .hypertabs__tabs a:focus { |
449 | color: #333; |
450 | } |
451 | |
452 | .hypertabs--selected a { |
453 | font-weight: bold; |
454 | } |
455 | |
456 | .hyperprogress__liquid, .status { |
457 | background: #0088cc; |
458 | } |
459 | |
460 | .hypertabs__tab { |
461 | background: transparent; |
462 | } |
463 | |
464 | .avatar--large, .avatar--thumbnail, .avatar--fullsize { |
465 | border: 1px solid #eee; |
466 | } |
467 | |
468 |
Built with git-ssb-web