liquid_feedback_frontend

diff static/style.css @ 4:80c215dbf076

Version alpha5

Many optical changes and improved usability

Support for different wiki-formatting-engines

Help system
author bsw/jbe
date Thu Dec 10 12:00:00 2009 +0100 (2009-12-10)
parents 768faea1096d
children afd9f769c7ae
line diff
     1.1 --- a/static/style.css	Mon Nov 30 12:00:00 2009 +0100
     1.2 +++ b/static/style.css	Thu Dec 10 12:00:00 2009 +0100
     1.3 @@ -60,31 +60,27 @@
     1.4  .layout_notice, .layout_error, .layout_warning {
     1.5          background: #fff;
     1.6          font-weight: bold;
     1.7 -        right: 2ex;
     1.8          line-height: 1.7em;
     1.9 -        position: absolute;
    1.10 -        top: 6ex;
    1.11 -        width: 60ex;
    1.12          -moz-opacity:0.7;
    1.13  }
    1.14  
    1.15  .slot_notice, .slot_warning, .slot_error {
    1.16 -        padding: 2ex;
    1.17 +        padding-left: 1em;
    1.18  }
    1.19  
    1.20  .slot_notice {
    1.21 -        color: green;
    1.22 -        border: 2px solid green;
    1.23 +        background-color: #cfc;
    1.24 +        color: #040;
    1.25  }
    1.26  
    1.27  .slot_warning {
    1.28 -        color: orange;
    1.29 -        border: 2px solid orange;
    1.30 +        background-color: #fec;
    1.31 +        color: #420;
    1.32  }
    1.33  
    1.34  .slot_error {
    1.35 -        color: red;
    1.36 -        border: 2px solid red;
    1.37 +        background-color: #fcc;
    1.38 +        color: #400;
    1.39  }
    1.40  
    1.41  /*************************************************************************
    1.42 @@ -92,7 +88,6 @@
    1.43   */
    1.44  
    1.45  .topbar {
    1.46 -  margin-bottom: 1em;
    1.47    background-color: #444;
    1.48    color: #fff;
    1.49    font-size: 75%;
    1.50 @@ -161,17 +156,21 @@
    1.51   */
    1.52  
    1.53  .title_bar {
    1.54 -  border-bottom: 1px solid #000;
    1.55 +  border-bottom: 1px solid #777;
    1.56    margin-bottom: 2ex;
    1.57 +  padding-top: 1ex;
    1.58 +  padding-bottom: 0.5ex;
    1.59 +}
    1.60 +
    1.61 +.title_bar_content {
    1.62 +  margin-left: 1em;
    1.63  }
    1.64  
    1.65  .path {
    1.66    color: #444;
    1.67 -  xbackground-color: #ddd;
    1.68  }
    1.69  
    1.70  .path div {
    1.71 -  margin-left: 1em;
    1.72    font-size: 100%;
    1.73    line-height: 180%;
    1.74  }
    1.75 @@ -195,7 +194,6 @@
    1.76  }
    1.77  
    1.78  .title div {
    1.79 -  margin-left: 0.66em;
    1.80    font-weight: bold;
    1.81    font-size: 135%;
    1.82    line-height: 110%;
    1.83 @@ -205,25 +203,23 @@
    1.84    color: #fff;
    1.85  }
    1.86  
    1.87 -.avatar {
    1.88 +.member_image_avatar {
    1.89    float: left;
    1.90    margin-right: 0.5em;
    1.91 -  width: 48px;
    1.92 -  height: 48px;
    1.93  }
    1.94  
    1.95  .actions {
    1.96 -  display: inline;
    1.97    font-size: 75%;
    1.98 -  line-height: 200%;
    1.99 +  line-height: 220%;
   1.100  }
   1.101  
   1.102  .slot_actions {
   1.103 -  margin-left: 1em;
   1.104    display: inline;
   1.105  }
   1.106  
   1.107  .actions a {
   1.108 +  float: left;
   1.109 +  display: block;
   1.110    padding: 0.5ex 0.5em 0.5ex 0.0em;
   1.111    margin-right: 1em;
   1.112    vertical-align: middle;
   1.113 @@ -236,37 +232,70 @@
   1.114  .actions img {
   1.115    padding-left: 0.2em;
   1.116    padding-right: 0.2em;
   1.117 +  vertical-align: middle;
   1.118 +}
   1.119 +
   1.120 +.logo { 
   1.121 +  float: right;
   1.122 +  margin-right: 1em;
   1.123  }
   1.124  
   1.125  /*************************************************************************
   1.126   * vote info / delegation 
   1.127   */
   1.128  
   1.129 -.slot_interest,
   1.130 +.interest,
   1.131  .slot_support,
   1.132 -.slot_delegation {
   1.133 +.delegation {
   1.134    float: left;
   1.135 -  font-size: 75%;
   1.136 +  position: relative;
   1.137 +}
   1.138 +
   1.139 +.interest img,
   1.140 +.slot_support img,
   1.141 +.delegation img {
   1.142 +  padding-left: 0.2em;
   1.143 +  padding-right: 0.2em;
   1.144 +}
   1.145 +.vote_info .head {
   1.146 +  float: left;
   1.147    margin-right: 1em;
   1.148  }
   1.149  
   1.150 -.vote_info .head {
   1.151 -  line-height: 200%;
   1.152 +.interest .head_active {
   1.153 +  background-color: #dfd;
   1.154 +  border: 1px solid #8b8;
   1.155 +}
   1.156 +
   1.157 +.slot_support .head_active {
   1.158 +  background-color: #dfd;
   1.159 +  border: 1px solid #8b8;
   1.160 +}
   1.161 +
   1.162 +.delegation .head_active {
   1.163 +  background-color: #ffd;
   1.164 +  border: 1px solid #bb8;
   1.165  }
   1.166  
   1.167  .vote_info .close {
   1.168 -  background-color: #f44;
   1.169 -  float: right;
   1.170 +  position: absolute;
   1.171 +  top: 0;
   1.172 +  right: 0;
   1.173    padding: 1ex;
   1.174 +  display: block;
   1.175  }
   1.176  
   1.177  .vote_info .content {
   1.178 +  font-size: 133%;
   1.179 +  line-height: 100%;
   1.180 +  top: 3ex;
   1.181    display: none;
   1.182    position: absolute;
   1.183    z-index: 10;
   1.184    background-color: #fff;
   1.185 -  border: 2px solid #444;
   1.186 +  border: 1px solid #999;
   1.187    padding: 1em;
   1.188 +  width: 25em;
   1.189  }
   1.190  
   1.191  .vote_info .delegation_arrow {
   1.192 @@ -275,6 +304,14 @@
   1.193    vertical-align: middle;
   1.194  }
   1.195  
   1.196 +.vote_info .delegation_arrow_overridden {
   1.197 +  opacity: 0.4;
   1.198 +}
   1.199 +
   1.200 +.vote_info .delegation_scope_overridden {
   1.201 +  color: #777;
   1.202 +}
   1.203 +
   1.204  .vote_info .delegation_scope {
   1.205    display: inline;
   1.206  }
   1.207 @@ -286,14 +323,29 @@
   1.208    clear: left;
   1.209  }
   1.210  
   1.211 +.delegation_overridden .member_thumb {
   1.212 +  opacity: 0.4;
   1.213 +}
   1.214 +
   1.215  .delegation .revoke {
   1.216    margin: 0.5ex;
   1.217 +  float: right;
   1.218  }
   1.219  
   1.220  .delegation .revoke img {
   1.221    vertical-align: middle;
   1.222  }
   1.223  
   1.224 +
   1.225 +.sub_title div {
   1.226 +  border-top: 1px solid #444;
   1.227 +  padding-top: 1ex;
   1.228 +  margin-top: 1ex;
   1.229 +  font-weight: bold;
   1.230 +  font-size: 135%;
   1.231 +  line-height: 110%;
   1.232 +}
   1.233 +
   1.234  /*************************************************************************
   1.235   * Main content
   1.236   */
   1.237 @@ -315,8 +367,9 @@
   1.238  
   1.239  .ui_tabs_links a {
   1.240    padding: 1ex;
   1.241 -  margin-left: 0.5em;
   1.242 +  line-height: 200%;
   1.243    background-color: #e7e7e7;
   1.244 +  white-space: nowrap;
   1.245  }
   1.246  
   1.247  .ui_tabs_links a:hover {
   1.248 @@ -401,6 +454,25 @@
   1.249    height: 1.3ex;
   1.250  }
   1.251  
   1.252 +.bargraph_legend {
   1.253 +  margin-top: 2ex;
   1.254 +}
   1.255 +
   1.256 +.bargraph_legend .bargraph {
   1.257 +  width: 26px;
   1.258 +}
   1.259 +
   1.260 +.bargraph_legend div,
   1.261 +.bargraph_legend div div,
   1.262 +.bargraph_legend div div div {
   1.263 +  float: left;
   1.264 +}
   1.265 +
   1.266 +.bargraph_legend_label {
   1.267 +  margin-left: 0.5em;
   1.268 +  margin-right: 1em;
   1.269 +}
   1.270 +
   1.271  /*************************************************************************
   1.272   * vertical ui.form
   1.273   */
   1.274 @@ -432,7 +504,7 @@
   1.275  .vertical .ui_field_label {
   1.276    text-transform: uppercase;
   1.277    font-size: 70%;
   1.278 -  line-height: 190%;
   1.279 +  line-height: 120%;
   1.280    font-weight: bold;
   1.281    color: #777;
   1.282    width: 15em;
   1.283 @@ -631,10 +703,22 @@
   1.284  
   1.285  .member_thumb {
   1.286    text-decoration: none;
   1.287 -  min-width: 150px;
   1.288 +  width: 18em;
   1.289 +  height: 48px;
   1.290    display: block;
   1.291    float: left;
   1.292 -  border: 1px solid #ccc;
   1.293 +  border: 1px solid #999;
   1.294 +  overflow: hidden;
   1.295 +  xwhite-space: nowrap;
   1.296 +  position: relative;
   1.297 +}
   1.298 +
   1.299 +.member_thumb a{
   1.300 +  position: absolute;
   1.301 +  top: 0;
   1.302 +  left: 0;
   1.303 +  padding: 0;
   1.304 +  margin: 0;
   1.305  }
   1.306  
   1.307  .member_thumb a:hover div {
   1.308 @@ -642,25 +726,24 @@
   1.309    color: #fff;
   1.310  }
   1.311  
   1.312 -.member_thumb .flags a:hover {
   1.313 -  background-color: #444;
   1.314 -  color: #fff;
   1.315 -}
   1.316 -
   1.317  .member_thumb img {
   1.318 -  margin-right: 0.5em;
   1.319 +  padding: 0;
   1.320 +  margin: 0;
   1.321    vertical-align: bottom;
   1.322 -  float: left;
   1.323  }
   1.324  
   1.325  .member_thumb div {
   1.326 -  display: inline;
   1.327 +}
   1.328 +
   1.329 +.member_thumb .member_image {
   1.330  }
   1.331  
   1.332  .member_thumb .member_name {
   1.333 -  display: block;
   1.334 -  margin-top: 3ex;
   1.335 -  margin-right: 0.5em;
   1.336 +  position: absolute;
   1.337 +  left: 48px;
   1.338 +  top: 2ex;
   1.339 +  font-size: 100%;
   1.340 +  width: 14em;
   1.341  }
   1.342  
   1.343  .member_thumb .flags {
   1.344 @@ -668,10 +751,22 @@
   1.345    font-size: 75%;
   1.346  }
   1.347  
   1.348 -.draft_content {
   1.349 +.member_thumb .flags a{
   1.350 +  position: static;
   1.351 +  float: right;
   1.352 +}
   1.353 +
   1.354 +
   1.355 +.member .right {
   1.356 +  float: right;
   1.357 +}
   1.358 +
   1.359 +.draft_content,
   1.360 +.member_statement {
   1.361    background-color: #eee;
   1.362    border: 1px solid #ccc;
   1.363 -  padding: 1ex;
   1.364 +  padding-left: 1ex;
   1.365 +  padding-right: 1ex;
   1.366  }
   1.367  
   1.368  .diff {
   1.369 @@ -715,3 +810,73 @@
   1.370    padding: 1ex;
   1.371  }
   1.372  
   1.373 +.suggestion_fulfilled {
   1.374 +  width: 15em;
   1.375 +}
   1.376 +.suggestion_fulfilled a.action {
   1.377 +  padding-left: 0;
   1.378 +  line-height: 120%;
   1.379 +}
   1.380 +
   1.381 +.help {
   1.382 +  border: 1px solid #bcd;
   1.383 +  background-color: #def;
   1.384 +  color: #000;
   1.385 +  padding: 1ex;
   1.386 +}
   1.387 +
   1.388 +.help_visible {
   1.389 +  margin-bottom: 1ex;
   1.390 +}
   1.391 +
   1.392 +.help_visible .help_icon {
   1.393 +  float: right;
   1.394 +}
   1.395 +
   1.396 +.slot_help_hidden {
   1.397 +  float: right;
   1.398 +  margin-right: 1em;
   1.399 +}
   1.400 +
   1.401 +.help_actions {
   1.402 +  font-size: 75%;
   1.403 +  float: right;
   1.404 +}
   1.405 +
   1.406 +.help_actions a {
   1.407 +  margin-right: 1em;
   1.408 +  color: #468;
   1.409 +}
   1.410 +
   1.411 +.wiki {
   1.412 +}
   1.413 +
   1.414 +.wiki h1,
   1.415 +.wiki h2,
   1.416 +.wiki h3,
   1.417 +.wiki h4 {
   1.418 +  margin-top: 1ex;
   1.419 +  margin-bottom: 1ex;
   1.420 +}
   1.421 +
   1.422 +.wiki h1 {
   1.423 +  font-size: 150%;
   1.424 +}
   1.425 +
   1.426 +.wiki h2 {
   1.427 +  font-size: 125%;
   1.428 +}
   1.429 +
   1.430 +.wiki p {
   1.431 +  margin-top: 1ex;
   1.432 +  margin-bottom: 1ex;
   1.433 +}
   1.434 +
   1.435 +form .warning {
   1.436 +  background-color: #ffd;
   1.437 +  color: #000;
   1.438 +  border: 1px solid #dda;
   1.439 +  margin: 1ex;
   1.440 +  margin-bottom: 2ex;
   1.441 +  padding: 1ex;
   1.442 +}

Impressum / About Us