app/soc/content/css/soc-090421.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 td.twolineformfieldlabel {
 176   font-weight: bold;
 177   font-size: small;
 178 }
 179
 180 td.twolineformfielderrorlabel {
 181   font-weight: bold;
 182   color: #FF0000;
 183   font-size: small;
 184 }
 185
 186 td.formfieldvalue {
 187   text-align: left;
 188 }
 189
 190 td.formfieldvalue input {
 191   width: 100%;
 192 }
 193
 194 td.formfieldvalue input[type=checkbox] {
 195   width: auto;
 196 }
 197
 198 td.formfieldvalue input:focus {
 199   background-color: #FFFF99;
 200   font-weight: bold;
 201 }
 202
 203 td.formfieldvalue textarea {
 204   width: 100%;
 205 }
 206
 207 td.formfieldvalue select {
 208   width: 100%;
 209 }
 210
 211 td.formfielderrorlabel, td.warning, span.formfielderrorlabel {
 212   font-weight: bold;
 213   color: #FF0000;
 214   font-size: small;
 215   text-align: right;
 216 }
 217
 218 /* TABLE QUEUES (used with .list) */
 219 table#queues {
 220   border-collapse: collapse;
 221   width: 100%;
 222 }
 223
 224 table#queues tr {
 225   border-bottom: thin solid lightgray;
 226 }
 227
 228 table#queues td {
 229   padding: 2px;
 230 }
 231
 232 /* TOOLTIPS */
 233
 234 #purr-container {
 235   position: fixed;
 236   bottom: 0;
 237   right: 0;
 238 }
 239
 240 .tooltip {
 241   position: relative;
 242   width: 300px;
 243 }
 244
 245 .tooltip .close {
 246   position: absolute;
 247   top: 12px;
 248   right: 12px;
 249   display: block;
 250   width: 18px;
 251   height: 17px;
 252   text-indent: -9999px;
 253   background: url('/soc/content/images/purrClose.png') no-repeat 0 10px;
 254 }
 255
 256 .tooltip-body {
 257   min-height: 50px;
 258   padding: 22px 22px 0 22px;
 259   background: url('/soc/content/images/purrTop.png') no-repeat left top;
 260   color: #f9f9f9;
 261 }
 262
 263 .tooltip-body img {
 264   width: 50px;
 265   margin: 0 10px 0 0;
 266   float: left;
 267 }
 268
 269 .tooltip-body h3 {
 270   margin: 0;
 271   font-size: 1.1em;
 272 }
 273
 274 .tooltip-body p {
 275   margin: 5px 0 0 60px;
 276   font-size: 0.8em;
 277   line-height: 1.4em;
 278 }
 279
 280 .tooltip-bottom {
 281   height: 22px;
 282   background: url('/soc/content/images/purrBottom.png') no-repeat left top;
 283 }
 284
 285 /*
 286  * PAGE ELEMENTS
 287  */
 288
 289 #title {
 290   border-top: 1px solid #3366cc;
 291   background-color: #e5ecf9;
 292   font-size: large;
 293   font-weight: bold;
 294   margin: 0;
 295   padding: 0;
 296   padding-top: 1px;
 297   padding-bottom: 1px;
 298   margin-top: 5px;
 299   margin-left: 200px;
 300   padding-left: 3px;
 301 }
 302
 303 #notice {
 304   margin-left: 200px;
 305   padding: 3px;
 306 }
 307
 308 #logo {
 309   padding-right: 18px;
 310   position: absolute;
 311   left: 0;
 312   top: -5px;
 313 }
 314
 315 #login {
 316   text-align: right;
 317 }
 318
 319 #badge {
 320   clear: both;
 321   margin-top: 3.5em;
 322   margin-bottom: 1em;
 323   height: 53px;
 324   font-style: italic;
 325 }
 326
 327 #body {
 328   border-left: 1px dotted silver;
 329   margin-left: 200px;
 330   margin-right: 25px;
 331   padding-left: 18px;
 332   padding-bottom: 25px;
 333 }
 334
 335 #body .buttons {
 336   margin-right: 4px;
 337   margin-top: 20px;
 338 }
 339
 340 #body a.button, input[type^="submit"], input[type^="button"] {
 341   margin: 0;
 342   padding: 2px 5px 2px 5px;
 343   font-family: Arial, Sans-serif;
 344   font-size: 12px;
 345   text-decoration: none;
 346   color: #222;
 347   cursor: default;
 348   background: #ddd url("/soc/content/images/button-background.gif") repeat-x 0 0;
 349   border: 1px solid #aaa;
 350 }
 351
 352 #body a.button:hover, input[type^="submit"]:hover, input[type^="button"]:hover {
 353   border-color: #9cf #69e #69e #7af;
 354 }
 355
 356 #header {
 357   height: 50px;
 358   margin-bottom: 11px;
 359   position: relative;
 360 }
 361
 362 #footer {
 363   clear: both;
 364   text-align: center;
 365   margin-top: 3.5em;
 366   margin-bottom: 1em;
 367   background-image: url("http://www.google.com/images/art.gif");
 368   height: 53px;
 369   background-repeat: no-repeat;
 370   background-position: left center;
 371   padding-left: 125px;
 372 }
 373
 374 #footer .text {
 375   padding-top: 20px;
 376 }
 377
 378 #created {
 379   font-size: x-small;
 380   color:#C0C0C0;
 381   text-align: right;
 382 }
 383
 384 /* Google Map */
 385 #role_profile_map {
 386   height: 240px;
 387   width: 320px;
 388 }
 389
 390 #org_home_extras {
 391   position: relative;
 392   margin:2em 0em 2em;
 393   min-height:500px;
 394 }
 395
 396 #extras_left {
 397   position: absolute;
 398   width: 55%;
 399   left: 0px;
 400 }
 401
 402 #extras_right {
 403   position: absolute;
 404   width: 43%;
 405   right: 0px;
 406   float: right;
 407 }
 408
 409 /* Organization home gmap */
 410 #org_home_map {
 411   height: 500px;
 412   width: 500px;
 413 }
 414
 415 /* SIDEBAR MENU */
 416 #side {
 417   width: 200px;
 418   margin-bottom: 3em;
 419   float: left;
 420   font-size: small;
 421 }
 422
 423 #menu ul {
 424   margin: 0;
 425   padding: 0;
 426   list-style-type: none;
 427   margin-bottom: 1em;
 428   font-size: 95%;
 429 }
 430
 431 #menu ul ul {
 432   margin-left: 10px;
 433   margin-bottom: 0;
 434 }
 435
 436 #menu li {
 437   margin-top: 4px;
 438   list-style-type: none;
 439   list-style-image: none;
 440 }
 441
 442 #menu img {
 443   margin-right: 4px;
 444 }
 445
 446 #menu li.leaf {
 447   padding-left: 14px;
 448 }
 449
 450 #menu h4 {
 451   margin: 0;
 452   padding: 0;
 453   margin-bottom: 1em;
 454 }
 455
 456 /*  */
 457
 458 span.unread {
 459   font-weight: bold;
 460   color: #FF0000;
 461 }
 462
 463 span.edited {
 464   color: #808080;
 465 }
 466
 467 /* SEARCH FIELD */
 468 #search {
 469   margin-top: 2em;
 470 }
 471
 472 #search .header {
 473   font-weight: bold;
 474   font-size: 90%;
 475   margin-bottom: 1px;
 476 }
 477
 478 #search .button {
 479   margin-top: 1px;
 480 }
 481
 482 #search .input input {
 483   width: 125px;
 484 }
 485
 486 /* BLOG FEEDS */
 487 .blog {
 488   border: 10px solid #e5ecf9;
 489   border-top: 1px solid #3366cc;
 490 }
 491
 492 .blog h2 {
 493   margin-top: 0.1em;
 494   background-color: #e5ecf9;
 495 }
 496
 497 .blog h2 a {
 498   text-decoration: none;
 499   color: black;
 500 }
 501
 502 .blog h2 a:visited {
 503   text-decoration: none;
 504   color: black;
 505 }
 506
 507
 508 .blog .entry {
 509   margin-bottom: 1em;
 510 }
 511
 512 .blog .title {
 513    font-size: medium;
 514 }
 515
 516 .blog .author {
 517   color: gray;
 518   margin-bottom: 0.5em;
 519 }
 520
 521 .blog .snippet {
 522   background-color: white;
 523 }
 524
 525 /* LIST */
 526 .list {
 527   background-color: #E5ECF9;
 528   border: 1px solid  #93b7fa;
 529   border-bottom: 2px solid #93b7fa;
 530   padding: 3px;
 531   -moz-border-radius: 5px 5px 0px 0px;
 532 }
 533
 534 .list .pagination {
 535   text-align: right;
 536   padding: 3px;
 537 }
 538
 539 .list table{
 540   background-color: white;
 541 }
 542
 543 .list table th {
 544   background-color: #eeeeec;
 545   border-right: 1px solid lightgray;
 546   border-top: 1px solid lightgray;
 547 }
 548
 549 .list table tr.on {
 550   background-color: #ff9;
 551   cursor: hand;
 552   cursor: pointer;
 553 }
 554
 555 .list table tr.off {
 556   background-color: #fff;
 557 }
 558
 559 .list table td.last {
 560   border-right: 1px solid lightgray;
 561 }
 562
 563 .list table .first {
 564   border-left: 1px solid lightgray;
 565 }
 566
 567 .list table td.no_hand {
 568   cursor: default;
 569 }
 570
 571 /*
 572  * STUDENT PROPOSAL REVIEWS
 573  */
 574 .studentproposalreview {
 575   font-size: small;
 576 }
 577
 578 .studentproposalreview .title {
 579   background-color: #e5ecf9;
 580 }
 581
 582 .studentproposalreview .student{
 583   background: #d0f5a9;
 584 }
 585
 586 .studentproposalcomment-public,
 587 .studentproposalreview-public .other {
 588   background: #f5f6ce;
 589 }
 590
 591 .studentproposalcomment-private,
 592 .studentproposalreview-private .other {
 593   background: #D2EDF6;
 594 }
 595
 596 /*
 597  * CUSTOM CLASSES
 598  */
 599
 600 .assignedslot {
 601   background-color: #d0f5a9;
 602 }
 603
 604 .todo {
 605   color: #cc0000;
 606   font-size: 80%;
 607 }
 608
 609 .newmark {
 610   color: red;
 611   font-size: 80%;
 612   vertical-align: top;
 613 }
 614
 615 .error {
 616   color: red;
 617 }
 618
 619 .notice {
 620   background:#fad163;
 621   font-size: small;
 622   font-weight: bold;
 623 }
 624
 625 .fieldhelptext {
 626   width: 450px;
 627   background:#fad163;
 628   font-size: small;
 629   border: 1px solid black;
 630 }
 631
 632 .rounded_ul { background: url(/soc/content/images/ul.gif) no-repeat top left; }
 633 .rounded_ur { background: url(/soc/content/images/ur.gif) no-repeat top right; }
 634 .rounded_ll { background: url(/soc/content/images/ll.gif) no-repeat bottom left; }
 635 .rounded_lr { background: url(/soc/content/images/lr.gif) no-repeat bottom right; }
 636
 637 /* Disabled text. */
 638 .disabled {
 639   color: gray;
 640 }
 641
 642 .plaintext {
 643   background:transparent none repeat scroll 0 0;
 644   border:0 none;
 645   color:black;
 646 }