liquid_feedback_frontend
view static/lf2.css @ 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 | |
| children | 1dab81353eb1 | 
 line source
     1 /* CSS reset */
     3 html, body, div, span, applet, object, iframe,
     4 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
     5 a, abbr, acronym, address, big, cite, code,
     6 del, dfn, em, font, img, ins, kbd, q, s, samp,
     7 small, strike, strong, sub, sup, tt, var,
     8 dl, dt, dd, ol, ul, li,
     9 fieldset, form, label, legend,
    10 table, caption, tbody, tfoot, thead, tr, th, td {
    11     margin: 0;
    12     padding: 0;
    13     border: 0;
    14     outline: 0;
    15     font-weight: inherit;
    16     font-style: inherit;
    17     font-size: 100%;
    18     font-family: inherit;
    19     vertical-align: baseline;
    20 }
    21 /* remember to define focus styles! */
    22 :focus {
    23     outline: 0;
    24 }
    25 body {
    26     line-height: 1;
    27     color: black;
    28     background: white;
    29 }
    30 ol, ul {
    31     list-style: none;
    32 }
    33 /* tables still need 'cellspacing="0"' in the markup */
    34 table {
    35     border-collapse: separate;
    36     border-spacing: 0;
    37 }
    38 caption, th, td {
    39     text-align: left;
    40     font-weight: normal;
    41 }
    42 blockquote:before, blockquote:after,
    43 q:before, q:after {
    44     content: "";
    45 }
    46 blockquote, q {
    47     quotes: "" "";
    48 }
    50 /* end CSS reset */
    53 /*
    54     Global settings
    55 */
    56 body {
    57   font-family: sans-serif;
    58   background-color: #7df;
    59   color: #000;
    60 }
    62 a {
    63   background-color: #ffffff;
    64   color: #000;
    65 }
    67 /*
    68     Main top navigation
    69 */
    71 .tab1 {
    72   background-color: #444;
    73   color: #000;
    74 }
    76 .tab1 .right {
    77   float: right;
    78 }
    80 .tab1 a {
    81   float: left;
    82   padding: 0.5ex 0.5em 0.5ex 0.5em;
    83   margin-left: 0.5em;
    84   background-color: #444;
    85   color: #fff;
    86   font-weight: bold;
    87   text-decoration: none;
    88 }
    90 .tab1 .right a {
    91   margin-left: 0;
    92   margin-right: 0.5em;
    93 }
    95 .tab1 a.active {
    96   background-color: #7df;
    97   color: #000;
    98 }
   100 /*
   101     Default slot
   102 */
   104 .slot_default {
   105   margin: 2ex 1% 2ex 32%;
   106   position: relative;
   107   width: 67%;
   108 }
   110 .sidebar_right .slot_default {
   111   margin: 2ex 32% 2ex 1%;
   112 }
   114 /*
   115 Sidebar
   116 */
   118 .slot_sidebar {
   119   margin: 2ex 1% 2ex 1%;
   120   float: left;
   121   width: 30%;
   122 }
   124 .sidebar_right .slot_sidebar {
   125   margin: 0 1% 2ex 1%;
   126   float: right;
   127   width: 30%;
   128 }
   130 .slot_sidebar .box {
   131   width: 100%;
   132 }
   135 /*
   136     Boxes
   137 */
   139 .box a {
   140   text-decoration: none;
   141   color: #46a;
   142 }
   144 .boxhead,
   145 a.boxhead {
   146   /* position */
   147   display: block;
   148   margin-bottom: 0.5ex;
   149   margin-top: 1ex;
   150   margin-left: 0.5em;
   152   /* color */
   153   background-color: #7df;
   154   color: #000;
   156   /* text format */
   157   font-weight: bold;
   158   text-shadow: 2px 2px 2px #fff;
   159 }
   161 .box {
   162   /* position */
   163   position: relative;
   164   width: 100%;
   165   margin-bottom: 2ex;
   167   /* border and shadow*/
   168   border-radius: 1ex;
   169   -moz-border-radius: 1ex;
   170   -webkit-box-shadow: 2px 2px 3px 0px #444;
   171   -moz-box-shadow: 2px 2px 3px 0px #444;
   173   /* color */
   174   background-color: #fff;
   175   color: #000;
   177 }
   179 .box .row {
   180   overflow: auto;
   181   /* position */
   183   /* border */
   184   border-top: 1px solid #ccc;
   185 }
   187 .box .row .col {
   188   /* position */
   189   padding: 0.5ex 0.2em 0.5ex 0.2em;
   191   /* text format */
   192   line-height: 125%;
   193 }
   195 .box .row .col.left {
   196   float: left;
   197 }
   199 .box .row .col.right {
   200   float: right;
   201 }
   203 .box .row .col.clearleft {
   204   clear: left;
   205 }
   207 .box .row .col.clearright {
   208   clear: right;
   209 }
   211 .box .row .col.toggle {
   212   float: left;
   213   /* position */
   214   padding-left: 0.4em;
   215 }
   217 .box .row .col.toggle:hover {
   218   /* color */
   219   background-color: #7cf;
   221   /* cursor */
   222   cursor: pointer;
   223 }
   225 .box .row.first .col.toggle {
   226   /* border */
   227   border-radius: 1ex 0 0 0;
   228 }
   230 .box .row.last .col.toggle {
   231   /* border */
   232   border-radius: 0 0 0 1ex;
   233 }
   235 .box .row.toggled .col.first {
   236   /* position */
   237   margin-left: 1.5em;
   238 }
   240 .box .row.first {
   241   /* border */
   242   border-top: none;
   243 }
   245 .box .row .col.first {
   246   /* position */
   247   padding-left: 0.5em;
   248 }
   250 .box .row.toggled .col.first {
   251   /* position */
   252   padding-left: 0.2em;
   253 }
   255 .box .row.head {
   256   background-color: #e4e7f0;
   257   color: #000;
   258   border-radius: 1ex 1ex 0 0;
   259 }
   261 .box .row.last {
   262   border-radius: 0 0 1ex 1ex;
   263 }
   265 .box .row.head .col.head {
   266   font-weight: bold;
   267   color: #444;
   268 }
   270 .box .row.head .col a {
   271   background-color: #e4e7f0;
   272   color: #3B6E7F;
   273 }
   275 .box .row.head2 {
   276   background-color: #f2f3f7;
   277   color: #000;
   278 }
   280 .box .row.head2 .col a {
   281   background-color: #f2f3f7;
   282   color: #3B6E7F;
   283 }
   286 .box .row .col a {
   287   color: #3B6E7F;
   288 }
   290 .box .row.active,
   291 .box .row.active a {
   292   background-color: #DDF7FF;
   293 }
   295 /* Sidebar hover button */
   297 .hoverbutton_container {
   298   position: relative;
   299 }
   302 .hoverbutton {
   303   /* position */
   304   display: none;
   305   position: absolute;
   306   top: 0px;
   307   left: 0px;
   308   height: 100%;
   309   width: 100%;
   311   /* color */
   312   background-color: #fff;
   314   /* text format */
   315   font-weight: bold;
   317   /* cursor */
   318   cursor: pointer;
   319 }
   321 .hoverbutton_container:hover .hoverbutton {
   322   /* position */
   323   display: block;
   324 }
   326 .hoverbutton_container:hover .hoverbutton img {
   327   /* text format */
   328   vertical-align: middle;
   329 }
   331 .hoverbutton_container:hover .hoverbutton.noaction {
   332   /* color */
   333   background-color: #ccc;
   335   /* cursor */
   336   cursor: default;
   337 }
   339 .hoverbutton_container:hover .hoverbutton.green {
   340   background-color: #cfc;
   341 }
   343 .hoverbutton_container:hover .hoverbutton.red {
   344   background-color: #fcc;
   345 }
   347 .hoverbutton .content {
   348   /* position */
   349   padding: 0.5ex 0.2em 0.5ex 0.5em;
   350 }
   352 /* Scrolled col */
   354 .box .row .col.scrolled {
   355   padding: 0;
   356   max-height: 300px;
   357   overflow: auto;
   358 }
   360 .box .row .col.scrolled .head {
   361   font-weight: bold;
   362   padding: 0.5ex 0.2em 0.5ex 0.5em;
   363 }
   365 /*
   366   Bars
   367 */
   369 .bar {
   370   float: right;
   371   margin-left: 0.3em;
   372 }
   374 .bar div {
   375   margin-top: 2px;
   376   float: left;
   377   height: 11px;
   378 }
   379 .bar .green {
   380   background-color: #0a0;
   381 }
   383 .bar .grey {
   384   background-color: #eee;
   385 }
   387 /*
   388     Avatars
   389 */
   391 .avatars {
   392   overflow: auto;
   393 }
   395 .avatars .avatar {
   396   float: left;
   397   margin-left: 2px;
   398   margin-right: 2px;
   399 }
   401 .avatars.normal .avatar {
   402   width: 100px;
   403   -webkit-box-shadow: 1px 1px 1px #000;
   404   background-color: #eee;
   405   border-radius: 1ex;
   406   -moz-border-radius: 1ex;
   407 }
   409 .avatars.small .avatar {
   410   border: 2px solid #fff;
   411   border-radius: 0.5ex;
   412   -moz-border-radius: 0.5ex;
   413 }
   415 .avatars .arrow {
   416   float: left;
   417   margin-top: 0.3ex;
   418 }
   420 .avatars .avatar.myweight {
   421   border-color: #f70;
   422   background-color: #f70;
   423 }
   425 .avatars .avatar.autoreject {
   426   border-color: #f00;
   427   background-color: #f00;
   428 }
   430 .avatars.small .avatar img {
   431   border-radius: 0.25ex;
   432   -moz-border-radius: 0.25ex;
   433 }
   435 .avatars.normal .avatar img {
   436   margin-left: 0.3em;
   437   margin-top: 0.3ex;
   438   border-radius: 1ex;
   439   -moz-border-radius: 1ex;
   440 }
   442 .avatars.small .avatar img {
   443   height: 24px;
   444   width: 24px;
   445 }
   447 .avatars.normal .avatar img {
   448   height: 48px;
   449   width: 48px;
   450 }
   452 .avatars.normal .avatar .name {
   453   margin-left: 0.3em;
   454   margin-top: 0.3ex;
   455   line-height: 100%;
   456   font-size: 70%;
   457   overflow: hidden;
   458   height: 4ex;
   459 }
   461 .avatars .avatar .weight {
   462   text-align: center;
   463   font-size: 70%;
   464 }
   466 .avatars.small .avatar.participation {
   467   border-color: #f70;
   468 }
   470 .avatars.small .avatar.overridden,
   471 .avatars.small .arrow.overridden {
   472   opacity: 0.3;
   473 }
   475 /*
   476   Area
   477 */
   479 .area .name {
   480   color: #444;
   481 }
   483 .area .name a {
   484   font-weight: normal;
   485 }
   487 .area .name .avatars {
   488   float: right;
   489   margin-top: -3px;
   490 }
   492 /* Initiatives */
   494 .initiative .name,
   495 .initiative a.name {
   496   font-weight: bold;
   497 }
   499 .initiative .authors {
   500   /* color */
   501   color: #777;
   503   /* text format */
   504   font-size: 80%;
   505   font-style: italic;
   506 }
   508 .initiative .authors a {
   509   /* color */
   510 }
   512 .drafts .draft .created {
   513   font-weight: bold;
   514 }
   516 .drafts .draft .author_name {
   517   font-style: italic;
   518 }
   520 /* Draft */
   522 .draft {
   523   line-height: 135%;
   524 }
   526 .draft h2 {
   527   font-size: 135%;
   528   font-weight: bold;
   529   margin-bottom: 0.5ex;
   530 }
   532 .draft h3 {
   533   font-size: 135%;
   534   margin-bottom: 0.5ex;
   535 }
   537 .draft p {
   538   margin-bottom: 1ex;
   539 }
   541 .draft ul {
   542   padding-left: 2em;
   543   list-style: disc;
   544 }
   546 .draft ul li {
   547   margin-bottom: 1ex;
   548 }
