liquid_feedback_frontend
view static/lf4.css @ 1702:4ddc5841e136
Added MOTD top internal
| author | bsw |
|---|---|
| date | Mon Sep 27 10:57:00 2021 +0200 (2021-09-27) |
| parents | 97dfef4eb2d7 |
| children | dc54e50a70b9 |
line source
1 @font-face {
2 font-family: "Roboto";
3 src: url("font/Roboto-Regular.ttf");
4 }
5 @font-face {
6 font-family: "Roboto Bold";
7 src: url("font/Roboto-Bold.ttf");
8 }
9 @font-face {
10 font-family: "Roboto Slab";
11 src: url("font/RobotoSlab-Regular.ttf");
12 }
13 @font-face {
14 font-family: 'Material Icons';
15 font-style: normal;
16 font-weight: 400;
17 src: url("font/MaterialIcons-Regular.ttf");
18 }
20 .material-icons {
21 font-family: 'Material Icons';
22 font-weight: normal;
23 font-style: normal;
24 font-size: 24px;
25 line-height: 1;
26 letter-spacing: normal;
27 text-transform: none;
28 display: inline-block;
29 white-space: nowrap;
30 word-wrap: normal;
31 direction: ltr;
32 -webkit-font-feature-settings: 'liga';
33 -webkit-font-smoothing: antialiased;
34 }
35 .material-icons.icon-green {
36 color: #4CAF50;
37 }
38 .material-icons.icon-yellow {
39 color: #FFEB3B;
40 }
41 .material-icons.icon-red {
42 color: #F44336;
43 }
45 .mapboxgl-popup-content {
46 max-width: 200px;
47 }
48 body {
49 font-family: "Roboto";
50 background: #fff;
51 }
52 strong {
53 font-family: "Roboto Bold";
54 }
55 .slot_error {
56 margin: 20px 20px 0 20px;
57 background: #fed;
58 padding: 20px;
59 }
60 .slot_notice {
61 margin: 20px 20px 0 20px;
62 background: #efd;
63 padding: 20px;
64 }
65 h1 {
66 font-size: 24px;
67 margin-bottom: 0px;
68 }
70 .mdl-layout__container {
71 max-width: 1600px;
72 height: auto;
73 background: #f7f7f7;
74 }
75 .mdl-layout__header-row {
76 padding-left: 20px !important;
77 padding-right: 10px !important;
78 }
79 .mdl-layout__content {
80 flex-shrink: 0;
81 width: 100%;
82 }
83 #lf-member-menu {
84 cursor: pointer;
85 }
86 .notifications {
87 display: block;
88 text-align: center;
89 }
90 .page-content {
91 xdisplay: flex;
92 width: 100%;
93 }
94 .map, .ui_field_location {
95 border: none;
96 width: 100%;
97 height: auto;
98 max-height: 80vh;
99 position: relative;
100 border-radius: 2px;
101 }
102 .map:before {
103 content: "";
104 display: block;
105 padding-top: 100%;
106 }
107 .map iframe {
108 position: absolute;
109 top: 0;
110 left: 0;
111 right: 0;
112 bottom: 0;
113 height: 100%;
114 }
115 .axto-logo {
116 width: 100%;
117 }
118 .mdl-card__title-text a.issue {
119 font-size: 18px;
120 line-height: 20px;
121 }
122 .mdl-list__item .initiative_name {
123 font-size: 18px;
124 line-height: normal;
125 }
126 .initiatives.mdl-list {
127 margin-top: 5px;
128 margin-bottom: 5px;
129 padding-bottom: 0px;
130 }
131 .initiatives .mdl-list__item--three-line {
132 min-height: 0;
133 padding-top: 0;
134 padding-bottom: 0;
135 }
136 .mdl-data-table__fullwidth {
137 width: 100%;
138 }
139 .mdl-textfield__fullwidth {
140 width: 100%;
141 }
143 .mdl-card {
144 min-height: 20px;
145 overflow: visible;
146 display: block;
147 margin-bottom: 16px;
148 border-radius: 5px;
149 }
151 .mdl-card__title {
152 border-radius: 5px 5px 0 0;
153 }
155 .mdl-card__fullwidth {
156 width: 100%;
157 }
158 .mdl-card__title {
159 display: block;
160 }
161 .mdl-card__title > h2,
162 .mdl-card__title > a {
163 display: inline-block;
164 vertical-align: top;
165 }
166 .mdl-card__subtitle-text {
167 display: block;
168 }
169 .mdl-card__content {
170 font-size: 1rem;
171 padding: 16px;
172 }
173 .mdl-card__content.mdl-card--no-bottom-pad {
174 padding-bottom: 0;
175 }
176 .mdl-card__actions {
177 min-height: 52px;
178 }
179 .mdl-card__actions.mdl-card--action-border,
180 .mdl-card__content.mdl-card--border {
181 border-bottom: 1px solid rgba(0, 0, 0, 0.1);
182 }
183 .mdl-card__actions.mdl-card--notice,
184 .mdl-card__content.mdl-card--notice {
185 background: #fff9c4;
186 }
187 .mdl-card--has-fab {
188 position: relative;
189 }
190 .mdl-special-card {
191 background: #fff;
192 margin-bottom: 16px;
193 border-radius: 5px;
194 }
196 .mdl-navigation__head {
197 font-family: "Roboto Bold";
198 }
199 .mdl-list__item--three-line {
200 height: auto;
201 min-height: 88px;
202 }
203 .mdl-list__item--three-line .mdl-list__item-primary-content {
204 height: auto;
205 min-height: 52px;
206 }
207 .mdl-chip {
208 vertical-align: middle;
209 }
210 .mdl-chip.clickable {
211 cursor: pointer;
212 }
213 .mdl-menu {
214 z-index: -9999;
215 }
216 .mdl-card {
217 z-index: auto !important;
218 }
219 .mdl-menu__item {
220 padding: 0;
221 }
222 .mdl-menu__link {
223 display: block;
224 padding: 0 16px;
225 min-height: 48px;
226 text-decoration: none;
227 color: #444;
228 }
229 .mdl-tabs__tab-bar {
230 justify-content: flex-start;
231 }
232 .mdl-tabs__tab.is-active {
233 color: rgba(0,0,0, 0.87);
234 }
235 .mdl-data-table--condensed tbody tr {
236 height: 24px;
237 }
238 .mdl-data-table--condensed td {
239 padding-top: 0;
240 padding-bottom: 0;
241 height: 24px;
242 }
244 .mdl-button--feature-off i {
245 color: #777;
246 }
248 @keyframes feature-on {
249 0% {
250 transform: scale(0);
251 }
252 40% {
253 transform: scale(3);
254 }
255 100% {
256 transform: scale(1);
257 }}
259 .mdl-button--feature-on {
260 animation: feature-on 0.5s;
261 }
263 .mdl-button--underlined {
264 text-decoration: underline;
265 }
266 .right {
267 text-align: right;
268 }
269 .mdl-tabs__left {
270 display: inline-block;
271 width: auto;
272 }
273 .float-left {
274 float: left;
275 }
276 .float-right {
277 float: right;
278 }
279 .clear-left {
280 clear: left;
281 }
282 .clear-right {
283 clear: right;
284 }
285 .float-right .mdl-menu__container {
286 margin-right: 20px;
287 }
288 .inline {
289 display: inline-block;
290 }
291 .warning {
292 background-color: #fff9c4;
293 color: #212121;
294 padding: 16px;
295 border-radius: 2px;
296 }
297 .toolbar a {
298 color: #000;
299 display: inline-block;
300 border: 1px solid #ccc;
301 position: relative;
302 }
304 .toolbar a.wysihtml-command-active {
305 background: #000;
306 color: #fff;
308 }
310 .toolbar a span.crossed {
311 position: absolute;
312 top: 0;
313 left: 8px;
314 font-weight: bold;
315 font-size: 200%;
316 line-height: 80%;
317 }
318 .toolbar a span.head_level {
319 position: absolute;
320 right: 0;
321 bottom: 0;
322 }
324 textarea {
325 font-family: sans-serif;
326 font-weight: normal !important;
327 width: 100%;
328 height: 40ex;
329 }
330 .bargraph {
331 display: inline-block;
332 vertical-align: top;
333 height: 9px;
334 }
336 .bargraph div {
337 margin: 0;
338 padding: 0;
339 display: inline-block;
340 height: 9px;
341 }
342 .draft {
343 font-family: 'Roboto Slab';
344 font-weight: 300;
345 overflow: auto;
346 clear: left;
347 }
348 .draft img {
349 float: right;
350 margin-left: 1em;
351 }
353 .draft .landscape img {
354 width: 50%;
355 }
357 .draft .portrait img {
358 width: 33.333%;
359 }
360 .member_weight {
361 background: #070;
362 color: #fff;
363 border-radius: 8px;
364 padding: 0 3px;
365 }
366 .card-issue {
367 background: rgb(76,175,80);
368 }
369 .card-issue a {
370 color: #fff;
371 }
372 @media (max-width: 960px) {
373 .draft img {
374 float: none;
375 margin-left: 0;
376 }
377 .draft a.portrait,
378 .draft a.landscape {
379 width: 100%;
380 display: block;
381 text-align: center;
382 margin-bottom: 2ex;
383 }
384 .draft .landscape img {
385 width: 100%;
386 }
387 .draft .portrait img {
388 width: 66.666%;
389 }
390 }
392 .draft h1 {
393 font-size: 150%;
394 margin-bottom: 0;
395 }
396 .draft h2 {
397 font-size: 133%;
398 margin-bottom: 0;
399 }
400 .draft h3 {
401 font-size: 125%;
402 margin-bottom: 0;
403 }
404 .draft > a:first-child + h1,
405 .draft > h1:first-child,
406 .draft > h2:first-child,
407 .draft > h3:first-child {
408 margin-top: 0;
409 }
410 @media (max-width: 960px) {
411 .draft > a:first-child + h1 {
412 margin-top: 20px;
413 }
414 }
417 .suggestion-content {
418 position: relative;
419 }
421 .folded {
422 position: relative;
423 }
424 .folded .suggestion-content {
425 max-height: 250px;
426 overflow: hidden;
427 }
428 .folded .suggestion-content:before {
429 content: "";
430 width: 100%;
431 height: 25%;
432 position: absolute;
433 left: 0;
434 bottom: 0;
435 background: linear-gradient(rgba(0,0,0,0), #fff);
436 }
437 .suggestion-less,
438 .suggestion-more {
439 display: none;
440 position: absolute;
441 bottom: 5px;
442 right: 5px;
443 }
444 .folded .suggestion-more,
445 .unfolded .suggestion-less {
446 display: inline-block;
447 }
449 .suggestion_rating_info {
450 float: right;
451 line-height: 200%;
452 }
454 .diff .diff_removed {
455 text-decoration: line-through;
456 background: #f00;
457 }
459 .diff .diff_added {
460 text-decoration: underline;
461 background: #0f0;
462 }
464 .material-icons {
465 vertical-align: middle;
466 }
467 .material-icons-small {
468 font-size: 18px;
469 }
471 a.mdl-layout-title {
472 color: #fff;
473 text-decoration: none;
474 }
476 .what-can-i-do-here .mdl-card__content {
477 font-size: 18px;
478 }
480 .what-can-i-do-here .mdl-card__content ul {
481 font-size: 1rem;
482 }
484 .what-can-i-do-here ul {
485 margin-top: 0.5em;
486 margin-bottom: 0;
487 padding-left: 1.5em
488 }
492 .lf-filter .mdl-button {
493 padding-right: 4px;
494 }
496 .phase-current {
497 font-family: "Roboto Bold";
498 }
500 .phase-info {
501 padding-left: 27px;
502 margin-bottom: 1ex;
503 }
505 .clickable {
506 cursor: pointer;
507 }
509 .slot_title {
510 margin-left: 16px;
511 margin-top: 16px;
512 font-size: 18px;
513 }
515 .slot_title > a,
516 .slot_title > span {
517 display: inline-block;
518 padding: 0 4px 0 0;
520 }
522 .slot_title a.home {
523 margin: 0;
524 }
526 .home i {
527 font-size: 32px;
528 }
530 /* fix missing contrast */
531 .mdl-list__item--three-line .mdl-list__item-text-body,
532 .mdl-card__supporting-text,
533 .mdl-card__subtitle-text {
534 color: rgba(0,0,0, 0.75);
535 }
537 .mdl-textfield__label {
538 color: rgba(0,0,0, 0.5);
539 }
541 .mdl-list__item--three-line .mdl-list__item-text-body {
542 height: auto;
543 padding-bottom: 10px;
544 }
546 select {
547 font-family: 'Roboto','Helvetica','Arial',sans-serif;
548 background-color: transparent;
549 padding: 5px 0;
550 border: none;
551 border-bottom: 1px solid rgba(0,0,0, 0.12);
552 font-size: 1rem;
553 }
556 .initiative_list .mdl-list__item {
557 display: block;
558 }
559 .initiative_list .mdl-list__item-avatar {
560 float: left;
561 margin-right: 8px;
562 }
563 .initiative_list .mdl-list__item-avatar i {
564 padding-left: 8px;
565 }
566 .initiative_list .mdl-list__item-avatar.positive {
567 background: #4caf50;
568 }
569 .initiative_list .mdl-list__item-avatar.positive i {
570 padding-top: 8px;
571 vertical-align: top;
572 }
573 .initiative_list .mdl-list__item-avatar.negative {
574 background: #f44336;
575 }
576 .initiative_list .mdl-list__item-avatar.negative i {
577 padding-top: 10px;
578 vertical-align: top;
579 }
581 .initiatives .mdl-list__item {
582 display: grid;
583 grid-template-columns: 1fr min-content;
584 grid-gap: 1em;
585 align-items: start;
586 }
588 .initiatives .attachment {
589 max-width: 180px;
590 max-height: 80px;
591 }
593 .competing_initiatives .initiatives .attachment {
594 max-width: 80px;
595 max-height: 80px;
596 }
599 @media (max-width: 960px) {
600 .initiatives .mdl-list__item {
601 display: block;
602 }
603 .competing_initiatives .initiatives .mdl-list__item {
604 display: grid;
605 }
606 .initiatives .attachment {
607 max-width: 100%;
608 max-height: 120px;
609 margin-bottom: 2ex;
610 }
612 }
615 .initiative_pie {
616 float: left;
617 margin-right: 15px;
618 margin-bottom: 15px;
619 }
621 .initiative .result {
622 font-family: "Roboto Bold";
623 }
625 .admitted_info h1,
626 .not_admitted_info h1 {
627 margin-top: 0;
628 }
630 .admitted_info table th,
631 .not_admitted_info table th {
632 text-align: left;
633 padding-right: 10px;
634 }
636 .admitted_info table td,
637 .not_admitted_info table td {
638 text-align: right;
639 padding-right: 5px;
640 }
642 .attachments img {
643 max-width: 100%;
644 }
646 .ui_list_row label.mdl-radio {
647 display: inline;
648 }
650 .member_image_photo {
651 margin-top: 2ex;
652 margin-bottom: 2ex;
653 }
655 .contextlinks {
656 color: #fff;
657 }
659 /*************************************************************************
660 * Voting
661 */
662 .main .section #voting_form .sectionRow:last-child {
663 border-radius: 0;
664 margin-bottom: 0;
665 }
666 #voting {
667 margin-top: 3ex;
668 position: relative;
669 margin-bottom: 2ex;
670 }
671 #voting .approval,
672 #voting .abstention,
673 #voting .disapproval {
674 border: 1px #ccc solid;
675 margin-bottom: 3ex;
676 padding: 1ex;
677 padding-bottom: 1ex;
678 border-radius: 2px;
679 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
680 }
681 #voting .movable {
682 cursor: pointer;
683 }
684 #voting .disapproval {
685 margin-bottom: 2ex;
686 }
687 #voting .approval {
688 background-color: #9f9;
689 }
690 #voting .approval .movable {
691 background-color: #dfd;
692 }
693 #voting .abstention {
694 background-color: #eee;
695 }
696 #voting .abstention .movable {
697 background-color: #fff;
698 }
699 #voting .disapproval {
700 background-color: #f88;
701 }
702 #voting .disapproval .movable {
703 background-color: #fbb;
704 }
705 #voting .movable {
706 position: relative;
707 border: 1px black solid;
708 margin-top: 1ex;
709 padding: 0;
710 border-radius: 2px;
711 min-height: 64px;
712 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
713 }
714 #voting .initiative_name {
715 display: inline-block;
716 margin: 5px;
717 font-family: "Roboto Bold";
718 }
720 #voting .voting_form_active .movable {
721 cursor: pointer;
722 vertical-align: middle;
723 cursor: move;
724 }
725 #voting .voting_form_active .clickable {
726 cursor: auto;
727 }
728 #voting .voting_form_active a.clickable {
729 cursor: pointer;
730 }
732 div.form .ui_field_label {
733 text-transform: uppercase;
734 font-size: 80%;
735 }
736 div.form .member_photo .member_image.member_image_photo {
737 margin-top: 0;
738 }
740 .trace_list {
741 margin-left: 10px;
742 list-style-type: none;
743 padding: 0;
744 line-height: 120%;
745 }
747 .trace_list .trace_list {
748 padding-left: 10px;
749 border-left: 1px solid #999;
750 }
752 .trace_list .trace_head {
753 margin-top: 10px;
754 padding: 3px 5px 3px 5px;
755 font-weight: 700;
756 }
758 .trace_list li {
759 margin-top: 5px;
760 margin-bottom: 5px;
761 }
763 .trace_list .trace_filter .trace_head {
764 background: #acf;
765 color: #000;
766 }
768 .trace_list .trace_request .trace_head,
769 .trace_list .trace_view .trace_head {
770 background: #000;
771 color: #fff;
772 }
774 .trace_list .trace_config .trace_head,
775 .trace_list .trace_view .trace_view .trace_head {
776 background: #ccc;
777 color: #000;
778 }
780 .trace_list .trace_head .time {
781 float: right;
782 font-weight: 500;
783 font-size: 90%;
784 line-height: 100%;
785 margin-top: 5px;
786 }
788 .trace_list .trace_sql {
789 color: #050;
790 }
792 .trace_list .trace_sql_time {
793 background: #070;
794 color: #fff;
795 padding: 0px 3px;
796 border-radius: 5px;
797 }