app/soc/content/css/soc-090120.css

   1 /*
   2 Copyright 2009 the Melange authors.
   3
   4 Licensed under the Apache License, Version 2.0 (the "License");
   5 you may not use this file except in compliance with the License.
   6 You may obtain a copy of the License at
   7
   8   http://www.apache.org/licenses/LICENSE-2.0
   9
  10 Unless required by applicable law or agreed to in writing, software
  11 distributed under the License is distributed on an "AS IS" BASIS,
  12 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13 See the License for the specific language governing permissions and
  14 limitations under the License.
  15  */
  16
  17 /*
  18  * STANDARD HTML TAGS
  19  */
  20
  21 body {
  22   background-color: white;
  23   color: black;
  24
  25   font-family: Arial, sans-serif;
  26   font-size: medium;
  27
  28   margin: 8px;
  29   margin-top: 3px;
  30 }
  31
  32 img {
  33   border: 0;
  34 }
  35
  36 form {
  37   margin: 0;
  38   padding: 0;
  39 }
  40
  41 li {
  42   margin-bottom: 0.25em;
  43 }
  44
  45 /* HEADERS */
  46 h1 {
  47   font-size: x-large;
  48   margin-top: 0px;
  49 }
  50
  51 h2 {
  52   font-size: large;
  53 }
  54
  55 h3 {
  56   font-size: medium;
  57 }
  58
  59 h4 {
  60   font-size: small;
  61 }
  62
  63 /* PRE-FORMATTED TEXT */
  64 pre, code {
  65   color: #007000;
  66   font-family: "bogus font here", monospace;
  67   font-size: 100%;
  68 }
  69
  70 pre {
  71   border: 1px solid silver;
  72   background-color: #f5f5f5;
  73   padding: 0.5em;
  74   overflow: auto;
  75   margin: 2em;
  76 }
  77
  78 pre ins {
  79   color: #cc0000;
  80   font-weight: bold;
  81   text-decoration: none;
  82 }
  83
  84 /* LINKS AND ANCHORS */
  85 a:link {
  86   color: #0000cc;
  87 }
  88
  89 a:active {
  90   color: #cc0000;
  91 }
  92
  93 a:visited {
  94   color: #551a8b;
  95 }
  96
  97 a.selected, .selected a, .selected {
  98   color: black;
  99   font-weight: bold;
 100   text-decoration: none;
 101 }
 102
 103 a.novisit {
 104   color: #2a55a3;
 105 }
 106
 107 a.noul, a.noulv {
 108   color: #4182fa; /* #93b7fa; */
 109   text-decoration: none;
 110 }
 111
 112 a:hover.noul {
 113   text-decoration: underline;
 114 }
 115
 116 a:visited.noul {
 117   color: #a32a91; /* #2a55a3; */
 118 }
 119
 120
 121 /* Styles used by Django Forms */
 122 ul.errorlist {
 123   color: #FF0000;
 124   font-size: small;
 125 }
 126
 127
 128 /* TABLES */
 129 table {
 130   border-collapse: collapse;
 131 }
 132
 133 th, td {
 134   /*padding: 0;*/
 135   padding:2px 5px;
 136   vertical-align: top;
 137   text-align: left;
 138 }
 139
 140 /* FORM FIELDS */
 141 td.formfieldrequired {
 142   font-style: italic;
 143   font-size: small;
 144   text-align: center;
 145 }
 146
 147 td.formfieldhelptext {
 148   font-style: italic;
 149   font-size: small;
 150   padding: 5px;
 151 }
 152
 153 td.formfielderror {
 154   color: #FF0000;
 155   font-size: small;
 156 }
 157
 158 td.formfieldheading {
 159   font-weight: bold;
 160   font-size: small;
 161 }
 162
 163 td.formfieldlabel {
 164   font-weight: bold;
 165   font-size: small;
 166   text-align: right;
 167 }
 168
 169 td.twolineformfieldlabel {
 170   font-weight: bold;
 171   font-size: small;
 172   text-align: left;
 173 }
 174
 175
 176 td.twolineformfieldlabel {
 177   font-weight: bold;
 178   font-size: small;
 179 }
 180
 181 td.formfieldvalue {
 182   text-align: left;
 183 }
 184
 185 td.formfieldvalue input {
 186   width: 200px;
 187 }
 188
 189 td.formfieldvalue input:focus {
 190   background-color: #FFFF99;
 191   font-weight: bold;
 192 }
 193
 194 td.formfieldvalue textarea {
 195   width: 100%;
 196 }
 197
 198 td.formfieldvalue select {
 199   width: 100%;
 200 }
 201
 202 td.formfielderrorlabel, td.warning, span.formfielderrorlabel {
 203   font-weight: bold;
 204   color: #FF0000;
 205   font-size: small;
 206 }
 207
 208 /* TABLE QUEUES (used with .list) */
 209 table#queues {
 210   border-collapse: collapse;
 211   width: 100%;
 212 }
 213
 214 table#queues tr {
 215   border-bottom: thin solid lightgray;
 216 }
 217
 218 table#queues td {
 219   padding: 2px;
 220 }
 221
 222 /*
 223  * PAGE ELEMENTS
 224  */
 225
 226 #title {
 227   border-top: 1px solid #3366cc;
 228   background-color: #e5ecf9;
 229   font-size: large;
 230   font-weight: bold;
 231   margin: 0;
 232   padding: 0;
 233   padding-top: 1px;
 234   padding-bottom: 1px;
 235   margin-top: 5px;
 236   margin-left: 200px;
 237   padding-left: 3px;
 238 }
 239
 240 #notice {
 241   margin-left: 200px;
 242   padding: 3px;
 243 }
 244
 245 #logo {
 246   padding-right: 18px;
 247   position: absolute;
 248   left: 0;
 249   top: -5px;
 250 }
 251
 252 #login {
 253   text-align: right;
 254 }
 255
 256 #badge {
 257   clear: both;
 258   margin-top: 3.5em;
 259   margin-bottom: 1em;
 260   height: 53px;
 261   font-style: italic;
 262 }
 263
 264 #body {
 265   border-left: 1px dotted silver;
 266   margin-left: 200px;
 267   margin-right: 25px;
 268   padding-left: 18px;
 269   padding-bottom: 25px;
 270 }
 271
 272 #body .buttons {
 273   margin-right: 4px;
 274   margin-top: 20px;
 275 }
 276
 277 #body a.button, input[type^="submit"], input[type^="button"] {
 278   margin: 0;
 279   padding: 2px 5px 2px 5px;
 280   font-family: Arial, Sans-serif;
 281   font-size: 12px;
 282   text-decoration: none;
 283   color: #222;
 284   cursor: default;
 285   background: #ddd url("/soc/content/images/button-background.gif") repeat-x 0 0;
 286   border: 1px solid #aaa;
 287 }
 288
 289 #body a.button:hover, input[type^="submit"]:hover, input[type^="button"]:hover {
 290   border-color: #9cf #69e #69e #7af;
 291 }
 292
 293 #header {
 294   height: 50px;
 295   margin-bottom: 11px;
 296   position: relative;
 297 }
 298
 299 #footer {
 300   clear: both;
 301   text-align: center;
 302   margin-top: 3.5em;
 303   margin-bottom: 1em;
 304   background-image: url("http://www.google.com/images/art.gif");
 305   height: 53px;
 306   background-repeat: no-repeat;
 307   background-position: left center;
 308   padding-left: 125px;
 309 }
 310
 311 #footer .text {
 312   padding-top: 20px;
 313 }
 314
 315 #created {
 316   font-size: x-small;
 317   color:#C0C0C0;
 318   text-align: right;
 319 }
 320
 321 /* Google Map */
 322 #role_profile_map {
 323   height: 240px;
 324   width: 320px;
 325 }
 326
 327 /* SIDEBAR MENU */
 328 #side {
 329   width: 200px;
 330   margin-bottom: 3em;
 331   float: left;
 332   font-size: small;
 333 }
 334
 335 #menu ul {
 336   margin: 0;
 337   padding: 0;
 338   list-style-type: none;
 339   margin-bottom: 1em;
 340   font-size: 95%;
 341 }
 342
 343 #menu ul ul {
 344   margin-left: 10px;
 345   margin-bottom: 0;
 346 }
 347
 348 #menu li {
 349   margin-top: 4px;
 350   list-style-type: none;
 351   list-style-image: none;
 352 }
 353
 354 #menu img {
 355   margin-right: 4px;
 356 }
 357
 358 #menu li.leaf {
 359   padding-left: 14px;
 360 }
 361
 362 #menu h4 {
 363   margin: 0;
 364   padding: 0;
 365   margin-bottom: 1em;
 366 }
 367
 368 /*  */
 369
 370 span.unread {
 371   font-weight: bold;
 372   color: #FF0000;
 373 }
 374
 375 span.edited {
 376   color: #808080;
 377 }
 378
 379 /* SEARCH FIELD */
 380 #search {
 381   margin-top: 2em;
 382 }
 383
 384 #search .header {
 385   font-weight: bold;
 386   font-size: 90%;
 387   margin-bottom: 1px;
 388 }
 389
 390 #search .button {
 391   margin-top: 1px;
 392 }
 393
 394 #search .input input {
 395   width: 125px;
 396 }
 397
 398 /* BLOG FEEDS */
 399 .blog {
 400   border: 10px solid #e5ecf9;
 401   border-top: 1px solid #3366cc;
 402 }
 403
 404 .blog h2 {
 405   margin-top: 0.1em;
 406   background-color: #e5ecf9;
 407 }
 408
 409 .blog h2 a {
 410   text-decoration: none;
 411   color: black;
 412 }
 413
 414 .blog h2 a:visited {
 415   text-decoration: none;
 416   color: black;
 417 }
 418
 419
 420 .blog .entry {
 421   margin-bottom: 1em;
 422 }
 423
 424 .blog .title {
 425    font-size: medium;
 426 }
 427
 428 .blog .author {
 429   color: gray;
 430   margin-bottom: 0.5em;
 431 }
 432
 433 .blog .snippet {
 434   background-color: white;
 435 }
 436
 437 /* LIST */
 438 .list {
 439   background-color: #E5ECF9;
 440   border: 1px solid  #93b7fa;
 441   border-bottom: 2px solid #93b7fa;
 442   padding: 3px;
 443   -moz-border-radius: 5px 5px 0px 0px;
 444 }
 445
 446 .list .pagination {
 447   text-align: right;
 448   padding: 3px;
 449 }
 450
 451 .list table{
 452   background-color: white;
 453 }
 454
 455 .list table th {
 456   background-color: #eeeeec;
 457   border-right: 1px solid lightgray;
 458   border-top: 1px solid lightgray;
 459 }
 460
 461 .list table tr.on {
 462   background-color: #ff9;
 463 }
 464
 465 .list table tr.off {
 466   background-color: #fff;
 467 }
 468
 469 .list table td.last {
 470   border-right: 1px solid lightgray;
 471 }
 472
 473 .list table .first {
 474   border-left: 1px solid lightgray;
 475 }
 476
 477 /*
 478  * CUSTOM CLASSES
 479  */
 480
 481 .todo {
 482   color: #cc0000;
 483   font-size: 80%;
 484 }
 485
 486 .newmark {
 487   color: red;
 488   font-size: 80%;
 489   vertical-align: top;
 490 }
 491
 492 .error {
 493   color: red;
 494 }
 495
 496 .notice {
 497   background:#fad163;
 498   font-size: small;
 499   font-weight: bold;
 500 }
 501
 502 .fieldhelptext {
 503   width: 450px;
 504   background:#fad163;
 505   font-size: small;
 506   border: 1px solid black;
 507 }
 508
 509 .rounded_ul { background: url(/soc/content/images/ul.gif) no-repeat top left; }
 510 .rounded_ur { background: url(/soc/content/images/ur.gif) no-repeat top right; }
 511 .rounded_ll { background: url(/soc/content/images/ll.gif) no-repeat bottom left; }
 512 .rounded_lr { background: url(/soc/content/images/lr.gif) no-repeat bottom right; }
 513
 514 /* Disabled text. */
 515 .disabled {
 516   color: gray;
 517 }
 518
 519 .plaintext {
 520   background:transparent none repeat scroll 0 0;
 521   border:0 none;
 522   color:black;
 523 }