liquid_feedback_frontend
view static/style.css @ 7:3941792e8be6
Version beta3
Table allowed_policy is respected while creating new issues
Broken vote now/later link is not shown anymore (until it's implemented)
More user friendly error page
Minor spelling error corrected
Table allowed_policy is respected while creating new issues
Broken vote now/later link is not shown anymore (until it's implemented)
More user friendly error page
Minor spelling error corrected
author | bsw |
---|---|
date | Sat Jan 02 12:00:00 2010 +0100 (2010-01-02) |
parents | 8d91bccab0bf |
children | 374bbc2ff102 |
line source
1 /*************************************************************************
2 * Some global definitions
3 */
5 body, th, td {
6 font-family: sans-serif;
7 font-size: 14px;
8 padding: 0;
9 margin: 0;
10 }
12 body, a {
13 color: #000;
14 }
16 img {
17 border: none;
18 }
20 table {
21 border-collapse: collapse;
22 border: none;
23 }
25 td, th {
26 padding: 0.5ex 0.5em 0.5ex 0.5em;
27 }
29 td {
30 vertical-align: top;
31 }
33 th {
34 vertical-align: bottom;
35 font-size: 75%;
36 font-weight: bold;
37 }
39 a.active {
40 color: #fff;
41 }
43 .highlighted {
44 background-color: #fa7;
45 color: #000;
46 }
48 .admin_only {
49 font-style: italic;
50 }
52 a {
53 vertical-align: middle;
54 }
56 /*************************************************************************
57 * Notices, warnings and errors
58 */
60 .layout_notice, .layout_error, .layout_warning {
61 background: #fff;
62 font-weight: bold;
63 line-height: 1.7em;
64 -moz-opacity:0.7;
65 }
67 .slot_notice, .slot_warning, .slot_error {
68 padding-left: 1em;
69 }
71 .slot_notice {
72 background-color: #cfc;
73 color: #040;
74 }
76 .slot_warning {
77 background-color: #fec;
78 color: #420;
79 }
81 .slot_error {
82 background-color: #fcc;
83 color: #400;
84 }
86 /*************************************************************************
87 * Navigation, search and language chooser bar
88 */
90 .topbar {
91 background-color: #444;
92 color: #fff;
93 font-size: 75%;
94 }
96 .topbar a {
97 background-color: #444;
98 color: #fff;
99 }
101 .topbar a:hover {
102 background-color: #fff;
103 color: #000;
104 }
106 .navigation,
107 .logout_button {
108 line-height: 250%;
109 }
111 .navigation img,
112 .logout_button img {
113 margin-right: 0.5em;
114 vertical-align: middle;
115 }
117 .navigation a,
118 .logout_button a {
119 padding: 1ex;
120 }
122 .logout_button {
123 float: right;
124 }
126 .searchbox {
127 padding: 0.5ex 1em 0ex 1em;
128 float: right;
129 line-height: 250%;
130 }
132 .searchbox div {
133 display: inline;
134 }
136 .searchbox select {
137 margin-left: 0.3em;
138 margin-right: 0.4em;
139 font-size: 100%;
140 width: 8em;
141 }
143 .searchbox input[type=text] {
144 width: 8em;
145 padding: 0.25ex 0.25em 0.25ex 0.25em;
146 margin-right: 0.5em;
147 font-size: 100%;
148 }
150 .searchbox input[type=submit] {
151 font-size: 100%;
152 width: 2.5em;
153 }
155 /*************************************************************************
156 * Title of current page including path and actions
157 */
159 .title_bar {
160 border-bottom: 1px solid #777;
161 margin-bottom: 2ex;
162 padding-top: 1ex;
163 padding-bottom: 0.5ex;
164 }
166 .title_bar_content {
167 margin-left: 1em;
168 }
170 .path {
171 color: #444;
172 }
174 .path div {
175 font-size: 100%;
176 line-height: 180%;
177 }
179 .path a {
180 color: #444;
181 }
183 .slot_path div {
184 display: inline;
185 margin-left: 1em;
186 margin-right: 1em;
187 }
189 .title {
190 color: #000;
191 margin-bottom: 0.5ex;
192 }
194 .slot_title {
195 }
197 .title div {
198 font-weight: bold;
199 font-size: 135%;
200 line-height: 110%;
201 }
203 .title a {
204 color: #000;
205 }
207 .member_image_avatar {
208 float: left;
209 margin-right: 0.5em;
210 }
212 .actions {
213 font-size: 75%;
214 line-height: 220%;
215 }
217 .slot_actions {
218 display: inline;
219 }
221 .actions a {
222 float: left;
223 display: block;
224 padding: 1px 0.5em 1px 0.0em;
225 margin-right: 1em;
226 vertical-align: middle;
227 }
229 .actions a:hover {
230 background-color: #d7d7d7;
231 }
233 .actions img {
234 padding-left: 0.2em;
235 padding-right: 0.2em;
236 vertical-align: middle;
237 }
239 .logo {
240 float: right;
241 margin-right: 1em;
242 }
244 /*************************************************************************
245 * vote info / delegation
246 */
248 .interest,
249 .slot_support,
250 .delegation {
251 float: left;
252 position: relative;
253 }
255 .interest img,
256 .slot_support img,
257 .delegation img {
258 padding-left: 0.2em;
259 padding-right: 0.2em;
260 }
261 .vote_info .head {
262 float: left;
263 margin-right: 1em;
264 }
266 .interest .head_active,
267 .slot_support .head_potential_supporter {
268 background-color: #fec;
269 border: 1px solid #b96;
270 }
272 .slot_support .head_supporter {
273 background-color: #dfc;
274 border: 1px solid #8b8;
275 }
277 .delegation .head_active {
278 background-color: #ddf;
279 border: 1px solid #88b;
280 }
282 .vote_info .close {
283 position: absolute;
284 top: 0;
285 right: 0;
286 padding: 1ex;
287 display: block;
288 }
290 .vote_info .content {
291 font-size: 133%;
292 line-height: 100%;
293 top: 3ex;
294 display: none;
295 position: absolute;
296 z-index: 10;
297 background-color: #fff;
298 border: 1px solid #999;
299 padding: 1em;
300 width: 25em;
301 }
303 .vote_info .delegation_arrow {
304 margin-top: 1ex;
305 margin-bottom: 1ex;
306 vertical-align: middle;
307 }
309 .vote_info .delegation_arrow_overridden {
310 opacity: 0.4;
311 }
313 .vote_info .delegation_scope_overridden {
314 color: #777;
315 }
317 .vote_info .delegation_scope {
318 display: inline;
319 }
321 .vote_info .delegation_info {
322 }
324 .vote_info .member_thumb {
325 clear: left;
326 }
328 .delegation_overridden .member_thumb {
329 opacity: 0.4;
330 }
332 .delegation .revoke {
333 margin: 0.5ex;
334 float: right;
335 }
337 .delegation .revoke img {
338 vertical-align: middle;
339 }
342 .sub_title div {
343 border-top: 1px solid #444;
344 padding-top: 1ex;
345 margin-top: 1ex;
346 font-weight: bold;
347 font-size: 135%;
348 line-height: 110%;
349 }
351 /*************************************************************************
352 * Main content
353 */
355 .main {
356 margin-left: 1em;
357 margin-right: 1em;
358 }
361 /*************************************************************************
362 * ui.tab
363 */
365 .ui_tabs_links {
366 margin-top: 4ex;
367 font-size: 75%;
368 }
370 .ui_tabs_links a {
371 padding: 1ex;
372 line-height: 200%;
373 background-color: #e7e7e7;
374 white-space: nowrap;
375 }
377 .ui_tabs_links a:hover {
378 background-color: #d7d7d7;
379 }
381 .ui_tabs_links a.selected {
382 background-color: #444;
383 color: #fff;
384 text-decoration: none;
385 padding: 1ex;
386 }
388 .ui_tabs_content {
389 border: 1px solid #444;
390 padding: 1ex 1ex 1ex 1ex;
391 }
393 /*************************************************************************
394 * ui.filter
395 * ui.order
396 */
398 .ui_filter_head,
399 .ui_order_head {
400 color: #777;
401 margin-top: 1ex;
402 margin-bottom: 1.5ex;
403 font-size: 75%;
404 }
406 .ui_filter_head a,
407 .ui_order_head a {
408 color: #777;
409 padding: 0.5ex;
410 }
412 .ui_filter_head a.active,
413 .ui_order_head a.active {
414 color: #fff;
415 background-color: #777;
416 padding: 0.5ex;
417 }
419 /*************************************************************************
420 * ui.paginate
421 */
423 .ui_paginate_select a {
424 padding: 0.5ex;
425 }
427 /*************************************************************************
428 * ui.bargraph
429 */
431 .bargraph {
432 width: 101px;
433 }
435 .bargraph div {
436 float: left;
437 margin-top: 0.5ex;
438 height: 1.3ex;
439 }
441 .bargraph_legend {
442 margin-top: 2ex;
443 }
445 .bargraph_legend .bargraph {
446 width: 26px;
447 }
449 .bargraph_legend div,
450 .bargraph_legend div div,
451 .bargraph_legend div div div {
452 float: left;
453 }
455 .bargraph_legend_label {
456 margin-left: 0.5em;
457 margin-right: 1em;
458 }
460 /*************************************************************************
461 * vertical ui.form
462 */
464 .login input[type=text],
465 .vertical input[type=text],
466 .login input[type=password],
467 .vertical input[type=password],
468 .vertical textarea,
469 .vertical select {
470 font-family: sans-serif;
471 font-size: 100%;
472 width: 50em;
473 border: 1px solid #444;
474 padding: 0.2ex 0.2em 0.2ex 0.2em;
475 margin-bottom: 1ex;
476 }
478 .login input[type=password],
479 .vertical input[type=password] {
480 width: 16em;
481 }
483 .vertical select {
484 padding-right: 0;
485 }
487 .login .ui_field_label,
488 .vertical .ui_field_label {
489 text-transform: uppercase;
490 font-size: 70%;
491 line-height: 120%;
492 font-weight: bold;
493 color: #777;
494 width: 15em;
495 display: block;
496 float: left;
497 clear: left;
498 text-align: right;
499 padding-right: 0.5em;
500 }
502 .login input[type=text],
503 .login input[type=password] {
504 width: 10em;
505 }
507 .login div,
508 .vertical div {
509 clear: left;
510 }
512 .vertical span {
513 display: block;
514 margin-bottom: 0.5ex;
515 }
517 .vertical span:after {
518 content: " ";
519 }
521 .vertical span span {
522 display: inline;
523 margin-bottom: 0;
524 }
526 .login input[type=submit],
527 .vertical input[type=submit] {
528 font-size: 100%;
529 margin-left: 11em;
530 background-color: #444444;
531 color: #fff;
532 border: none;
533 padding: 0.75ex;
534 }
536 .login input[type=submit]:hover,
537 .vertical input[type=submit]:hover {
538 background-color: #444444;
539 }
541 /*************************************************************************
542 * Tables
543 */
546 table a.action {
547 font-size: 70%;
548 line-height: 190%;
549 padding: 0.5ex;
550 color: #777;
551 }
553 table a.active {
554 color: #fff;
555 }
557 th {
558 text-align: left;
559 border-bottom: 1px solid #000;
560 }
562 tr:hover td {
563 background-color: #ddd;
564 }
567 tr table tr:hover td {
568 background-color: #fff;
569 }
572 /*************************************************************************
573 * Hidden inline form
574 */
576 .hidden_inline_form {
577 display: none;
578 border: 1px solid #444;
579 width: 42em;
580 position: absolute;
581 background-color: #fff;
582 left: 5em;
583 top: 20ex;
584 }
586 .hidden_inline_form a {
587 padding: 0.5ex;
588 color: #fff;
589 }
592 .hidden_inline_form .head {
593 background-color: #444;
594 color: #fff;
595 display: block;
596 padding: 0.5ex;
597 }
599 .hidden_inline_form input[type=text],
600 .hidden_inline_form textarea,
601 .hidden_inline_form select {
602 width: 30em;
603 }
605 /*************************************************************************
606 * Positive / Negtive votes
607 */
610 .positive_votes span {
611 display: inline;
612 }
614 .positive_votes {
615 display: inline;
616 background-color: #cfc;
617 padding: 0.3ex 0.5em 0.3ex 0.5em;
618 }
620 .negative_votes span {
621 display: inline;
622 }
624 .negative_votes {
625 display: inline;
626 background-color: #fcc;
627 padding: 0.3ex 0.5em 0.3ex 0.5em;
628 }
630 .suggestion_my_opinion a {
631 white-space: nowrap;
632 padding-left: 0.2ex !important;
633 padding-right: 0.2ex !important;
634 }
636 .active {
637 background-color: #444;
638 color: #fff;
639 }
641 .active_red2 { background-color: #a00; color: #fff !important; }
642 .active_red1 { background-color: #f88; color: #000 !important; }
643 .active_green1 { background-color: #8f8; color: #000 !important; }
644 .active_green2 { background-color: #0a0; color: #000 !important; }
649 /*************************************************************************
650 * Issues
651 */
653 .issues tr {
654 border: 1px solid #ccc;
655 }
657 .issues tr tr {
658 border: none;
659 }
661 .lang_chooser {
662 float: right;
663 margin-right: 0.5em;
664 }
666 .delegation_list_entry {
667 margin-right: 2em;
668 margin-bottom: 2ex;
669 float: left;
670 clear: left;
671 }
673 .delegation_list_entry .delegation_arrow {
674 float: left;
675 }
677 .delegation_list_entry .delegation_scope {
678 float: left;
679 width: 25em;
680 }
682 .delegation_list_entry .delegation_scope a {
683 display: block;
684 }
686 .member_list .member_thumb {
687 float: left;
688 margin-right: 1em;
689 margin-bottom: 2ex;
690 }
692 .member_thumb {
693 text-decoration: none;
694 width: 18em;
695 height: 48px;
696 display: block;
697 float: left;
698 border: 1px solid #999;
699 overflow: hidden;
700 xwhite-space: nowrap;
701 position: relative;
702 }
704 .member_thumb a{
705 position: absolute;
706 top: 0;
707 left: 0;
708 padding: 0;
709 margin: 0;
710 }
712 .member_thumb a:hover div {
713 background-color: #444;
714 color: #fff;
715 }
717 .member_thumb img {
718 padding: 0;
719 margin: 0;
720 vertical-align: bottom;
721 }
723 .member_thumb div {
724 }
726 .member_thumb .member_image {
727 }
729 .member_thumb .member_name {
730 position: absolute;
731 left: 48px;
732 top: 2ex;
733 font-size: 100%;
734 width: 14em;
735 }
737 .member_thumb .flags {
738 float: right;
739 font-size: 75%;
740 }
742 .member_thumb .flags a{
743 position: static;
744 float: right;
745 }
748 .member .right {
749 float: right;
750 }
752 .draft_content,
753 .member_statement {
754 background-color: #eee;
755 border: 1px solid #ccc;
756 padding-left: 1ex;
757 padding-right: 1ex;
758 }
760 .diff {
761 background-color: #eee;
762 border: 1px solid #ccc;
763 padding: 1ex;
764 }
766 .diff .added {
767 background-color: #cfc;
768 }
770 .diff .removed {
771 background-color: #fcc;
772 }
774 .slot_issue_info {
775 background-color: #eee;
776 border: 1px solid #ccc;
777 float: right;
778 padding: 0.5ex;
779 line-height: 130%;
780 margin-right: 1em;
781 }
783 .issue_info label {
784 float: left;
785 width: 8em;
786 text-transform: uppercase;
787 font-size: 70%;
788 color: #777;
789 font-weight: bold;
790 clear: left;
791 text-align: right;
792 margin-right: 0.7em;
793 }
795 .draft_updated_info,
796 .voting_active_info {
797 background-color: #fec;
798 border: 2px solid #b96;
799 padding: 1ex;
800 }
802 .suggestion_fulfilled {
803 width: 15em;
804 }
805 .suggestion_fulfilled a.action {
806 padding-left: 0;
807 line-height: 120%;
808 }
810 .help,
811 .use_terms {
812 border: 1px solid #bcd;
813 background-color: #def;
814 color: #000;
815 padding: 1ex;
816 }
818 .help_visible {
819 margin-bottom: 1ex;
820 }
822 .help_visible .help_icon {
823 float: right;
824 }
826 .slot_help_hidden {
827 float: right;
828 margin-right: 1em;
829 }
831 .help_actions {
832 font-size: 75%;
833 float: right;
834 }
836 .help_actions a {
837 margin-right: 1em;
838 color: #468;
839 }
841 .wiki {
842 }
844 .wiki h1,
845 .wiki h2,
846 .wiki h3,
847 .wiki h4 {
848 margin-top: 1ex;
849 margin-bottom: 1ex;
850 }
852 .wiki h1 {
853 font-size: 150%;
854 }
856 .wiki h2 {
857 font-size: 125%;
858 }
860 .wiki p {
861 margin-top: 1ex;
862 margin-bottom: 1ex;
863 }
865 form .warning {
866 background-color: #ffd;
867 color: #000;
868 border: 1px solid #dda;
869 margin: 1ex;
870 margin-bottom: 2ex;
871 padding: 1ex;
872 }
875 /*************************************************************************
876 * Voting
877 */
879 #voting {
880 position: relative;
881 }
882 #voting .approval, .abstention, .disapproval {
883 border: 2px black solid;
884 margin-top: 5ex;
885 margin-bottom: 5ex;
886 padding: 1ex;
887 padding-bottom: 2ex;
888 }
889 #voting .approval {
890 background-color: #9f9;
891 }
892 #voting .approval .movable {
893 background-color: #dfd;
894 }
895 #voting .abstention {
896 background-color: #ccc;
897 }
898 #voting .abstention .movable {
899 background-color: #eee;
900 }
901 #voting .disapproval {
902 background-color: #f88;
903 }
904 #voting .disapproval .movable {
905 background-color: #fbb;
906 }
907 #voting .cathead {
908 font-weight: bold;
909 }
910 #voting .movable {
911 position: relative;
912 border: 1px black solid;
913 margin: 1ex;
914 padding: 0.5ex;
915 cursor: pointer;
916 }
917 #voting .clickable {
918 cursor: auto;
919 }
920 #voting a.clickable {
921 cursor: pointer;
922 }
924 #voting .grabber {
925 vertical-align: middle;
926 cursor: move;
927 }