d27b9e67de12e883ff9179aba1293175281aa3d1
[bloat] / static / style.css
1 .status-container-container {
2         margin: 12px 0 12px -4px;
3         padding: 4px;
4         border-left: 4px solid transparent;
5 }
6
7 .status-container-container:target {
8         border-color: #777777;
9 }
10
11 .status-container-container.highlight {
12         background-color: #cccccc;
13 }
14
15 .status-content {
16         margin: 4px 0;
17         max-height: 600px;
18         overflow: auto;
19 }
20
21 .status-content p {
22         margin: 0px;
23 }
24
25 .status-content img,
26 .status-image,
27 .status-video {
28         height: auto;
29         width: auto;
30         max-height: 240px;
31         max-width: 280px;
32         width: auto;
33         vertical-align: bottom;
34 }
35
36 .status-media-container {
37         margin: 4px 0;
38 }
39
40 .status-profile-img-container {
41         margin-right: 8px;
42         float: left;
43 }
44
45 .status-profile-img {
46         height: 48px;
47         width: 48px;
48         vertical-align: top;
49 }
50
51 .status {
52         overflow: auto;
53 }
54
55 .status-dname {
56         font-weight: 800;
57 }
58
59 .status-uname {
60         font-style: italic;
61         font-size: 10pt;
62 }
63
64 .status-action-container {
65         margin-top: 4px;
66 }
67
68 .status-action {
69         display: inline-block;
70         margin-right: 16px;
71 }
72
73 .status-action-last {
74         margin-right: 4px;
75 }
76
77 .status-action form {
78         display: inline-block;
79 }
80
81 .status-action a {
82         display: inline-block;
83 }
84
85 .status-action * {
86         vertical-align: middle;
87 }
88
89 .status-action a.status-time {
90         width: auto;
91 }
92
93 .page-title {
94         font-size: 18pt;
95 }
96
97 .post-form {
98         margin: 4px 0;
99 }
100
101 .post-form>div {
102         margin-bottom: 4px;
103 }
104
105 .signin-form {
106         margin: 8px 0;
107 }
108
109 .signin-form input {
110         margin: 4px 0;
111 }
112
113 .retweet-info {
114         margin: 0 0 2px 24px;   
115 }
116
117 .retweet-info .status-profile-img {
118         height: 24px;
119         width: 24px;
120         vertical-align: middle;
121 }
122
123 .retweet-info .status-dname{
124         margin-left: 4px
125 }
126
127 .post-content {
128         padding: 4px;
129         font-size: 11pt;
130         font-family: initial;
131         max-width: 100%;
132 }
133
134 .pagination {
135         margin: 4px;
136 }
137
138 .pagination a {
139         margin: 0 8px;
140 }
141
142 .notification-container {
143         margin: 16px 0 16px -4px;
144         padding: 0 4px;
145         border-left: 4px solid transparent;
146 }
147
148 .notification-container.unread {
149         border-color: #777777;
150 }
151
152 .notification-info-text span {
153         vertical-align: middle;
154 }
155
156 .notification-follow {
157         overflow: auto;
158 }
159
160 .notification-follow-uname {
161         margin-top: 8px;
162 }
163
164 .notification-time {
165         margin-left: 8px;
166 }
167
168 .status-reply-to {
169         display: inline-block;
170 }
171
172 .status-reply-to-link {
173         font-size: 10pt
174 }
175
176 .status-reply-container .fa {
177         font-size: 10pt;
178         vertical-align: sub;
179         margin-right: -2px;
180 }
181
182 .status-reply-text {
183         font-size: 10pt;
184 }
185
186 .status-reply {
187         display: inline-block;
188 }
189
190 .status-reply-link {
191         font-size: 10pt;
192 }
193
194 .status-reply-info-divider {
195         margin: 0 4px;
196 }
197
198 .post-content-container {
199         padding-right: 8px;
200 }
201
202 .error-text {
203         margin: 8px 0;
204 }
205
206 .post-attachment-div {
207         margin: 2px 0;
208 }
209
210 .user-profile-img-container {
211         display: inline-block;
212         margin: 0 4px 0 0;
213 }
214
215 .user-profile-details-container {
216         display: inline-block;
217         vertical-align: top;
218 }
219
220 .user-profile-details-container>div {
221         margin-bottom: 4px;
222 }
223
224 .user-profile-img {
225         height: 96px;
226         width: 96px;
227         vertical-align: top;
228 }
229
230 .user-profile-decription {
231         margin: 4px 0;
232 }
233
234 .d-inline {
235         display: inline;
236 }
237
238 .btn-link {
239         border: none;
240         outline: none;
241         background: none;
242         cursor: pointer;
243         padding: 0;
244         font-family: inherit;
245         font-size: inherit;
246 }
247
248 a, .btn-link {
249         color: #464acc;
250         text-decoration: none;
251 }
252
253 a:hover,
254 .btn-link:hover {
255         color: #9899c4;
256 }
257
258 .status-visibility {
259         margin-left: 4px;
260         display: inline-block;
261         color: #222222;
262         font-size: 8pt;
263 }
264
265 .remote-link {
266         margin-left: 4px;
267         font-size: 8pt;
268 }
269
270 .img-link {
271         display: inline-block;
272         position: relative;
273         margin: 2.5px 0;
274 }
275
276 .status-profile-img-container .img-link {
277         width: 48px;
278         overflow: hidden;
279 }
280
281 .status-nsfw-overlay {
282         height: 100%;
283         width: 100%;
284         background: black;
285         position: absolute;
286         top: 0;
287         left: 0;
288 }
289
290 .img-link:hover .status-nsfw-overlay {
291         display: none;
292 }
293
294 .status-video-container {
295         display: inline-block;
296         position: relative;
297         margin: 2.5px 0;
298 }
299
300 .status-video-container:hover .status-nsfw-overlay {
301         display: none;
302 }
303
304 .post-form-field>* {
305   vertical-align: middle;
306 }
307
308 .emoji-item {
309         min-width: 220px;
310         display: inline-block;
311         margin: 4px 0;
312 }
313
314 img.emoji {
315         height: auto;
316         width: auto;
317         max-height: 32px;
318         max-width: 32px;
319         vertical-align: middle;
320 }
321
322 .status-dname img.emoji {
323         height: 24px;
324 }
325
326 .emoji-shortcode {
327         vertical-align: middle;
328         display: inline-block;
329 }
330
331 .post-form-emoji-link {
332         margin-left: 4px;
333 }
334
335 .user-info-img {
336         height: 64px;
337         width: 64px;
338         vertical-align: middle;
339 }
340
341 .user-info-img-container {
342         float: left;
343         margin-right: 8px;
344 }
345
346 .user-info-details-container {
347         overflow: auto;
348 }
349
350 .user-info-details-container>div {
351         margin-bottom: 4px;
352 }
353
354 .nav-link {
355         margin-right: 2px;
356 }
357
358 .user-list-container {
359         margin: 8px 0;
360 }
361
362 .user-list-item>div {
363         display: inline-block;
364         vertical-align: top;
365         margin: 0 4px 8px 0;
366 }
367
368 #settings-form {
369         margin: 8px 0;
370 }
371
372 .settings-form-field {
373         margin: 4px 0;
374 }
375
376 .settings-form-field * {
377         vertical-align: middle;
378 }
379
380 #settings-form button[type=submit] {
381         margin-top: 8px;
382 }
383
384 #reply-popup {
385         position: absolute;
386         background: #ffffff;
387         border: 1px solid #aaaaaa;
388         padding: 4px 8px;
389         z-index: 3;
390         margin: 0;
391 }
392
393 #reply-to-popup {
394         position: absolute;
395         background: #ffffff;
396         border: 1px solid #aaaaaa;
397         padding: 4px 8px;
398         z-index: 3;
399         margin: 0;
400 }
401
402 .search-form {
403         margin: 16px 0 16px 0;
404 }
405
406 .more-container {
407         position: relative;
408         display: inline-block;
409         z-index: 1;
410 }
411
412 .more-content {
413         display: none;
414         position: absolute;
415         background-color: #ffffff;
416         padding: 2px 4px;
417         border: 1px solid #aaaaaa;
418         right: 0;
419 }
420
421 .more-container:hover .more-content {
422         display: block;
423 }
424
425 .more-link {
426         font-size: 8pt;
427         display: block;
428         margin: 2px;
429 }
430
431 .poll-form button[type=submit] {
432         margin-top: 6px;
433 }
434
435 .poll-info {
436         margin-top: 6px;
437 }
438
439 .notification-title-container>* {
440         display: inline;
441 }
442
443 .notification-title {
444         font-size: 18pt;
445         margin-right: 8px;
446 }
447
448 .notification-refresh {
449         margin-right: 8px;
450 }
451
452 .no-data-found {
453         margin: 12px 0;
454 }
455
456 .signout {
457         display: inline;
458 }
459
460 .signin-desc {
461         margin: 8px 0 16px 0;
462 }
463
464 .dark {
465         background-color: #222222;
466         background-image: none;
467         color: #eaeaea;
468 }
469
470 .dark a {
471         color: #81a2be;
472 }
473
474 .dark #post-content {
475         background-color: #333333;
476         border: 1px solid #444444;
477         color: #eaeaea;
478 }
479
480 .dark #reply-popup,
481 .dark #reply-to-popup {
482         background-color: #222222;
483         border-color: #444444;
484 }
485
486 .dark .status-container-container.highlight {
487         background-color: #333333;
488 }
489
490 .dark .btn-link {
491         color: #81a2be;
492 }
493
494 .dark a:hover,
495 .dark .btn-link:hover {
496         color: #497091;
497 }
498
499 .dark .status-visibility {
500         color: #eaeaea;
501 }
502
503 .dark .more-content {
504         background-color: #222222;
505         border-color: #444444;
506 }