Mercurial > defr > drupal > core
comparison modules/system/system.css @ 1:c1f4ac30525a 6.0
Drupal 6.0
| author | Franck Deroche <webmaster@defr.org> |
|---|---|
| date | Tue, 23 Dec 2008 14:28:28 +0100 |
| parents | |
| children |
comparison
equal
deleted
inserted
replaced
| 0:5a113a1c4740 | 1:c1f4ac30525a |
|---|---|
| 1 /* $Id: system.css,v 1.48 2008/01/09 09:56:39 goba Exp $ */ | |
| 2 | |
| 3 /* | |
| 4 ** HTML elements | |
| 5 */ | |
| 6 body.drag { | |
| 7 cursor: move; | |
| 8 } | |
| 9 th.active img { | |
| 10 display: inline; | |
| 11 } | |
| 12 tr.even, tr.odd { | |
| 13 background-color: #eee; | |
| 14 border-bottom: 1px solid #ccc; | |
| 15 padding: 0.1em 0.6em; | |
| 16 } | |
| 17 tr.drag { | |
| 18 background-color: #fffff0; | |
| 19 } | |
| 20 tr.drag-previous { | |
| 21 background-color: #ffd; | |
| 22 } | |
| 23 td.active { | |
| 24 background-color: #ddd; | |
| 25 } | |
| 26 td.checkbox, th.checkbox { | |
| 27 text-align: center; | |
| 28 } | |
| 29 tbody { | |
| 30 border-top: 1px solid #ccc; | |
| 31 } | |
| 32 tbody th { | |
| 33 border-bottom: 1px solid #ccc; | |
| 34 } | |
| 35 thead th { | |
| 36 text-align: left; /* LTR */ | |
| 37 padding-right: 1em; /* LTR */ | |
| 38 border-bottom: 3px solid #ccc; | |
| 39 } | |
| 40 | |
| 41 /* | |
| 42 ** Other common styles | |
| 43 */ | |
| 44 .breadcrumb { | |
| 45 padding-bottom: .5em | |
| 46 } | |
| 47 div.indentation { | |
| 48 width: 20px; | |
| 49 height: 1.7em; | |
| 50 margin: -0.4em 0.2em -0.4em -0.4em; /* LTR */ | |
| 51 padding: 0.42em 0 0.42em 0.6em; /* LTR */ | |
| 52 float: left; /* LTR */ | |
| 53 } | |
| 54 div.tree-child { | |
| 55 background: url(../../misc/tree.png) no-repeat 11px center; /* LTR */ | |
| 56 } | |
| 57 div.tree-child-last { | |
| 58 background: url(../../misc/tree-bottom.png) no-repeat 11px center; /* LTR */ | |
| 59 } | |
| 60 div.tree-child-horizontal { | |
| 61 background: url(../../misc/tree.png) no-repeat -11px center; | |
| 62 } | |
| 63 .error { | |
| 64 color: #e55; | |
| 65 } | |
| 66 div.error { | |
| 67 border: 1px solid #d77; | |
| 68 } | |
| 69 div.error, tr.error { | |
| 70 background: #fcc; | |
| 71 color: #200; | |
| 72 padding: 2px; | |
| 73 } | |
| 74 .warning { | |
| 75 color: #e09010; | |
| 76 } | |
| 77 div.warning { | |
| 78 border: 1px solid #f0c020; | |
| 79 } | |
| 80 div.warning, tr.warning { | |
| 81 background: #ffd; | |
| 82 color: #220; | |
| 83 padding: 2px; | |
| 84 } | |
| 85 .ok { | |
| 86 color: #008000; | |
| 87 } | |
| 88 div.ok { | |
| 89 border: 1px solid #00aa00; | |
| 90 } | |
| 91 div.ok, tr.ok { | |
| 92 background: #dfd; | |
| 93 color: #020; | |
| 94 padding: 2px; | |
| 95 } | |
| 96 .item-list .icon { | |
| 97 color: #555; | |
| 98 float: right; /* LTR */ | |
| 99 padding-left: 0.25em; /* LTR */ | |
| 100 clear: right; /* LTR */ | |
| 101 } | |
| 102 .item-list .title { | |
| 103 font-weight: bold; | |
| 104 } | |
| 105 .item-list ul { | |
| 106 margin: 0 0 0.75em 0; | |
| 107 padding: 0; | |
| 108 } | |
| 109 .item-list ul li { | |
| 110 margin: 0 0 0.25em 1.5em; /* LTR */ | |
| 111 padding: 0; | |
| 112 list-style: disc; | |
| 113 } | |
| 114 ol.task-list li.active { | |
| 115 font-weight: bold; | |
| 116 } | |
| 117 .form-item { | |
| 118 margin-top: 1em; | |
| 119 margin-bottom: 1em; | |
| 120 } | |
| 121 tr.odd .form-item, tr.even .form-item { | |
| 122 margin-top: 0; | |
| 123 margin-bottom: 0; | |
| 124 white-space: nowrap; | |
| 125 } | |
| 126 tr.merge-down, tr.merge-down td, tr.merge-down th { | |
| 127 border-bottom-width: 0 !important; | |
| 128 } | |
| 129 tr.merge-up, tr.merge-up td, tr.merge-up th { | |
| 130 border-top-width: 0 !important; | |
| 131 } | |
| 132 .form-item input.error, .form-item textarea.error, .form-item select.error { | |
| 133 border: 2px solid red; | |
| 134 } | |
| 135 .form-item .description { | |
| 136 font-size: 0.85em; | |
| 137 } | |
| 138 .form-item label { | |
| 139 display: block; | |
| 140 font-weight: bold; | |
| 141 } | |
| 142 .form-item label.option { | |
| 143 display: inline; | |
| 144 font-weight: normal; | |
| 145 } | |
| 146 .form-checkboxes, .form-radios { | |
| 147 margin: 1em 0; | |
| 148 } | |
| 149 .form-checkboxes .form-item, .form-radios .form-item { | |
| 150 margin-top: 0.4em; | |
| 151 margin-bottom: 0.4em; | |
| 152 } | |
| 153 .marker, .form-required { | |
| 154 color: #f00; | |
| 155 } | |
| 156 .more-link { | |
| 157 text-align: right; /* LTR */ | |
| 158 } | |
| 159 .more-help-link { | |
| 160 font-size: 0.85em; | |
| 161 text-align: right; /* LTR */ | |
| 162 } | |
| 163 .nowrap { | |
| 164 white-space: nowrap; | |
| 165 } | |
| 166 .item-list .pager { | |
| 167 clear: both; | |
| 168 text-align: center; | |
| 169 } | |
| 170 .item-list .pager li { | |
| 171 background-image:none; | |
| 172 display:inline; | |
| 173 list-style-type:none; | |
| 174 padding: 0.5em; | |
| 175 } | |
| 176 .pager-current { | |
| 177 font-weight:bold; | |
| 178 } | |
| 179 .tips { | |
| 180 margin-top: 0; | |
| 181 margin-bottom: 0; | |
| 182 padding-top: 0; | |
| 183 padding-bottom: 0; | |
| 184 font-size: 0.9em; | |
| 185 } | |
| 186 dl.multiselect dd.b, dl.multiselect dd.b .form-item, dl.multiselect dd.b select { | |
| 187 font-family: inherit; | |
| 188 font-size: inherit; | |
| 189 width: 14em; | |
| 190 } | |
| 191 dl.multiselect dd.a, dl.multiselect dd.a .form-item { | |
| 192 width: 8em; | |
| 193 } | |
| 194 dl.multiselect dt, dl.multiselect dd { | |
| 195 float: left; /* LTR */ | |
| 196 line-height: 1.75em; | |
| 197 padding: 0; | |
| 198 margin: 0 1em 0 0; /* LTR */ | |
| 199 } | |
| 200 dl.multiselect .form-item { | |
| 201 height: 1.75em; | |
| 202 margin: 0; | |
| 203 } | |
| 204 | |
| 205 /* | |
| 206 ** Inline items (need to override above) | |
| 207 */ | |
| 208 .container-inline div, .container-inline label { | |
| 209 display: inline; | |
| 210 } | |
| 211 | |
| 212 /* | |
| 213 ** Tab navigation | |
| 214 */ | |
| 215 ul.primary { | |
| 216 border-collapse: collapse; | |
| 217 padding: 0 0 0 1em; /* LTR */ | |
| 218 white-space: nowrap; | |
| 219 list-style: none; | |
| 220 margin: 5px; | |
| 221 height: auto; | |
| 222 line-height: normal; | |
| 223 border-bottom: 1px solid #bbb; | |
| 224 } | |
| 225 ul.primary li { | |
| 226 display: inline; | |
| 227 } | |
| 228 ul.primary li a { | |
| 229 background-color: #ddd; | |
| 230 border-color: #bbb; | |
| 231 border-width: 1px; | |
| 232 border-style: solid solid none solid; | |
| 233 height: auto; | |
| 234 margin-right: 0.5em; /* LTR */ | |
| 235 padding: 0 1em; | |
| 236 text-decoration: none; | |
| 237 } | |
| 238 ul.primary li.active a { | |
| 239 background-color: #fff; | |
| 240 border: 1px solid #bbb; | |
| 241 border-bottom: #fff 1px solid; | |
| 242 } | |
| 243 ul.primary li a:hover { | |
| 244 background-color: #eee; | |
| 245 border-color: #ccc; | |
| 246 border-bottom-color: #eee; | |
| 247 } | |
| 248 ul.secondary { | |
| 249 border-bottom: 1px solid #bbb; | |
| 250 padding: 0.5em 1em; | |
| 251 margin: 5px; | |
| 252 } | |
| 253 ul.secondary li { | |
| 254 display: inline; | |
| 255 padding: 0 1em; | |
| 256 border-right: 1px solid #ccc; /* LTR */ | |
| 257 } | |
| 258 ul.secondary a { | |
| 259 padding: 0; | |
| 260 text-decoration: none; | |
| 261 } | |
| 262 ul.secondary a.active { | |
| 263 border-bottom: 4px solid #999; | |
| 264 } | |
| 265 | |
| 266 /* | |
| 267 ** Autocomplete styles | |
| 268 */ | |
| 269 /* Suggestion list */ | |
| 270 #autocomplete { | |
| 271 position: absolute; | |
| 272 border: 1px solid; | |
| 273 overflow: hidden; | |
| 274 z-index: 100; | |
| 275 } | |
| 276 #autocomplete ul { | |
| 277 margin: 0; | |
| 278 padding: 0; | |
| 279 list-style: none; | |
| 280 } | |
| 281 #autocomplete li { | |
| 282 background: #fff; | |
| 283 color: #000; | |
| 284 white-space: pre; | |
| 285 cursor: default; | |
| 286 } | |
| 287 #autocomplete li.selected { | |
| 288 background: #0072b9; | |
| 289 color: #fff; | |
| 290 } | |
| 291 /* Animated throbber */ | |
| 292 html.js input.form-autocomplete { | |
| 293 background-image: url(../../misc/throbber.gif); | |
| 294 background-repeat: no-repeat; | |
| 295 background-position: 100% 2px; /* LTR */ | |
| 296 } | |
| 297 html.js input.throbbing { | |
| 298 background-position: 100% -18px; /* LTR */ | |
| 299 } | |
| 300 | |
| 301 /* | |
| 302 ** Collapsing fieldsets | |
| 303 */ | |
| 304 html.js fieldset.collapsed { | |
| 305 border-bottom-width: 0; | |
| 306 border-left-width: 0; | |
| 307 border-right-width: 0; | |
| 308 margin-bottom: 0; | |
| 309 height: 1em; | |
| 310 } | |
| 311 html.js fieldset.collapsed * { | |
| 312 display: none; | |
| 313 } | |
| 314 html.js fieldset.collapsed legend { | |
| 315 display: block; | |
| 316 } | |
| 317 html.js fieldset.collapsible legend a { | |
| 318 padding-left: 15px; /* LTR */ | |
| 319 background: url(../../misc/menu-expanded.png) 5px 75% no-repeat; /* LTR */ | |
| 320 } | |
| 321 html.js fieldset.collapsed legend a { | |
| 322 background-image: url(../../misc/menu-collapsed.png); /* LTR */ | |
| 323 background-position: 5px 50%; /* LTR */ | |
| 324 } | |
| 325 /* Note: IE-only fix due to '* html' (breaks Konqueror otherwise). */ | |
| 326 * html.js fieldset.collapsed legend, | |
| 327 * html.js fieldset.collapsed legend *, | |
| 328 * html.js fieldset.collapsed table * { | |
| 329 display: inline; | |
| 330 } | |
| 331 /* For Safari 2 to prevent collapsible fieldsets containing tables from dissapearing due to tableheader.js. */ | |
| 332 html.js fieldset.collapsible { | |
| 333 position: relative; | |
| 334 } | |
| 335 html.js fieldset.collapsible legend a { | |
| 336 display: block; | |
| 337 } | |
| 338 /* Avoid jumping around due to margins collapsing into collapsible fieldset border */ | |
| 339 html.js fieldset.collapsible .fieldset-wrapper { | |
| 340 overflow: auto; | |
| 341 } | |
| 342 | |
| 343 /* | |
| 344 ** Resizable text areas | |
| 345 */ | |
| 346 .resizable-textarea { | |
| 347 width: 95%; | |
| 348 } | |
| 349 .resizable-textarea .grippie { | |
| 350 height: 9px; | |
| 351 overflow: hidden; | |
| 352 background: #eee url(../../misc/grippie.png) no-repeat center 2px; | |
| 353 border: 1px solid #ddd; | |
| 354 border-top-width: 0; | |
| 355 cursor: s-resize; | |
| 356 } | |
| 357 html.js .resizable-textarea textarea { | |
| 358 margin-bottom: 0; | |
| 359 width: 100%; | |
| 360 display: block; | |
| 361 } | |
| 362 | |
| 363 /* | |
| 364 ** Table drag and drop. | |
| 365 */ | |
| 366 .draggable a.tabledrag-handle { | |
| 367 cursor: move; | |
| 368 float: left; /* LTR */ | |
| 369 height: 1.7em; | |
| 370 margin: -0.4em 0 -0.4em -0.5em; /* LTR */ | |
| 371 padding: 0.42em 1.5em 0.42em 0.5em; /* LTR */ | |
| 372 text-decoration: none; | |
| 373 } | |
| 374 a.tabledrag-handle:hover { | |
| 375 text-decoration: none; | |
| 376 } | |
| 377 a.tabledrag-handle .handle { | |
| 378 margin-top: 4px; | |
| 379 height: 13px; | |
| 380 width: 13px; | |
| 381 background: url(../../misc/draggable.png) no-repeat 0 0; | |
| 382 } | |
| 383 a.tabledrag-handle-hover .handle { | |
| 384 background-position: 0 -20px; | |
| 385 } | |
| 386 | |
| 387 /* | |
| 388 ** Teaser splitter | |
| 389 */ | |
| 390 .joined + .grippie { | |
| 391 height: 5px; | |
| 392 background-position: center 1px; | |
| 393 margin-bottom: -2px; | |
| 394 } | |
| 395 /* Keeps inner content contained in Opera 9. */ | |
| 396 .teaser-checkbox { | |
| 397 padding-top: 1px; | |
| 398 } | |
| 399 div.teaser-button-wrapper { | |
| 400 float: right; /* LTR */ | |
| 401 padding-right: 5%; /* LTR */ | |
| 402 margin: 0; | |
| 403 } | |
| 404 .teaser-checkbox div.form-item { | |
| 405 float: right; /* LTR */ | |
| 406 margin: 0 5% 0 0; /* LTR */ | |
| 407 padding: 0; | |
| 408 } | |
| 409 textarea.teaser { | |
| 410 display: none; | |
| 411 } | |
| 412 html.js .no-js { | |
| 413 display: none; | |
| 414 } | |
| 415 | |
| 416 /* | |
| 417 ** Progressbar styles | |
| 418 */ | |
| 419 .progress { | |
| 420 font-weight: bold; | |
| 421 } | |
| 422 .progress .bar { | |
| 423 background: #fff url(../../misc/progress.gif); | |
| 424 border: 1px solid #00375a; | |
| 425 height: 1.5em; | |
| 426 margin: 0 0.2em; | |
| 427 } | |
| 428 .progress .filled { | |
| 429 background: #0072b9; | |
| 430 height: 1em; | |
| 431 border-bottom: 0.5em solid #004a73; | |
| 432 width: 0%; | |
| 433 } | |
| 434 .progress .percentage { | |
| 435 float: right; /* LTR */ | |
| 436 } | |
| 437 .progress-disabled { | |
| 438 float: left; /* LTR */ | |
| 439 } | |
| 440 .ahah-progress { | |
| 441 float: left; /* LTR */ | |
| 442 } | |
| 443 .ahah-progress .throbber { | |
| 444 width: 15px; | |
| 445 height: 15px; | |
| 446 margin: 2px; | |
| 447 background: transparent url(../../misc/throbber.gif) no-repeat 0px -18px; | |
| 448 float: left; /* LTR */ | |
| 449 } | |
| 450 tr .ahah-progress .throbber { | |
| 451 margin: 0 2px; | |
| 452 } | |
| 453 .ahah-progress-bar { | |
| 454 width: 16em; | |
| 455 } | |
| 456 | |
| 457 /* | |
| 458 ** Formatting for welcome page | |
| 459 */ | |
| 460 #first-time strong { | |
| 461 display: block; | |
| 462 padding: 1.5em 0 .5em; | |
| 463 } | |
| 464 | |
| 465 /* | |
| 466 ** To be used with tableselect.js | |
| 467 */ | |
| 468 tr.selected td { | |
| 469 background: #ffc; | |
| 470 } | |
| 471 | |
| 472 /* | |
| 473 ** Floating header for tableheader.js | |
| 474 */ | |
| 475 table.sticky-header { | |
| 476 margin-top: 0; | |
| 477 background: #fff; | |
| 478 } | |
| 479 | |
| 480 /* | |
| 481 ** Installation clean URLs | |
| 482 */ | |
| 483 #clean-url.install { | |
| 484 display: none; | |
| 485 } | |
| 486 | |
| 487 /* | |
| 488 ** For anything you want to hide on page load when JS is enabled, so | |
| 489 ** that you can use the JS to control visibility and avoid flicker. | |
| 490 */ | |
| 491 html.js .js-hide { | |
| 492 display: none; | |
| 493 } | |
| 494 | |
| 495 /* | |
| 496 ** Styles for the system modules page (admin/build/modules) | |
| 497 */ | |
| 498 #system-modules div.incompatible { | |
| 499 font-weight: bold; | |
| 500 } | |
| 501 | |
| 502 /* | |
| 503 ** Styles for the system themes page (admin/build/themes) | |
| 504 */ | |
| 505 #system-themes-form div.incompatible { | |
| 506 font-weight: bold; | |
| 507 } | |
| 508 | |
| 509 /* | |
| 510 ** Password strength indicator | |
| 511 */ | |
| 512 span.password-strength { | |
| 513 visibility: hidden; | |
| 514 } | |
| 515 input.password-field { | |
| 516 margin-right: 10px; /* LTR */ | |
| 517 } | |
| 518 div.password-description { | |
| 519 padding: 0 2px; | |
| 520 margin: 4px 0 0 0; | |
| 521 font-size: 0.85em; | |
| 522 max-width: 500px; | |
| 523 } | |
| 524 div.password-description ul { | |
| 525 margin-bottom: 0; | |
| 526 } | |
| 527 .password-parent { | |
| 528 margin: 0 0 0 0; | |
| 529 } | |
| 530 /* | |
| 531 ** Password confirmation checker | |
| 532 */ | |
| 533 input.password-confirm { | |
| 534 margin-right: 10px; /* LTR */ | |
| 535 } | |
| 536 .confirm-parent { | |
| 537 margin: 5px 0 0 0; | |
| 538 } | |
| 539 span.password-confirm { | |
| 540 visibility: hidden; | |
| 541 } | |
| 542 span.password-confirm span { | |
| 543 font-weight: normal; | |
| 544 } |
