liquid_feedback_frontend
view static/lf2.css @ 217:73dbc9e2bfd4
Cummulative patch for enhancements at next generation frontend
| author | bsw |
|---|---|
| date | Sat Mar 12 19:22:50 2011 +0100 (2011-03-12) |
| parents | 4f6e6b213fb8 |
| children | 7ea52c710503 |
line source
1 /*
2 * CSS reset
3 */
5 html, body, div, span, applet, object, iframe,
6 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
7 a, abbr, acronym, address, big, cite, code,
8 del, dfn, em, font, img, ins, kbd, q, s, samp,
9 small, strike, strong, sub, sup, tt, var,
10 dl, dt, dd, ol, ul, li,
11 fieldset, form, label, legend,
12 table, caption, tbody, tfoot, thead, tr, th, td {
13 margin: 0;
14 padding: 0;
15 border: 0;
16 outline: 0;
17 font-weight: inherit;
18 font-style: inherit;
19 font-size: 100%;
20 font-family: inherit;
21 vertical-align: baseline;
22 }
23 /* remember to define focus styles! */
24 :focus {
25 outline: 0;
26 }
27 body {
28 line-height: 1;
29 color: black;
30 background: white;
31 }
32 ol, ul {
33 list-style: none;
34 }
35 /* tables still need 'cellspacing="0"' in the markup */
36 table {
37 border-collapse: separate;
38 border-spacing: 0;
39 }
40 caption, th, td {
41 text-align: left;
42 font-weight: normal;
43 }
44 blockquote:before, blockquote:after,
45 q:before, q:after {
46 content: "";
47 }
48 blockquote, q {
49 quotes: "" "";
50 }
53 /*
54 * Positioning
55 */
57 .topbox .right
58 { float: right; }
60 .topbox a,
61 .topbox span,
62 .topbox select
63 { float: left; }
65 .slot_default
66 { position: relative; width: 67%; }
68 .slot_sidebar
69 { float: left; width: 30%; }
71 .sidebar_right .slot_sidebar
72 { float: right; width: 30%; }
74 .slot_sidebar .box
75 { width: 100%; }
77 .box
78 { position: relative; width: 100%; }
80 .box .row
81 { overflow: auto; }
83 .box .row .col.left
84 { float: left; }
86 .box .row .col.right
87 { float: right; }
89 /*
90 * Margins und paddings
91 */
93 .topbox a
94 { margin: 0 0 0 0.5em; padding: 0.7ex 0.5em 0.3ex 0.5em; }
96 .topbox select
97 { margin: 0.5ex 0 0.5ex 0; padding: 0.3ex 0.2em 0.2ex 0.2em;}
99 .topbox .right a,
100 .topbox .right span
101 { margin: 0 0.5em 0 0; padding: 0.7ex 0.5em 0.3ex 0.3em; }
103 .slot_default
104 { margin: 2ex 1% 2ex 32%; }
106 .sidebar_right .slot_default
107 { margin: 2ex 32% 2ex 1%; }
109 .slot_sidebar
110 { margin: 2ex 1% 2ex 1%; }
112 .sidebar_right .slot_sidebar
113 { margin: 0 1% 2ex 1%; }
115 .box
116 { margin: 0 0 2ex 0; }
119 .box .row .col
120 { padding: 0.5ex 0.2em 0.5ex 0.2em; }
122 .box .row .col:first-child
123 { padding-left: 0.5em; }
125 .box .row.subhead .col
126 { margin-top: 2ex; }
128 /*
129 * Colors
130 */
132 body
133 { background-color: #27C9FF; color: #000 }
135 .topbox.line1,
136 .topbox.line1 a,
137 .topbox.line1 select
138 { background-color: #444; color: #fff; }
140 .topbox.line2,
141 .topbox.line2 a
142 { color: #000; }
143 .topbox.line2 span.inactive
144 { opacity: 0.2; }
145 .topbox a.active
146 /* { background-color: #B2ECFF; color: #000; }*/
147 { background-color: #e7f0ff; color: #000; }
150 .box { background-color: #fff; }
152 .box { color: #000; }
154 .box a { color: #068; }
156 .box .row.head,
157 .box .row.head2,
158 .box .row.active
159 /* { background-color: #D7F5FF;}*/
160 { background-color: #e7f0ff;}
162 .box .row.head .col.head
163 { color: #444; }
165 .draft .authors,
166 .initiative .authors
167 { color: #777; }
169 .member_content
170 { background-color: #FFF4DC; }
172 /*
173 * Borders
174 */
176 .box .row
177 { border-bottom: 1px solid #ccc; }
178 .box .row.head
179 { border-bottom-color: #777; }
180 .box .row.subhead
181 { border-bottom-color: #777; }
182 .box .row:last-child
183 { border-bottom: none; }
185 .box.issue .row.unit_name
186 { border-bottom-color: #ccc; }
189 /*
190 * Rounded corners
191 */
193 .box { border-radius: 1ex; -moz-border-radius: 1ex;
194 -webkit-box-shadow: 1px 1px 3px #11576F; -moz-box-shadow: 0 0 2px 1px #444; }
196 .box .row:first-child.head,
197 .box .row:first-child.head2
198 { border-radius: 1ex 1ex 0 0 ; }
199 .box .row:last-child
200 { border-radius: 0 0 1ex 1ex; }
202 .box .row:first-child:last-child.head,
203 .box .row:first-child:last-child.head2
204 { border-radius: 1ex 1ex 1ex 1ex; }
206 .topbox.line1
207 { -webkit-box-shadow: 0 2px 3px #444; -moz-box-shadow: 0 2px 3px #444; }
209 .topbox a.active
210 { border-radius: 0 0 1ex 1ex;
211 -webkit-box-shadow: 1px 1px 3px #11576F, inset 0px 7px 3px -5px #444;
212 -moz-box-shadow: 2px 2px 3px 0px #444;
213 }
215 /*
216 * Text Formatting
217 */
219 body, input, select {
220 font-family: sans-serif;
221 font-size: 100%;
222 }
224 .topbox {
225 line-height: 135%;
226 }
228 .topbox a,
229 .topbox span
230 { font-weight: bold;
231 text-decoration: none; }
233 .box a { text-decoration: none; }
235 .box .row .col
236 { line-height: 115%; }
238 .box .row.head .col.head,
239 .box .row.head2 .col.head
240 { font-weight: bold; }
242 .box .row.subhead .col
243 { font-weight: bold; }
247 .box .row.head .col.head select
248 { font-weight: bold; width: 100%; }
250 /*
251 * Scrolled col
252 */
254 .box .row .col.scrolled {
255 padding: 0;
256 max-height: 300px;
257 overflow: auto;
258 }
260 .box .row .col.scrolled .head {
261 font-weight: bold;
262 padding: 0.5ex 0.2em 0.5ex 0.5em;
263 }
265 /*
266 * Bars
267 */
269 .bar {
270 float: right;
271 margin-left: 0.3em;
272 }
274 .bar div {
275 margin-top: 2px;
276 float: left;
277 height: 11px;
278 }
279 .bar .green {
280 background-color: #0a0;
281 }
283 .bar .grey {
284 background-color: #eee;
285 }
287 /*
288 * Avatars
289 */
291 .avatar_image {
292 border-radius: 1ex;
293 }
295 .avatars {
296 overflow: auto;
297 }
299 .avatars .avatar {
300 float: left;
301 margin-left: 2px;
302 margin-right: 2px;
303 }
305 .avatars.normal .avatar {
306 width: 100px;
307 text-align: center;
308 }
310 .avatars.small .avatar {
311 border: 2px solid #fff;
312 border-radius: 0.5ex;
313 -moz-border-radius: 0.5ex;
314 }
316 .avatars .arrow {
317 float: left;
318 margin-top: 0.3ex;
319 }
321 .avatars.small .avatar img {
322 border-radius: 0.25ex;
323 -moz-border-radius: 0.25ex;
324 }
326 .avatars.normal .avatar img {
327 margin-left: 0.3em;
328 margin-top: 0.3ex;
329 border-radius: 1ex;
330 -moz-border-radius: 1ex;
331 }
333 .avatars.small .avatar img {
334 height: 24px;
335 width: 24px;
336 }
338 .avatars.normal .avatar img {
339 height: 48px;
340 width: 48px;
341 }
343 .avatars.normal .avatar .name {
344 margin-left: 0.3em;
345 margin-top: 0.3ex;
346 line-height: 100%;
347 font-size: 70%;
348 overflow: hidden;
349 height: 4ex;
350 }
352 .avatars .avatar .weight {
353 text-align: center;
354 font-size: 70%;
355 }
357 .avatars.small .avatar.participation {
358 border-color: #f70;
359 }
361 .avatars.small .avatar.overridden,
362 .avatars.small .arrow.overridden {
363 opacity: 0.3;
364 }
366 /*
367 * Area
368 */
370 .area .name {
371 color: #444;
372 }
374 .area .name a {
375 font-weight: normal;
376 }
378 .area .name .avatars {
379 float: right;
380 margin-top: -3px;
381 }
383 /*
384 * Initiative
385 */
387 .initiative .name,
388 .initiative a.name {
389 font-weight: bold;
390 }
392 .draft .authors,
393 .initiative .authors {
394 /* text format */
395 font-size: 80%;
396 font-style: italic;
397 }
399 .drafts .draft .created {
400 font-weight: bold;
401 }
403 /*
404 * Draft
405 */
407 .member_content .draft {
408 line-height: 135%;
409 }
411 .draft h1 {
412 font-size: 135%;
413 }
415 .draft h2 {
416 font-size: 135%;
417 font-weight: bold;
418 margin-bottom: 0.5ex;
419 }
421 .draft h3 {
422 font-size: 135%;
423 margin-bottom: 0.5ex;
424 }
426 .draft p {
427 margin-bottom: 1ex;
428 }
430 .draft ul {
431 padding-left: 2em;
432 list-style: disc;
433 }
435 .draft ul li {
436 margin-bottom: 1ex;
437 }
