Files: bbf9e423c5c7c91fb95d8d2b7f0bd30e6615b94a / style.css
4129 bytesRaw
1 | body { |
2 | font-family: "Source Sans Pro", sans-serif; |
3 | } |
4 | |
5 | p { margin-top: .35ex;} |
6 | |
7 | .screen { |
8 | position: absolute; |
9 | top: 0px; bottom: 0px; |
10 | left: 0px; right: 0px; |
11 | overflow-y: hidden; |
12 | } |
13 | |
14 | .column { |
15 | display: flex; |
16 | flex-direction: column; |
17 | background: #f5f5f5; |
18 | min-height: 0px; |
19 | } |
20 | |
21 | .row { |
22 | display: flex; |
23 | flex-direction: row; |
24 | } |
25 | |
26 | .wrap { |
27 | display: flex; |
28 | flex-direction: row; |
29 | flex-wrap: wrap; |
30 | } |
31 | |
32 | .stretch { |
33 | flex-basis: 0; |
34 | } |
35 | |
36 | .fixed { |
37 | flex-grow: 1; |
38 | flex-shrink: 1; |
39 | } |
40 | |
41 | .scroll-y { |
42 | overflow-y: auto; |
43 | } |
44 | |
45 | .scroll-x { |
46 | overflow-x: auto; |
47 | } |
48 | |
49 | .button { |
50 | border: 2px; margin: 3px; |
51 | max-width: 50px; |
52 | overflow-x: hidden; |
53 | } |
54 | |
55 | |
56 | .message img { |
57 | max-width: 100%; |
58 | display: block; |
59 | } |
60 | |
61 | pre { |
62 | max-width: 650px; |
63 | white-space: pre-wrap; |
64 | } |
65 | |
66 | /* scrolling feeds, threads */ |
67 | |
68 | .scroller { |
69 | width: 100%; |
70 | } |
71 | |
72 | .scroller > * { |
73 | margin-left: auto; |
74 | margin-right: auto; |
75 | } |
76 | |
77 | .scroller__wrapper { |
78 | width: 100%; |
79 | } |
80 | |
81 | @media (min-width: 600px) { |
82 | .scroller__wrapper { |
83 | width: 600px; |
84 | } |
85 | } |
86 | |
87 | /* --- hypertabs ------- */ |
88 | |
89 | .hypertabs__tabs { |
90 | overflow-y: hide; |
91 | } |
92 | |
93 | .hypertabs > .row { |
94 | flex-grow: 0; flex-shrink: 0; |
95 | margin: 10px; |
96 | } |
97 | |
98 | .hypertabs__tabs > * { |
99 | max-width: 50px; |
100 | overflow-x: hidden; |
101 | margin-right: 5px; |
102 | padding-top: 1px; |
103 | } |
104 | |
105 | .hypertabs--selected { |
106 | background: white; |
107 | border: 1px solid #ccc; |
108 | padding-top: 0; |
109 | padding-left: 5px; |
110 | padding-right: 5px; |
111 | max-width: 200px; |
112 | } |
113 | |
114 | /* message id */ |
115 | |
116 | input { |
117 | margin-left: 3px; |
118 | margin-right: 3px; |
119 | border: 1px solid #eee; |
120 | } |
121 | |
122 | textarea { |
123 | border: 1px solid #eee; |
124 | } |
125 | |
126 | /* compose */ |
127 | |
128 | .compose { |
129 | width: 100%; |
130 | } |
131 | |
132 | /* messages */ |
133 | |
134 | .message { |
135 | border: 1px solid #eee; |
136 | padding: 7px; |
137 | margin-top: .5em; |
138 | background: white; |
139 | display: block; |
140 | flex-basis: 0; |
141 | max-width: 100%; |
142 | min-width: 300px; |
143 | word-wrap:break-word; |
144 | display:inline-block; |
145 | } |
146 | |
147 | .message_meta input { |
148 | border: none; |
149 | font-size: .8em; |
150 | color: #666; |
151 | background: #ddd; |
152 | } |
153 | |
154 | .message_meta { |
155 | margin-left: auto; |
156 | } |
157 | .message_meta > * { |
158 | margin-left: 5px; |
159 | } |
160 | .message_actions { |
161 | float: right; |
162 | } |
163 | |
164 | .actions > * { |
165 | padding-left: 5px; |
166 | margin-left: 1px; |
167 | } |
168 | .actions > :not(:last-child) { |
169 | border-right: 2px solid #eee; |
170 | padding-right: 5px; |
171 | } |
172 | |
173 | .message > .title > .avatar { |
174 | margin-left: 0; |
175 | } |
176 | |
177 | .message_content { |
178 | margin-top: 5px; |
179 | border-top: 1px solid #eee; |
180 | padding-top: 3px; |
181 | } |
182 | |
183 | /* -- suggest box */ |
184 | |
185 | |
186 | .suggest-box > * { |
187 | background: #f5f5f5; |
188 | border: 1px solid #ccc; |
189 | margin: 3px; |
190 | } |
191 | |
192 | .suggest-box { |
193 | width: 200px; |
194 | } |
195 | |
196 | .suggest-box ul { |
197 | list-style-type: none; |
198 | padding-left: -20px; |
199 | } |
200 | |
201 | .suggest-box .selected { |
202 | background: #ccc; |
203 | } |
204 | |
205 | .suggest-box img { |
206 | width: 40px; |
207 | } |
208 | .suggest-box,.selected img { |
209 | width: 200px; |
210 | } |
211 | /* avatar */ |
212 | |
213 | .avatar { |
214 | display: flex; |
215 | flex-direction: row; |
216 | } |
217 | |
218 | .avatar--large { |
219 | width: 256px; |
220 | height: 256px; |
221 | border: 1px solid #eee; |
222 | } |
223 | |
224 | .avatar--thumbnail { |
225 | width: 40px; |
226 | height: 40px; |
227 | margin-right: 3px; |
228 | border: 1px solid #ccc; |
229 | } |
230 | |
231 | .avatar--fullsize { |
232 | width: 100%; |
233 | } |
234 | |
235 | .profile { |
236 | background: #fff; |
237 | padding: .5em; |
238 | border: 1px solid #eee; |
239 | } |
240 | |
241 | .profile__info { |
242 | margin-left: .5em; |
243 | } |
244 | |
245 | /* lightbox - used in message-confirm */ |
246 | |
247 | .lightbox__content { |
248 | overflow: auto; |
249 | background: #fff; |
250 | width: 100%; |
251 | margin-left: auto; |
252 | margin-right: auto; |
253 | border: 1px solid #eee; |
254 | top: 2em; |
255 | bottom: 2em; |
256 | left: 2em; |
257 | right: 2em; |
258 | padding: 1em; |
259 | } |
260 | |
261 | @media (min-width: 600px) { |
262 | .lightbox__content { |
263 | width: 600px; |
264 | } |
265 | } |
266 | |
267 | .message-confirm { |
268 | background: #fff; |
269 | } |
270 | |
271 | /* searchprompt */ |
272 | |
273 | .searchprompt { |
274 | width: 250px; |
275 | margin-left: 10px; |
276 | margin-bottom: 5px; |
277 | } |
278 | |
279 | a { |
280 | color: #333; |
281 | } |
282 | |
283 | a:hover { |
284 | color: #000; |
285 | } |
286 | |
287 | /* TextNodeSearcher highlights */ |
288 | |
289 | highlight { |
290 | background: yellow; |
291 | } |
292 | |
293 | /* --- network status --- */ |
294 | |
295 | .status { |
296 | width: 20px; |
297 | height: 20px; |
298 | position: fixed; |
299 | right: 10px; |
300 | top: 10px; |
301 | background: green; |
302 | } |
303 | |
304 | .error { |
305 | background: red; |
306 | } |
307 | |
308 | /* avatar editor */ |
309 | |
310 | .hypercrop__canvas { |
311 | width: 100%; |
312 | } |
313 | |
314 | /* gitssb */ |
315 | |
316 | .git-table-wrapper { |
317 | max-height: 12em; |
318 | overflow: auto; |
319 | word-break: break-all; |
320 | margin: 1em 0; |
321 | } |
322 | |
323 | .git-table-wrapper table { |
324 | width: 100%; |
325 | } |
326 | |
327 | /* invite codes */ |
328 | |
329 | .hyperprogress__liquid { |
330 | height: 1px; |
331 | background: blue; |
332 | } |
333 | |
334 |
Built with git-ssb-web