liquid_feedback_frontend
diff app/main/_layout/lf2.html @ 213:acf92c2d33f4
Seperated css and fixed issue delegations for second generation frontend
| author | bsw |
|---|---|
| date | Thu Mar 03 21:26:35 2011 +0100 (2011-03-03) |
| parents | 3e4ad069847a |
| children | 73dbc9e2bfd4 |
line diff
1.1 --- a/app/main/_layout/lf2.html Thu Mar 03 18:39:00 2011 +0100 1.2 +++ b/app/main/_layout/lf2.html Thu Mar 03 21:26:35 2011 +0100 1.3 @@ -1,574 +1,32 @@ 1.4 -<!-- <html> --> 1.5 -<head> 1.6 -<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 1.7 -<style> 1.8 - 1.9 -/* CSS reset */ 1.10 - 1.11 -html, body, div, span, applet, object, iframe, 1.12 -h1, h2, h3, h4, h5, h6, p, blockquote, pre, 1.13 -a, abbr, acronym, address, big, cite, code, 1.14 -del, dfn, em, font, img, ins, kbd, q, s, samp, 1.15 -small, strike, strong, sub, sup, tt, var, 1.16 -dl, dt, dd, ol, ul, li, 1.17 -fieldset, form, label, legend, 1.18 -table, caption, tbody, tfoot, thead, tr, th, td { 1.19 - margin: 0; 1.20 - padding: 0; 1.21 - border: 0; 1.22 - outline: 0; 1.23 - font-weight: inherit; 1.24 - font-style: inherit; 1.25 - font-size: 100%; 1.26 - font-family: inherit; 1.27 - vertical-align: baseline; 1.28 -} 1.29 -/* remember to define focus styles! */ 1.30 -:focus { 1.31 - outline: 0; 1.32 -} 1.33 -body { 1.34 - line-height: 1; 1.35 - color: black; 1.36 - background: white; 1.37 -} 1.38 -ol, ul { 1.39 - list-style: none; 1.40 -} 1.41 -/* tables still need 'cellspacing="0"' in the markup */ 1.42 -table { 1.43 - border-collapse: separate; 1.44 - border-spacing: 0; 1.45 -} 1.46 -caption, th, td { 1.47 - text-align: left; 1.48 - font-weight: normal; 1.49 -} 1.50 -blockquote:before, blockquote:after, 1.51 -q:before, q:after { 1.52 - content: ""; 1.53 -} 1.54 -blockquote, q { 1.55 - quotes: "" ""; 1.56 -} 1.57 - 1.58 -/* end CSS reset */ 1.59 - 1.60 - 1.61 -/* 1.62 - Global settings 1.63 -*/ 1.64 -body { 1.65 - font-family: sans-serif; 1.66 - background-color: #7df; 1.67 - color: #000; 1.68 -} 1.69 +<html><head> 1.70 1.71 -a { 1.72 - background-color: #ffffff; 1.73 - color: #000; 1.74 -} 1.75 - 1.76 -/* 1.77 - Main top navigation 1.78 -*/ 1.79 - 1.80 -.tab1 { 1.81 - background-color: #444; 1.82 - color: #000; 1.83 -} 1.84 - 1.85 -.tab1 .right { 1.86 - float: right; 1.87 -} 1.88 - 1.89 -.tab1 a { 1.90 - float: left; 1.91 - padding: 0.5ex 0.5em 0.5ex 0.5em; 1.92 - margin-left: 0.5em; 1.93 - background-color: #444; 1.94 - color: #fff; 1.95 - font-weight: bold; 1.96 - text-decoration: none; 1.97 -} 1.98 - 1.99 -.tab1 .right a { 1.100 - margin-left: 0; 1.101 - margin-right: 0.5em; 1.102 -} 1.103 - 1.104 -.tab1 a.active { 1.105 - background-color: #7df; 1.106 - color: #000; 1.107 -} 1.108 - 1.109 -/* 1.110 - Default slot 1.111 -*/ 1.112 - 1.113 -.slot_default { 1.114 - margin: 2ex 1% 2ex 32%; 1.115 - position: relative; 1.116 - width: 67%; 1.117 -} 1.118 - 1.119 -/* 1.120 - Sidebar 1.121 -*/ 1.122 - 1.123 -.slot_sidebar { 1.124 - margin: 2ex 1% 2ex 1%; 1.125 - float: left; 1.126 - width: 30%; 1.127 -} 1.128 - 1.129 -.slot_sidebar .box { 1.130 - width: 100%; 1.131 -} 1.132 - 1.133 - 1.134 -/* 1.135 - Boxes 1.136 -*/ 1.137 - 1.138 -.box a { 1.139 - text-decoration: none; 1.140 - color: #46a; 1.141 -} 1.142 + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 1.143 + <link rel="stylesheet" type="text/css" media="screen" href="__BASEURL__/static/lf2.css" /> 1.144 + <title>LiquidFeedback</title> 1.145 1.146 -.boxhead, 1.147 -a.boxhead { 1.148 - /* position */ 1.149 - display: block; 1.150 - margin-bottom: 0.5ex; 1.151 - margin-top: 1ex; 1.152 - margin-left: 0.5em; 1.153 - 1.154 - /* color */ 1.155 - background-color: #7df; 1.156 - color: #000; 1.157 - 1.158 - /* text format */ 1.159 - font-weight: bold; 1.160 - text-shadow: 2px 2px 2px #fff; 1.161 -} 1.162 - 1.163 -.box { 1.164 - /* position */ 1.165 - position: relative; 1.166 - width: 100%; 1.167 - margin-bottom: 2ex; 1.168 - 1.169 - /* border and shadow*/ 1.170 - border-radius: 1ex; 1.171 - -moz-border-radius: 1ex; 1.172 - -webkit-box-shadow: 2px 2px 3px 0px #444; 1.173 - -moz-box-shadow: 2px 2px 3px 0px #444; 1.174 - 1.175 - /* color */ 1.176 - background-color: #fff; 1.177 - color: #000; 1.178 - 1.179 -} 1.180 - 1.181 -.box .row { 1.182 - overflow: auto; 1.183 - /* position */ 1.184 - 1.185 - /* border */ 1.186 - border-top: 1px solid #ccc; 1.187 -} 1.188 - 1.189 -.box .row .col { 1.190 - /* position */ 1.191 - padding: 0.5ex 0.2em 0.5ex 0.2em; 1.192 - 1.193 - /* text format */ 1.194 - line-height: 125%; 1.195 -} 1.196 - 1.197 -.box .row .col.left { 1.198 - float: left; 1.199 -} 1.200 - 1.201 -.box .row .col.right { 1.202 - float: right; 1.203 -} 1.204 - 1.205 -.box .row .col.clearleft { 1.206 - clear: left; 1.207 -} 1.208 - 1.209 -.box .row .col.clearright { 1.210 - clear: right; 1.211 -} 1.212 - 1.213 -.box .row .col.toggle { 1.214 - float: left; 1.215 - /* position */ 1.216 - padding-left: 0.4em; 1.217 -} 1.218 +</head><body> 1.219 1.220 -.box .row .col.toggle:hover { 1.221 - /* color */ 1.222 - background-color: #7cf; 1.223 - 1.224 - /* cursor */ 1.225 - cursor: pointer; 1.226 -} 1.227 - 1.228 -.box .row.first .col.toggle { 1.229 - /* border */ 1.230 - border-radius: 1ex 0 0 0; 1.231 -} 1.232 - 1.233 -.box .row.last .col.toggle { 1.234 - /* border */ 1.235 - border-radius: 0 0 0 1ex; 1.236 -} 1.237 - 1.238 -.box .row.toggled .col.first { 1.239 - /* position */ 1.240 - margin-left: 1.5em; 1.241 -} 1.242 - 1.243 -.box .row.first { 1.244 - /* border */ 1.245 - border-top: none; 1.246 -} 1.247 - 1.248 -.box .row .col.first { 1.249 - /* position */ 1.250 - padding-left: 0.5em; 1.251 -} 1.252 - 1.253 -.box .row.toggled .col.first { 1.254 - /* position */ 1.255 - padding-left: 0.2em; 1.256 -} 1.257 - 1.258 -.box .row.head { 1.259 - background-color: #e4e7f0; 1.260 - color: #000; 1.261 - border-radius: 1ex 1ex 0 0; 1.262 -} 1.263 - 1.264 -.box .row.last { 1.265 - border-radius: 0 0 1ex 1ex; 1.266 -} 1.267 - 1.268 -.box .row.head .col.head { 1.269 - font-weight: bold; 1.270 - color: #444; 1.271 -} 1.272 - 1.273 -.box .row.head .col a { 1.274 - background-color: #e4e7f0; 1.275 - color: #3B6E7F; 1.276 -} 1.277 - 1.278 -.box .row.head2 { 1.279 - background-color: #f2f3f7; 1.280 - color: #000; 1.281 -} 1.282 - 1.283 -.box .row.head2 .col a { 1.284 - background-color: #f2f3f7; 1.285 - color: #3B6E7F; 1.286 -} 1.287 - 1.288 - 1.289 -.box .row .col a { 1.290 - color: #3B6E7F; 1.291 -} 1.292 + <div class="tab1"> 1.293 + <!-- WEBMCP SLOT topnav --> 1.294 + <br style="clear: both;" /> 1.295 + </div> 1.296 1.297 -.box .row.active, 1.298 -.box .row.active a { 1.299 - background-color: #DDF7FF; 1.300 -} 1.301 - 1.302 -/* Sidebar hover button */ 1.303 - 1.304 -.hoverbutton_container { 1.305 - position: relative; 1.306 -} 1.307 - 1.308 - 1.309 -.hoverbutton { 1.310 - /* position */ 1.311 - display: none; 1.312 - position: absolute; 1.313 - top: 0px; 1.314 - left: 0px; 1.315 - height: 100%; 1.316 - width: 100%; 1.317 - 1.318 - /* color */ 1.319 - background-color: #fff; 1.320 - 1.321 - /* text format */ 1.322 - font-weight: bold; 1.323 - 1.324 - /* cursor */ 1.325 - cursor: pointer; 1.326 -} 1.327 - 1.328 -.hoverbutton_container:hover .hoverbutton { 1.329 - /* position */ 1.330 - display: block; 1.331 -} 1.332 - 1.333 -.hoverbutton_container:hover .hoverbutton img { 1.334 - /* text format */ 1.335 - vertical-align: middle; 1.336 -} 1.337 - 1.338 -.hoverbutton_container:hover .hoverbutton.noaction { 1.339 - /* color */ 1.340 - background-color: #ccc; 1.341 - 1.342 - /* cursor */ 1.343 - cursor: default; 1.344 -} 1.345 - 1.346 -.hoverbutton_container:hover .hoverbutton.green { 1.347 - background-color: #cfc; 1.348 -} 1.349 - 1.350 -.hoverbutton_container:hover .hoverbutton.red { 1.351 - background-color: #fcc; 1.352 -} 1.353 - 1.354 -.hoverbutton .content { 1.355 - /* position */ 1.356 - padding: 0.5ex 0.2em 0.5ex 0.5em; 1.357 -} 1.358 - 1.359 -/* Scrolled col */ 1.360 - 1.361 -.box .row .col.scrolled { 1.362 - padding: 0; 1.363 - max-height: 300px; 1.364 - overflow: auto; 1.365 -} 1.366 - 1.367 -.box .row .col.scrolled .head { 1.368 - font-weight: bold; 1.369 - padding: 0.5ex 0.2em 0.5ex 0.5em; 1.370 -} 1.371 - 1.372 -/* 1.373 - Bars 1.374 -*/ 1.375 - 1.376 -.bar { 1.377 - float: right; 1.378 - margin-left: 0.3em; 1.379 -} 1.380 - 1.381 -.bar div { 1.382 - margin-top: 2px; 1.383 - float: left; 1.384 - height: 11px; 1.385 -} 1.386 -.bar .green { 1.387 - background-color: #0a0; 1.388 -} 1.389 - 1.390 -.bar .grey { 1.391 - background-color: #eee; 1.392 -} 1.393 - 1.394 -/* 1.395 - Avatars 1.396 -*/ 1.397 - 1.398 -.avatars { 1.399 - overflow: auto; 1.400 -} 1.401 - 1.402 -.avatars .avatar { 1.403 - float: left; 1.404 - margin-left: 2px; 1.405 - margin-right: 2px; 1.406 -} 1.407 - 1.408 -.avatars.normal .avatar { 1.409 - width: 100px; 1.410 - -webkit-box-shadow: 1px 1px 1px #000; 1.411 - background-color: #eee; 1.412 - border-radius: 1ex; 1.413 - -moz-border-radius: 1ex; 1.414 -} 1.415 - 1.416 -.avatars.small .avatar { 1.417 - border: 2px solid #fff; 1.418 - border-radius: 0.5ex; 1.419 - -moz-border-radius: 0.5ex; 1.420 -} 1.421 - 1.422 -.avatars .arrow { 1.423 - float: left; 1.424 - margin-top: 0.3ex; 1.425 -} 1.426 - 1.427 -.avatars .avatar.myweight { 1.428 - border-color: #f70; 1.429 - background-color: #f70; 1.430 -} 1.431 - 1.432 -.avatars .avatar.autoreject { 1.433 - border-color: #f00; 1.434 - background-color: #f00; 1.435 -} 1.436 + <!-- WEBMCP SLOTNODIV leftright_pre --> 1.437 + <!-- WEBMCP SLOT sidebar --> 1.438 + <!-- WEBMCP SLOT default --> 1.439 + <!-- WEBMCP SLOTNODIV leftright_post --> 1.440 1.441 -.avatars.small .avatar img { 1.442 - border-radius: 0.25ex; 1.443 - -moz-border-radius: 0.25ex; 1.444 -} 1.445 - 1.446 -.avatars.normal .avatar img { 1.447 - margin-left: 0.3em; 1.448 - margin-top: 0.3ex; 1.449 - border-radius: 1ex; 1.450 - -moz-border-radius: 1ex; 1.451 -} 1.452 - 1.453 -.avatars.small .avatar img { 1.454 - height: 24px; 1.455 - width: 24px; 1.456 -} 1.457 - 1.458 -.avatars.normal .avatar img { 1.459 - height: 48px; 1.460 - width: 48px; 1.461 -} 1.462 - 1.463 -.avatars.normal .avatar .name { 1.464 - margin-left: 0.3em; 1.465 - margin-top: 0.3ex; 1.466 - line-height: 100%; 1.467 - font-size: 70%; 1.468 - overflow: hidden; 1.469 - height: 4ex; 1.470 -} 1.471 - 1.472 -.avatars .avatar .weight { 1.473 - text-align: center; 1.474 - font-size: 70%; 1.475 -} 1.476 - 1.477 -.avatars.small .avatar.participation { 1.478 - border-color: #f70; 1.479 -} 1.480 - 1.481 -.avatars.small .avatar.overridden, 1.482 -.avatars.small .arrow.overridden { 1.483 - opacity: 0.3; 1.484 -} 1.485 - 1.486 -/* 1.487 - Area 1.488 -*/ 1.489 - 1.490 -.area .name { 1.491 - color: #444; 1.492 -} 1.493 - 1.494 -.area .name a { 1.495 - font-weight: normal; 1.496 -} 1.497 - 1.498 -.area .name .avatars { 1.499 - float: right; 1.500 - margin-top: -3px; 1.501 -} 1.502 - 1.503 -/* Initiatives */ 1.504 - 1.505 -.initiative .name, 1.506 -.initiative a.name { 1.507 - font-weight: bold; 1.508 -} 1.509 - 1.510 -.initiative .authors { 1.511 - /* color */ 1.512 - color: #777; 1.513 - 1.514 - /* text format */ 1.515 - font-size: 80%; 1.516 - font-style: italic; 1.517 -} 1.518 - 1.519 -.initiative .authors a { 1.520 - /* color */ 1.521 -} 1.522 - 1.523 -.drafts .draft .created { 1.524 - font-weight: bold; 1.525 -} 1.526 - 1.527 -.drafts .draft .author_name { 1.528 - font-style: italic; 1.529 -} 1.530 - 1.531 -/* Draft */ 1.532 - 1.533 -.draft { 1.534 - line-height: 135%; 1.535 -} 1.536 - 1.537 -.draft h2 { 1.538 - font-size: 135%; 1.539 - font-weight: bold; 1.540 - margin-bottom: 0.5ex; 1.541 -} 1.542 - 1.543 -.draft h3 { 1.544 - font-size: 135%; 1.545 - margin-bottom: 0.5ex; 1.546 -} 1.547 - 1.548 -.draft p { 1.549 - margin-bottom: 1ex; 1.550 -} 1.551 - 1.552 -.draft ul { 1.553 - padding-left: 2em; 1.554 - list-style: disc; 1.555 -} 1.556 - 1.557 -.draft ul li { 1.558 - margin-bottom: 1ex; 1.559 -} 1.560 - 1.561 -xdiv { border: 1px dotted #c00 !important; } 1.562 - 1.563 - 1.564 -</style> 1.565 -</head> 1.566 -</body> 1.567 -<div class="tab1"> 1.568 - <!-- WEBMCP SLOT topnav --> 1.569 -<br style="clear: both;" /> 1.570 -</div> 1.571 - 1.572 -<!-- WEBMCP SLOT sidebar --> 1.573 -<!-- WEBMCP SLOT default --> 1.574 - 1.575 - 1.576 - <div class="layout_trace" id="layout_trace" style="xdisplay: none"> 1.577 - <div id="trace_show" onclick="document.getElementById('trace_content').style.display='block';this.style.display='none';">TRACE</div> 1.578 - <div id="trace_content" style="display: none;"> 1.579 - <tt id="system_error"><!-- WEBMCP SLOT system_error --></tt> 1.580 - <div id="trace"> </div><hr /> 1.581 - <!-- WEBMCP SLOT trace --> 1.582 - <div class="trace_close" onclick="document.getElementById('trace_show').style.display='block';document.getElementById('trace_content').style.display='none';"> 1.583 - close 1.584 - </div> 1.585 + <div class="layout_trace" id="layout_trace" style="xdisplay: none"> 1.586 + <div id="trace_show" onclick="document.getElementById('trace_content').style.display='block';this.style.display='none';">TRACE</div> 1.587 + <div id="trace_content" style="display: none;"> 1.588 + <tt id="system_error"><!-- WEBMCP SLOT system_error --></tt> 1.589 + <div id="trace"> </div><hr /> 1.590 + <!-- WEBMCP SLOT trace --> 1.591 + <div class="trace_close" onclick="document.getElementById('trace_show').style.display='block';document.getElementById('trace_content').style.display='none';"> 1.592 + close 1.593 </div> 1.594 </div> 1.595 </div> 1.596 + </div> 1.597 1.598 -</body> 1.599 -</html> 1.600 +</body></html>