misc/drupal.css

   1 /* $Id: drupal.css 144 2007-03-28 07:52:20Z thierry $ */
   2
   3 /*
   4 ** HTML elements
   5 */
   6 fieldset {
   7   margin-bottom: 1em;
   8   padding: .5em;
   9 }
  10 form {
  11   margin: 0;
  12   padding: 0;
  13 }
  14 hr {
  15   height: 1px;
  16   border: 1px solid gray;
  17 }
  18 img {
  19   border: 0;
  20 }
  21 table {
  22   border-collapse: collapse;
  23 }
  24 th {
  25   text-align: left;
  26   padding-right: 1em;
  27   border-bottom: 3px solid #ccc;
  28 }
  29 th.active img {
  30   display: inline;
  31 }
  32 tr.even, tr.odd {
  33   background-color: #eee;
  34   border-bottom: 1px solid #ccc;
  35 }
  36 tr.even, tr.odd {
  37   padding: 0.1em 0.6em;
  38 }
  39 td.active {
  40   background-color: #ddd;
  41 }
  42
  43 /*
  44 ** Menu styles
  45 */
  46 ul.menu {
  47   list-style: none;
  48   border: none;
  49   text-align:left;
  50 }
  51 ul.menu li {
  52   margin: 0 0 0 0.5em;
  53 }
  54 li.expanded {
  55   list-style-type: circle;
  56   list-style-image: url(menu-expanded.png);
  57   padding: 0.2em 0.5em 0 0;
  58   margin: 0;
  59 }
  60 li.collapsed {
  61   list-style-type: disc;
  62   list-style-image: url(menu-collapsed.png);
  63   padding: 0.2em 0.5em 0 0;
  64   margin: 0;
  65 }
  66 li.leaf {
  67   list-style-type: square;
  68   list-style-image: url(menu-leaf.png);
  69   padding: 0.2em 0.5em 0 0;
  70   margin: 0;
  71 }
  72 li a.active {
  73   color: #000;
  74 }
  75 td.menu-disabled {
  76   background: #ccc;
  77 }
  78
  79 /*
  80 ** Other common styles
  81 */
  82 .breadcrumb {
  83   padding-bottom: .5em
  84 }
  85 .block-region {
  86   background-color: #ffff66;
  87   margin-top: 4px;
  88   margin-bottom: 4px;
  89   padding: 3px;
  90 }
  91 .block ul {
  92   margin: 0;
  93   padding: 0 0 0.25em 1em;
  94 }
  95 br.clear {
  96   clear: both;
  97   height: 0;
  98 }
  99 .container-inline div {
 100   display: inline;
 101 }
 102 .error {
 103   color: red;
 104 }
 105 .item-list .icon {
 106   color: #555;
 107   float: right;
 108   padding-left: 0.25em;
 109   clear: right;
 110 }
 111 .item-list .icon a {
 112   color: #000;
 113   text-decoration: none;
 114 }
 115 .item-list .icon a:hover {
 116   color: #000;
 117   text-decoration: none;
 118 }
 119 .item-list .title {
 120   font-weight: bold;
 121 }
 122 .item-list ul {
 123   margin: 0 0 0.75em 0;
 124   padding: 0;
 125 }
 126 .item-list ul li {
 127   margin: 0 0 0.25em 1.5em;
 128   padding: 0;
 129   list-style: disc;
 130 }
 131 .form-item {
 132   margin-top: 1em;
 133   margin-bottom: 1em;
 134 }
 135 tr.odd .form-item, tr.even .form-item {
 136   margin-top: 0;
 137   margin-bottom: 0;
 138   white-space: nowrap;
 139 }
 140 .form-item input.error, .form-item textarea.error {
 141   border: 2px solid red;
 142 }
 143 .form-item .description {
 144   font-size: 0.85em;
 145 }
 146 .form-item label {
 147   display: block;
 148   font-weight: bold;
 149 }
 150 .form-item label.option {
 151   display: inline;
 152   font-weight: normal;
 153 }
 154 .marker, .form-required {
 155   color: #f00;
 156 }
 157 .more-link {
 158   text-align: right;
 159 }
 160 .node-form .form-text {
 161   display: block;
 162   width: 95%;
 163 }
 164 .node-form .standard {
 165   clear: both;
 166 }
 167 .node-form textarea {
 168   display: block;
 169   width: 95%;
 170 }
 171 .node-form .attachments fieldset {
 172   float: none;
 173   display: block;
 174 }
 175 .nowrap {
 176   white-space: nowrap;
 177 }
 178 .ok {
 179   color: #080;
 180 }
 181 #pager {
 182   clear: both;
 183   text-align: center;
 184 }
 185 #pager a, #pager strong.pager-current {
 186   padding: 0.5em;
 187 }
 188 .path {
 189   padding-bottom: 0.7em;
 190   font-size: 1.1em;
 191 }
 192
 193 /*
 194 ** Module specific styles
 195 */
 196 #aggregator .feed-source .feed-title {
 197   margin-top: 0;
 198 }
 199 #aggregator .feed-source .feed-image img {
 200   margin-bottom: 0.75em;
 201 }
 202 #aggregator .feed-source .feed-icon {
 203   float: right;
 204   display: block;
 205 }
 206 #aggregator .feed-item {
 207   margin-bottom: 1.5em;
 208 }
 209 #aggregator .feed-item-title {
 210   margin-bottom: 0;
 211   font-size: 1.3em;
 212 }
 213 #aggregator .feed-item-meta, #aggregator .feed-item-body {
 214   margin-bottom: 0.5em;
 215 }
 216 #aggregator .feed-item-categories {
 217   font-size: 0.9em;
 218 }
 219 #aggregator td {
 220   vertical-align: bottom;
 221 }
 222 #aggregator td.categorize-item {
 223   white-space: nowrap;
 224 }
 225 #aggregator .categorize-item .news-item .body {
 226   margin-top: 0;
 227 }
 228 #aggregator .categorize-item h3 {
 229   margin-bottom: 1em;
 230   margin-top: 0;
 231 }
 232 .book-navigation .menu {
 233   border-top: 1px solid #888;
 234   padding: 1em 0 0 3em;
 235 }
 236 .book-navigation .page-links {
 237   border-top: 1px solid #888;
 238   border-bottom: 1px solid #888;
 239   text-align: center;
 240   padding: 0.5em;
 241 }
 242 .book-navigation .page-previous {
 243   text-align: right;
 244 }
 245 .book-navigation .page-up {
 246   margin: 0 4em;
 247 }
 248 .book-navigation .page-next {
 249   text-align: left;
 250 }
 251 .node-unpublished, .comment-unpublished {
 252   background-color: #fff4f4;
 253 }
 254 .preview .node, .preview .comment {
 255   background-color: #ffffea;
 256 }
 257 .archive {
 258   margin: 1em 0 1em 0;
 259 }
 260 .calendar .row-week td a {
 261   display: block;
 262 }
 263 .calendar .row-week td a:hover {
 264   background-color: #888; color: #fff;
 265 }
 266 .calendar a {
 267   text-decoration: none;
 268 }
 269 .calendar a:hover {
 270   text-decoration: none;
 271 }
 272 .calendar table {
 273   border-collapse: collapse;
 274   width: 100%;
 275   border: 1px solid #000;
 276 }
 277 .calendar td, .calendar th {
 278   text-align: center;
 279   border: 1px solid #000;
 280   padding: 1px;
 281   margin: 0;
 282   font-size: 0.8em;
 283 }
 284 .calendar td.day-blank {
 285   border: 0;
 286 }
 287 .tips {
 288   margin-top: 0;
 289   margin-bottom: 0;
 290   padding-top: 0;
 291   padding-bottom: 0;
 292   font-size: 0.9em;
 293 }
 294 #forum .description {
 295   font-size: 0.9em;
 296   margin: 0.5em;
 297 }
 298 #forum td.created, #forum td.posts, #forum td.topics, #forum td.last-reply, #forum td.replies, #forum td.pager {
 299   white-space: nowrap;
 300 }
 301 #forum td.posts, #forum td.topics, #forum td.replies, #forum td.pager {
 302   text-align: center;
 303 }
 304 .forum-topic-navigation {
 305   padding: 1em 0 0 3em;
 306   border-top: 1px solid #888;
 307   border-bottom: 1px solid #888;
 308   text-align: center;
 309   padding: 0.5em;
 310 }
 311 .forum-topic-navigation .topic-previous {
 312   margin-right: 4em;
 313   text-align: right;
 314 }
 315 .forum-topic-navigation .topic-next {
 316   text-align: left;
 317 }
 318 .locale-untranslated {
 319   font-style: normal;
 320   text-decoration: line-through;
 321 }
 322 #node-admin-filter ul {
 323   list-style-type: none;
 324   padding: 0;
 325   margin: 0;
 326   width: 100%;
 327 }
 328 #node-admin-buttons {
 329   float: left;
 330   margin-left: 0.5em;
 331   clear: right;
 332 }
 333 td.revision-current {
 334   background: #ffc;
 335 }
 336 dl.multiselect dd.b, dl.multiselect dd.b .form-item, dl.multiselect dd.b select {
 337   font-family: inherit;
 338   font-size: inherit;
 339   width: 14em;
 340 }
 341 dl.multiselect dd.a, dl.multiselect dd.a .form-item {
 342   width: 8em;
 343 }
 344 dl.multiselect dt, dl.multiselect dd {
 345   float: left;
 346   line-height: 1.75em;
 347   padding: 0;
 348   margin: 0 1em 0 0;
 349 }
 350 dl.multiselect .form-item {
 351   height: 1.75em;
 352   margin: 0;
 353 }
 354 #permissions td.module, #blocks td.region {
 355   font-weight: bold;
 356 }
 357 #permissions td.permission, #blocks td.block, #taxonomy td.term, #taxonomy td.message {
 358   padding-left: 1.5em;
 359 }
 360
 361 #access-rules .access-type, #access-rules .rule-type {
 362   margin-right: 1em;
 363   float: left;
 364 }
 365 #access-rules .access-type .form-item, #access-rules .rule-type .form-item {
 366   margin-top: 0;
 367 }
 368 #access-rules .mask {
 369   clear: both;
 370 }
 371 .poll .bar {
 372   height: 1em;
 373   margin: 1px 0;
 374   background-color: #ddd;
 375 }
 376 .poll .bar .foreground {
 377   background-color: #000;
 378   height: 1em;
 379   clear: left;
 380   float: left;
 381 }
 382 .poll .links {
 383   text-align: center;
 384 }
 385 .poll .percent {
 386   text-align: right;
 387 }
 388 .poll .total {
 389   text-align: center;
 390 }
 391 .poll .vote-form {
 392   text-align: center;
 393 }
 394 .poll .vote-form .choices {
 395   text-align: left;
 396   margin: 0 auto;
 397   display: table;
 398 }
 399 .profile {
 400   clear: both;
 401   margin: 1em 0 1em 0;
 402 }
 403 .profile .picture {
 404   float: right;
 405   margin: 0 1em 1em 0;
 406 }
 407 .profile dt {
 408   margin: 1em 0 0.2em 0;
 409   font-weight: bold;
 410 }
 411 .profile dd {
 412   margin:0;
 413 }
 414 .node-form .poll-form fieldset {
 415   display: block;
 416 }
 417 img.screenshot {
 418   border: 1px solid #808080;
 419   display: block;
 420   margin: 2px;
 421 }
 422 .search-form {
 423   margin-bottom: 1em;
 424 }
 425 .search-form p {
 426   margin-top: 0;
 427   margin-bottom: 0.2em;
 428   padding-top: 0;
 429   padding-bottom: 0;
 430 }
 431 .search-form input {
 432   margin-top: 0;
 433   margin-bottom: 0;
 434 }
 435 .search-results p {
 436   margin-top: 0;
 437 }
 438 .search-results dt {
 439   font-size: 1.1em;
 440 }
 441 .search-results dd {
 442   margin-bottom: 1em;
 443 }
 444 .search-results .search-info {
 445   font-size: 0.85em;
 446 }
 447 .search-advanced .criterion {
 448   float: left;
 449   margin-right: 2em;
 450 }
 451 .search-advanced .action {
 452   float: left;
 453   clear: left;
 454 }
 455 #tracker td.replies {
 456   text-align: center;
 457 }
 458 #tracker table {
 459   width: 100%;
 460 }
 461 .theme-settings-left {
 462   float: left;
 463   width: 49%;
 464 }
 465 .theme-settings-right {
 466   float: right;
 467   width: 49%;
 468 }
 469 .theme-settings-bottom {
 470   clear: both;
 471 }
 472 #user-login-form {
 473   text-align: center;
 474 }
 475 .more-help-link {
 476   font-size: 0.85em;
 477   text-align: right;
 478 }
 479 table.watchdog-event th {
 480   border-bottom: 1px solid #ccc;
 481 }
 482 tr.watchdog-user {
 483   background: #ffd;
 484 }
 485 tr.watchdog-user .active {
 486   background: #eed;
 487 }
 488 tr.watchdog-content {
 489   background: #ddf;
 490 }
 491 tr.watchdog-content .active {
 492   background: #cce;
 493 }
 494 tr.watchdog-page-not-found, tr.watchdog-access-denied {
 495   background: #dfd;
 496 }
 497 tr.watchdog-page-not-found .active, tr.watchdog-access-denied .active {
 498   background: #cec;
 499 }
 500 tr.watchdog-error {
 501   background: #ffc9c9;
 502 }
 503 tr.watchdog-error .active {
 504   background: #eeb9b9;
 505 }
 506
 507 /* Tab navigation */
 508 ul.primary {
 509   border-collapse: collapse;
 510   padding: 0 0 0 1em;
 511   white-space: nowrap;
 512   list-style: none;
 513   margin: 5px;
 514   height: auto;
 515   line-height: normal;
 516   border-bottom: 1px solid #bbb;
 517 }
 518 ul.primary li {
 519   display: inline;
 520 }
 521 ul.primary li a {
 522   background-color: #ddd;
 523   border-color: #bbb;
 524   border-width: 1px;
 525   border-style: solid solid none solid;
 526   height: auto;
 527   margin-right: 0.5em;
 528   padding: 0 1em;
 529   text-decoration: none;
 530 }
 531 ul.primary li.active a {
 532   background-color: #fff;
 533   border: 1px solid #bbb;
 534   border-bottom: #fff 1px solid;
 535 }
 536 ul.primary li a:hover {
 537   background-color: #eee;
 538   border-color: #ccc;
 539   border-bottom-color: #eee;
 540 }
 541 ul.secondary {
 542   border-bottom: 1px solid #bbb;
 543   padding: 0.5em 1em 0.5em 1em;
 544   margin: 5px;
 545 }
 546 ul.secondary li {
 547   display: inline;
 548   padding: 0 1em;
 549   border-right: 1px solid #ccc;
 550 }
 551 ul.secondary a {
 552   padding: 0;
 553   text-decoration: none;
 554 }
 555 ul.secondary a.active {
 556   border-bottom: 4px solid #999;
 557 }
 558
 559 /*
 560 ** Help module
 561 */
 562 .help-items {
 563   float: left;
 564   width: 22%;
 565   padding-right: 3%;
 566 }
 567 .help-items-last {
 568   padding-right: 0;
 569 }
 570
 571 /*
 572 ** Autocomplete styles
 573 */
 574 /* Suggestion list */
 575 #autocomplete {
 576   position: absolute;
 577   border: 1px solid;
 578   overflow: hidden;
 579 }
 580 #autocomplete ul {
 581   margin: 0;
 582   padding: 0;
 583   list-style: none;
 584 }
 585 #autocomplete li {
 586   background: #fff;
 587   color: #000;
 588   white-space: pre;
 589   cursor: default;
 590 }
 591 #autocomplete li.selected {
 592   background: #0072b9;
 593   color: #fff;
 594 }
 595 /* Animated throbber */
 596 html.js input.form-autocomplete {
 597   background-image: url(throbber.gif);
 598   background-repeat: no-repeat;
 599   background-position: 100% 2px;
 600 }
 601 html.js input.throbbing {
 602   background-position: 100% -18px;
 603 }
 604
 605 /*
 606 ** Progressbar styles
 607 */
 608 .progress {
 609   font-weight: bold;
 610 }
 611 .progress .bar {
 612   background: #fff url(progress.gif);
 613   border: 1px solid #00375a;
 614   height: 1.5em;
 615   margin-top: 0.2em;
 616 }
 617 .progress .filled {
 618   background: #0072b9;
 619   height: 1em;
 620   border-bottom: 0.5em solid #004a73;
 621   width: 0%;
 622 }
 623 .progress .percentage {
 624   float: right;
 625 }
 626
 627 /*
 628 ** Collapsing fieldsets
 629 */
 630 html.js fieldset.collapsed {
 631   border-bottom-width: 0;
 632   border-left-width: 0;
 633   border-right-width: 0;
 634   margin-bottom: 0;
 635 }
 636 html.js fieldset.collapsed * {
 637   display: none;
 638 }
 639 html.js fieldset.collapsed table *,
 640 html.js fieldset.collapsed legend,
 641 html.js fieldset.collapsed legend * {
 642   display: inline;
 643 }
 644 html.js fieldset.collapsible legend a {
 645   padding-left: 15px;
 646   background: url(menu-expanded.png) 5px 50% no-repeat;
 647 }
 648 html.js fieldset.collapsed legend a {
 649   background-image: url(menu-collapsed.png);
 650 }
 651 /* Note: IE-only fix due to '* html' (breaks Konqueror otherwise). */
 652 * html.js fieldset.collapsible legend a {
 653   display: block;
 654 }
 655
 656 /*
 657 ** Resizable text areas
 658 */
 659 .resizable-textarea {
 660   width: 95%;
 661 }
 662 .resizable-textarea .grippie {
 663   height: 14px;
 664   background: #eee url(grippie.png) no-repeat 100% 100%;
 665   border: 1px solid #ddd;
 666   border-top-width: 0;
 667   cursor: s-resize;
 668 }
 669
 670 /*
 671 ** Formatting for welcome page
 672 */
 673 #first-time strong {
 674   display: block;
 675   padding: 1.5em 0 .5em;
 676 }