Files: 2f3fa2face6b2be68c4502ddf460be8c0783d0bc / style.css
4545 bytesRaw
1 | body { |
2 | font-family: sans-serif; |
3 | color: #222; |
4 | } |
5 | |
6 | h1, h2, h3, h4, h5, h6, p, ul, ol { |
7 | margin-top: .35em; |
8 | } |
9 | |
10 | h1 { font-size: 1.2em; } |
11 | h2 { font-size: 1.18em; } |
12 | h3 { font-size: 1.15em; } |
13 | h4 { font-size: 1.12em; } |
14 | h5 { font-size: 1.1em; } |
15 | h6 { font-size: 1em; } |
16 | |
17 | * { |
18 | word-break: break-word; |
19 | } |
20 | |
21 | a:link, a:visited, a:active { |
22 | color: #0088cc; |
23 | text-decoration: none; |
24 | } |
25 | |
26 | a:hover, |
27 | a:focus { |
28 | color: #005580; |
29 | text-decoration: underline; |
30 | } |
31 | |
32 | .column { |
33 | display: flex; |
34 | flex-direction: column; |
35 | min-height:0px; |
36 | } |
37 | |
38 | .row { |
39 | display: flex; |
40 | flex-direction: row; |
41 | min-height:0px; |
42 | } |
43 | |
44 | .end { |
45 | justify-content: flex-end; |
46 | } |
47 | |
48 | .wrap { |
49 | display: flex; |
50 | flex-direction: row; |
51 | flex-wrap: wrap; |
52 | } |
53 | |
54 | .no-shrink { |
55 | flex-shrink: 0; |
56 | } |
57 | |
58 | .expand { |
59 | justify-content: space-between; |
60 | } |
61 | |
62 | .scroll-y { |
63 | overflow-y: auto; |
64 | min-height: 0px; |
65 | } |
66 | |
67 | .scroll-x { |
68 | overflow-x: auto; |
69 | min-width: 0px; |
70 | } |
71 | |
72 | pre { |
73 | white-space: pre-wrap; |
74 | word-wrap: break-word; |
75 | } |
76 | |
77 | .wide { |
78 | width: 100%; |
79 | } |
80 | |
81 | p { |
82 | margin-top: .35ex; |
83 | } |
84 | |
85 | hr { |
86 | border: solid #eee; |
87 | clear: both; |
88 | border-width: 1px 0 0; |
89 | height: 0; |
90 | margin-bottom: .9em; |
91 | } |
92 | |
93 | input, textarea { |
94 | border: none; |
95 | border-radius: .2em; |
96 | font-family: sans-serif; |
97 | } |
98 | |
99 | input:focus, .compose:focus, button:focus { |
100 | outline: none; |
101 | border-color: #0088cc; |
102 | box-shadow: 0 0 4px #0088cc; |
103 | } |
104 | |
105 | textarea { |
106 | padding: .5em; |
107 | font-size: 1em; |
108 | } |
109 | |
110 | textarea:focus { |
111 | outline: none; |
112 | border-color: none; |
113 | } |
114 | |
115 | button { |
116 | background: #fff; |
117 | color: #666; |
118 | border: 1px solid #bbb; |
119 | border-radius: .5em; |
120 | padding: .7em; |
121 | margin: .5em; |
122 | cursor: pointer; |
123 | text-transform: uppercase; |
124 | font-weight: bold; |
125 | font-size: .7em; |
126 | } |
127 | |
128 | button:hover { |
129 | background: #ccc; |
130 | border: 1px solid #bbb; |
131 | } |
132 | |
133 | .menu { |
134 | position: absolute; |
135 | top: .5em; |
136 | right: .5em; |
137 | padding-top: .5em; |
138 | padding-bottom: .5em; |
139 | padding-right: 1em; |
140 | padding-left: 1em; |
141 | background: #f5f5f5; |
142 | border: 1px solid #eee; |
143 | border-radius: .2em; |
144 | z-index: 5; |
145 | } |
146 | |
147 | /* scrolling feeds, threads */ |
148 | |
149 | .scroller { |
150 | width: 100%; |
151 | } |
152 | |
153 | .scroller__wrapper { |
154 | flex: 1; |
155 | max-width: 600px; |
156 | margin-left: auto; |
157 | margin-right: auto; |
158 | } |
159 | |
160 | /* messages */ |
161 | /* is .title used any more? */ |
162 | |
163 | .title { |
164 | padding: .5ex; |
165 | } |
166 | |
167 | .emoji { |
168 | height: 1em; |
169 | width: 1em; |
170 | vertical-align: top; |
171 | } |
172 | |
173 | |
174 | |
175 | /* avatar */ |
176 | |
177 | .avatar--large, |
178 | .avatar--thumbnail, |
179 | .avatar--fullsize { |
180 | border: 1px solid #eee; |
181 | } |
182 | |
183 | .avatar--large { |
184 | width: 10em; |
185 | height: 10em; |
186 | } |
187 | |
188 | .avatar--thumbnail { |
189 | width: 2.5em; |
190 | height: 2.5em; |
191 | float: left; |
192 | margin: 0 .25ex; |
193 | } |
194 | |
195 | .\.meta .avatar--thumbnail { |
196 | width: 1.9em; |
197 | height: 1.9em; |
198 | } |
199 | |
200 | .avatar--fullsize { |
201 | width: 50%; |
202 | } |
203 | |
204 | .profile { |
205 | padding: .5ex; |
206 | overflow: auto; |
207 | } |
208 | |
209 | .profile input { |
210 | width: 100%; |
211 | } |
212 | |
213 | .profile__info { |
214 | margin-left: .5em; |
215 | } |
216 | |
217 | /* lightbox - used in message-confirm */ |
218 | |
219 | .lightbox { |
220 | position: fixed; |
221 | left: 0px; |
222 | right: 0px; |
223 | top: 50px; |
224 | overflow: auto; |
225 | width: 650px; |
226 | max-width: 100%; |
227 | padding: 25px; |
228 | margin: auto; |
229 | |
230 | z-index: 2; |
231 | |
232 | background: #f5f5f5; |
233 | border: 1px solid #eee; |
234 | border-radius: .2em; |
235 | } |
236 | |
237 | /* searchprompt */ |
238 | |
239 | .searchprompt { |
240 | } |
241 | |
242 | /* TextNodeSearcher highlights */ |
243 | |
244 | highlight { |
245 | background: #ff8; |
246 | } |
247 | |
248 | /* avatar editor */ |
249 | |
250 | .hypercrop__canvas { |
251 | width: 100%; |
252 | } |
253 | |
254 | /* gitssb */ |
255 | |
256 | .git-table-wrapper { |
257 | max-height: 12em; |
258 | overflow: auto; |
259 | word-break: break-all; |
260 | margin: 1em 0; |
261 | } |
262 | |
263 | .git-table-wrapper table { |
264 | width: 100%; |
265 | } |
266 | |
267 | /* --- network status --- */ |
268 | |
269 | .status { |
270 | width: .7em; |
271 | height: .7em; |
272 | margin: .7em; |
273 | border-radius: 100%; |
274 | background: #08c; |
275 | } |
276 | |
277 | /* tabs */ |
278 | |
279 | .header { |
280 | background: #f5f5f5; |
281 | border-bottom: 1px inset; |
282 | flex-shrink: 0; |
283 | } |
284 | |
285 | .header__tabs { |
286 | width: 100%; |
287 | min-width: 0px; |
288 | } |
289 | |
290 | /* --- hypertabs ------- */ |
291 | |
292 | .hypertabs__tabs { |
293 | min-width: 0px; |
294 | width: 100%; |
295 | } |
296 | |
297 | .hypertabs__tab { |
298 | overflow-x: hidden; |
299 | min-width: 0px; |
300 | width: 100%; |
301 | } |
302 | |
303 | .hypertabs__button { |
304 | overflow-x: hidden; |
305 | min-width: 0px; |
306 | width: 100%; |
307 | } |
308 | |
309 | .hypertabs__tab { |
310 | color: black; |
311 | background: #f5f5f5; |
312 | border-top-left-radius: 5px; |
313 | margin-left: -3px; |
314 | border-bottom: none; |
315 | padding-top: .56em; |
316 | padding-left: 1em; |
317 | border-left: 1px solid #ddd; |
318 | width: 100%; |
319 | } |
320 | |
321 | .hypertabs__tab > a { |
322 | color: #666; |
323 | text-decoration: none; |
324 | white-space: nowrap; |
325 | font-size: .9em; |
326 | } |
327 | |
328 | .hypertabs--selected { |
329 | font-weight: bold; |
330 | background: #eee; |
331 | border-top-right-radius: 5px; |
332 | z-index: 1; |
333 | } |
334 | |
335 | .hypertabs__x { |
336 | display: none; |
337 | transform: translate(-4px, -3px); |
338 | } |
339 | |
340 | .hypertabs--selected .hypertabs__x { |
341 | display: block; |
342 | } |
343 | |
344 | /* progress bar */ |
345 | |
346 | .hyperprogress__bar { |
347 | background: darkgrey; |
348 | } |
349 | .hyperprogress__liquid { |
350 | background: lightblue; |
351 | } |
352 | |
353 | |
354 |
Built with git-ssb-web