liquid_feedback_frontend
view static/style.css @ 0:3bfb2fcf7ab9
Version alpha1
author | bsw/jbe |
---|---|
date | Wed Nov 18 12:00:00 2009 +0100 (2009-11-18) |
parents | |
children | 5c601807d397 |
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 vertical-align: top;
27 padding: 0.5ex 0.5em 0.5ex 0.5em;
28 }
30 a.active {
31 color: #fff;
32 }
34 .highlighted {
35 background-color: #fa7;
36 color: #000;
37 }
39 .admin_only {
40 font-style: italic;
41 }
43 /*************************************************************************
44 * Notices, warnings and errors
45 */
47 .layout_notice, .layout_error, .layout_warning {
48 background: #fff;
49 font-weight: bold;
50 right: 2ex;
51 line-height: 1.7em;
52 position: absolute;
53 top: 6ex;
54 width: 60ex;
55 -moz-opacity:0.7;
56 }
58 .slot_notice, .slot_warning, .slot_error {
59 padding: 2ex;
60 }
62 .slot_notice {
63 color: green;
64 border: 2px solid green;
65 }
67 .slot_warning {
68 color: orange;
69 border: 2px solid orange;
70 }
72 .slot_error {
73 color: red;
74 border: 2px solid red;
75 }
77 /*************************************************************************
78 * Navigation, search and language chooser bar
79 */
81 .topbar {
82 margin-bottom: 1em;
83 background-color: #444;
84 color: #fff;
85 font-size: 75%;
86 }
88 .topbar a {
89 color: #fff;
90 }
92 .topbar a:hover {
93 background-color: #fff;
94 color: #000;
95 }
97 .navigation,
98 .logout_button {
99 line-height: 250%;
100 }
102 .navigation img,
103 .logout_button img {
104 margin-right: 0.5em;
105 vertical-align: middle;
106 }
108 .navigation a,
109 .logout_button a {
110 padding: 1ex;
111 }
113 .logout_button {
114 float: right;
115 }
117 .searchbox {
118 padding: 0.5ex 1em 0ex 1em;
119 float: right;
120 line-height: 250%;
121 }
123 .searchbox div {
124 display: inline;
125 }
127 .searchbox select {
128 margin-left: 0.3em;
129 margin-right: 0.4em;
130 font-size: 100%;
131 width: 8em;
132 }
134 .searchbox input[type=text] {
135 width: 8em;
136 padding: 0.25ex 0.25em 0.25ex 0.25em;
137 margin-right: 0.5em;
138 font-size: 100%;
139 }
141 .searchbox input[type=submit] {
142 font-size: 100%;
143 width: 2.5em;
144 }
146 /*************************************************************************
147 * Title of current page including path and actions
148 */
150 .title_bar {
151 border-bottom: 1px solid #000;
152 margin-bottom: 2ex;
153 }
155 .path {
156 color: #444;
157 xbackground-color: #ddd;
158 }
160 .path div {
161 margin-left: 1em;
162 font-size: 100%;
163 line-height: 180%;
164 }
166 .path a {
167 color: #444;
168 }
170 .slot_path div {
171 display: inline;
172 margin-left: 1em;
173 margin-right: 1em;
174 }
176 .title {
177 color: #000;
178 margin-bottom: 0.5ex;
179 }
181 .slot_title {
182 }
184 .title div {
185 margin-left: 0.66em;
186 font-weight: bold;
187 font-size: 135%;
188 line-height: 110%;
189 }
191 .title a {
192 color: #fff;
193 }
195 .avatar {
196 float: left;
197 margin-right: 0.5em;
198 }
200 .actions {
201 display: inline;
202 font-size: 75%;
203 line-height: 200%;
204 }
206 .slot_actions {
207 margin-left: 1em;
208 display: inline;
209 }
211 .actions a {
212 padding: 0.5ex 0.5em 0.5ex 0.0em;
213 margin-right: 1em;
214 vertical-align: middle;
215 }
217 .actions a:hover {
218 background-color: #d7d7d7;
219 }
221 .actions img {
222 padding-left: 0.2em;
223 padding-right: 0.2em;
224 }
226 /*************************************************************************
227 * Main content
228 */
230 .main {
231 margin-left: 1em;
232 margin-right: 1em;
233 }
236 /*************************************************************************
237 * ui.tab
238 */
240 .ui_tabs_links {
241 margin-top: 4ex;
242 font-size: 75%;
243 }
245 .ui_tabs_links a {
246 padding: 1ex;
247 margin-left: 0.5em;
248 background-color: #e7e7e7;
249 }
251 .ui_tabs_links a:hover {
252 background-color: #d7d7d7;
253 }
255 .ui_tabs_links a.selected {
256 background-color: #444;
257 color: #fff;
258 text-decoration: none;
259 padding: 1ex;
260 }
262 .ui_tabs_content {
263 border: 1px solid #444;
264 padding: 1ex 1ex 1ex 1ex;
265 }
267 /*************************************************************************
268 * ui.order
269 */
271 .ui_order_head {
272 color: #777;
273 text-align: right;
274 margin-bottom: 1ex;
275 font-size: 75%;
276 }
278 .ui_order_head a {
279 color: #777;
280 padding: 0.5ex;
281 }
283 .ui_order_head a.active{
284 color: #fff;
285 background-color: #777;
286 padding: 0.5ex;
287 }
289 /*************************************************************************
290 * ui.paginate
291 */
293 .ui_paginate_select a {
294 padding: 0.5ex;
295 }
297 /*************************************************************************
298 * ui.bargraph
299 */
301 .bargraph {
302 width: 50px;
303 }
305 .bargraph div {
306 float: left;
307 margin-top: 0.5ex;
308 height: 1ex;
309 }
311 /*************************************************************************
312 * vertical ui.form
313 */
315 .login input[type=text],
316 .vertical input[type=text],
317 .login input[type=password],
318 .vertical input[type=password],
319 .vertical textarea,
320 .vertical select {
321 font-family: sans-serif;
322 font-size: 100%;
323 border: 1px solid #444;
324 width: 40em;
325 padding: 0.2ex 0.2em 0.2ex 0.2em;
326 margin-bottom: 1ex;
327 }
329 .login input[type=password],
330 .vertical input[type=password] {
331 width: 16em;
332 }
334 .vertical select {
335 padding-right: 0;
336 }
338 .login .ui_field_label,
339 .vertical .ui_field_label {
340 text-transform: uppercase;
341 font-size: 70%;
342 line-height: 190%;
343 font-weight: bold;
344 color: #777;
345 width: 15em;
346 display: block;
347 float: left;
348 clear: left;
349 text-align: right;
350 padding-right: 0.5em;
351 }
353 .login input[type=text],
354 .login input[type=password] {
355 width: 10em;
356 }
358 .login div,
359 .vertical div {
360 clear: left;
361 }
363 .vertical span {
364 display: block;
365 margin-bottom: 0.5ex;
366 }
368 .vertical span:after {
369 content: " ";
370 }
372 .vertical span span {
373 display: inline;
374 margin-bottom: 0;
375 }
377 .login input[type=submit],
378 .vertical input[type=submit] {
379 font-size: 100%;
380 margin-left: 11em;
381 background-color: #444444;
382 color: #fff;
383 border: none;
384 padding: 0.75ex;
385 }
387 .login input[type=submit]:hover,
388 .vertical input[type=submit]:hover {
389 background-color: #444444;
390 }
392 /*************************************************************************
393 * Tables
394 */
397 table a.action {
398 font-size: 70%;
399 line-height: 190%;
400 padding: 0.5ex;
401 color: #777;
402 }
404 table a.active {
405 color: #fff;
406 }
408 th {
409 text-align: left;
410 border-bottom: 1px solid #000;
411 }
413 tr:hover td {
414 background-color: #ddd;
415 }
418 tr table tr:hover td {
419 background-color: #fff;
420 }
423 /*************************************************************************
424 * Hidden inline form
425 */
427 .hidden_inline_form {
428 display: none;
429 border: 1px solid #444;
430 width: 42em;
431 position: absolute;
432 background-color: #fff;
433 left: 5em;
434 top: 20ex;
435 }
437 .hidden_inline_form a {
438 padding: 0.5ex;
439 color: #fff;
440 }
443 .hidden_inline_form .head {
444 background-color: #444;
445 color: #fff;
446 display: block;
447 padding: 0.5ex;
448 }
450 .hidden_inline_form input[type=text],
451 .hidden_inline_form textarea,
452 .hidden_inline_form select {
453 width: 30em;
454 }
456 /*************************************************************************
457 * Positive / Negtive votes
458 */
461 .positive_votes span {
462 display: inline;
463 }
465 .positive_votes {
466 display: inline;
467 background-color: #cfc;
468 padding: 0.3ex 0.5em 0.3ex 0.5em;
469 }
471 .negative_votes span {
472 display: inline;
473 }
475 .negative_votes {
476 display: inline;
477 background-color: #fcc;
478 padding: 0.3ex 0.5em 0.3ex 0.5em;
479 }
483 .active {
484 background-color: #444;
485 color: #fff;
486 }
488 .active_red2 { background-color: #a00; color: #fff !important; }
489 .active_red1 { background-color: #f88; color: #000 !important; }
490 .active_green1 { background-color: #8f8; color: #000 !important; }
491 .active_green2 { background-color: #0a0; color: #000 !important; }
496 /*************************************************************************
497 * Issues
498 */
500 .issues tr {
501 border-bottom: 1px solid #444;
502 }
504 .issues tr tr {
505 border-bottom: none;
506 }
508 /*************************************************************************
509 * delegation
510 */
512 .infobox {
513 float: right;
514 margin-right: 1em;
515 }
517 .slot_interest,
518 .slot_support,
519 .slot_delegation {
520 border: 2px solid #444;
521 width: 20em;
522 font-size: 75%;
523 padding: 0;
524 margin-bottom: 0.5ex;
525 }
527 .infobox .head {
528 margin: 0.5ex;
529 }
531 .infobox .content {
532 display: none;
533 position: absolute;
534 z-index: 10;
535 width: 20em;
536 background-color: #fff;
537 border: 2px solid #444;
538 }
540 .infobox .text {
541 margin: 0.5ex;
542 margin-bottom: 1ex;
543 }
545 .infobox .member {
546 margin: 0.5ex;
547 display: block;
548 font-weight: bold;
549 margin-bottom: 1ex;
550 }
552 .delegation .revoke {
553 margin: 0.5ex;
554 }
556 .lang_chooser {
557 float: right;
558 margin-right: 0.5em;
559 }