typo3/sysext/t3skin/Resources/Public/Css/visual/element_tceforms.css

   1 /* - - - - - - - - - - - - - - - - - - - - -
   2 TCEforms
   3 - - - - - - - - - - - - - - - - - - - - - */
   4
   5 table#typo3-altdoc-header input,
   6 .c-inputButton {
   7         background: none;
   8         border: 0;
   9 }
  10
  11 .checkbox,
  12 .checkbox:hover {
  13         background: #efeff4;
  14         border: 0;
  15 }
  16
  17 .t3-tceforms-input-wrapper,
  18 .t3-tceforms-input-wrapper-hover,
  19 .t3-tceforms-input-wrapper-datetime,
  20 .t3-tceforms-input-wrapper-datetime-hover {
  21         display: block;
  22         float: left;
  23         position: relative;
  24 }
  25
  26 .t3-tceforms-widget-null-wrapper {
  27         display: inline-block;
  28         float: right;
  29         position: relative;
  30         width: 20px;
  31         max-width: 20px;
  32 }
  33
  34 .t3-tceforms-widget-null-wrapper input {
  35         margin-left: 2px;
  36         margin-top: 42%;
  37 }
  38
  39
  40 .t3-tceforms-input-wrapper .t3-tceforms-input-clearer,
  41 .t3-tceforms-input-wrapper-hover .t3-tceforms-input-clearer {
  42         position: absolute;
  43         right: 4px;
  44         top: 28%;
  45         z-index: 1000;
  46         cursor: pointer;
  47 }
  48
  49 .t3-tceforms-input-wrapper-datetime .t3-tceforms-input-clearer,
  50 .t3-tceforms-input-wrapper-datetime-hover .t3-tceforms-input-clearer {
  51         position: absolute;
  52         right: 24px;
  53         top: 28%;
  54         z-index: 1000;
  55         cursor: pointer;
  56 }
  57
  58 .t3-tceforms-input-wrapper .tceforms-textfield,
  59 .t3-tceforms-input-wrapper-hover .tceforms-textfield,
  60 .t3-tceforms-input-wrapper .tceforms-datetimefield,
  61 .t3-tceforms-input-wrapper-hover .tceforms-datetimefield,
  62 .t3-tceforms-input-wrapper-datetime .tceforms-textfield,
  63 .t3-tceforms-input-wrapper-datetime-hover .tceforms-textfield,
  64 .t3-tceforms-input-wrapper-datetime .tceforms-datetimefield,
  65 .t3-tceforms-input-wrapper-datetime-hover .tceforms-datetimefield {
  66         position: relative;
  67         z-index: 2000;
  68         min-height: 14px;
  69         padding-right: 20px!important;
  70 }
  71
  72 .t3-tceforms-input-wrapper-hover .t3-tceforms-input-clearer,
  73 .t3-tceforms-input-wrapper-datetime-hover .t3-tceforms-input-clearer {
  74         z-index: 3700;
  75 }
  76
  77 .typo3-TCEforms table#typo3-altdoc-header input:hover,
  78 .c-inputButton:hover {
  79         background: none;
  80         border: 0;
  81 }
  82
  83 .typo3-TCEforms .typo3-TCEforms-recHeader {
  84         color: #555555;
  85         font-weight: bold;
  86 }
  87
  88 .typo3-TCEforms .typo3-TCEforms-recHeaderRow {
  89         background: #fff;
  90         text-align: right;
  91 }
  92
  93 .typo3-TCEforms span.typo3-TCEforms-newToken {
  94         color: #990000;
  95         font-weight: bold;
  96 }
  97
  98 .typo3-TCEforms span.typo3-TCEforms-helpText {
  99         background: transparent;
 100         color: #fff;
 101 }
 102
 103 table.typo3-TCEforms-select-checkbox {
 104         background-color: #ffffff;
 105         border: 1px solid #aaa;
 106 }
 107
 108 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td {
 109         background-color: #fff;
 110         font-weight: bold;
 111 }
 112
 113 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:nth-child(2n) {
 114         background-color: #f7f7f7;
 115 }
 116
 117 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem {
 118         background-color: #d8ecd0;
 119 }
 120
 121 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem {
 122         color: #dddddd;
 123 }
 124
 125 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:hover {
 126         background-color: #dedede;
 127 }
 128
 129 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem:hover {
 130         background-color: #abd99a;
 131 }
 132
 133 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem:hover {
 134         background-color: transparent;
 135 }
 136
 137 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
 138         white-space: nowrap;
 139 }
 140
 141 .typo3-TCEforms optgroup.c-divider,
 142 select option.c-divider {
 143         background-color: #eee;
 144         border-top: 1px solid #666;
 145         color: #666;
 146         font-style: italic;
 147         text-transform: uppercase;
 148 }
 149
 150 .typo3-TCEforms optgroup option {
 151         background-color: white;
 152         border-bottom: none;
 153         color: black;
 154         font-style: normal;
 155         text-indent: 0px;
 156         text-transform: none;
 157 }
 158
 159 .typo3-TCEforms div.typo3-TCEforms-originalLanguageValue {
 160         background-color: #dadada;
 161         border: 1px solid #c0c0c0;
 162 }
 163
 164 .typo3-TCEforms div.typo3-TCEforms-diffBox {
 165         background-color: white;
 166         border: 1px solid black;
 167 }
 168
 169 .typo3-TCEforms div.typo3-TCEforms-diffBox-header {
 170         background-color: red;
 171         font-weight: bold;
 172 }
 173
 174 .typo3-TCEforms div.typo3-dyntabmenu-divs {
 175         border-bottom: 0;
 176 }
 177
 178 /* Default. Always used on main-palettes in the bottom of the forms */
 179 .typo3-TCEforms .class-main1,
 180 .typo3-TCEforms .class-main11,
 181 .typo3-TCEforms .class-main21,
 182 .typo3-TCEforms .class-main31,
 183 .typo3-TCEforms .class-main41,
 184 .typo3-TCEforms .class-main51 {
 185 }
 186
 187 .typo3-TCEforms .class-main2 td,
 188 .typo3-TCEforms .class-main12 td,
 189 .typo3-TCEforms .class-main22 td,
 190 .typo3-TCEforms .class-main32 td,
 191 .typo3-TCEforms .class-main42 td,
 192 .typo3-TCEforms .class-main52 td {
 193         border-top: 1px solid #c0c0c0;
 194 }
 195
 196 .typo3-TCEforms .class-main1 .typo3-TCEforms-checkboxArray td,
 197 .typo3-TCEforms .class-main11 .typo3-TCEforms-checkboxArray td,
 198 .typo3-TCEforms .class-main21 .typo3-TCEforms-checkboxArray td,
 199 .typo3-TCEforms .class-main31 .typo3-TCEforms-checkboxArray td,
 200 .typo3-TCEforms .class-main41 .typo3-TCEforms-checkboxArray td,
 201 .typo3-TCEforms .class-main51 .typo3-TCEforms-checkboxArray td {
 202         padding-right: 5px;
 203 }
 204
 205 .typo3-TCEforms tr.class-main2:first-child td,
 206 .typo3-TCEforms tr.class-main12:first-child td,
 207 .typo3-TCEforms tr.class-main22:first-child td,
 208 .typo3-TCEforms tr.class-main32:first-child td,
 209 .typo3-TCEforms tr.class-main42:first-child td,
 210 .typo3-TCEforms tr.class-main52:first-child td {
 211         border-top: 0;
 212 }
 213
 214 .typo3-TCEforms .class-main2,
 215 .typo3-TCEforms .class-main12,
 216 .typo3-TCEforms .class-main22,
 217 .typo3-TCEforms .class-main32,
 218 .typo3-TCEforms .class-main42,
 219 .typo3-TCEforms .class-main52 {
 220 }
 221
 222
 223
 224
 225 .typo3-TCEforms table.wrapperAttention .class-main2,
 226 .typo3-TCEforms table.wrapperAttention .class-main12,
 227 .typo3-TCEforms table.wrapperAttention .class-main22,
 228 .typo3-TCEforms table.wrapperAttention .class-main32,
 229 .typo3-TCEforms table.wrapperAttention .class-main42,
 230 .typo3-TCEforms table.wrapperAttention .class-main52 {
 231
 232 }
 233
 234
 235 .typo3-TCEforms .class-main4,
 236 .typo3-TCEforms .class-main14,
 237 .typo3-TCEforms .class-main24,
 238 .typo3-TCEforms .class-main34,
 239 .typo3-TCEforms .class-main44,
 240 .typo3-TCEforms .class-main54 {
 241         color: #000000;
 242 }
 243
 244 .typo3-TCEforms .class-main5,
 245 .typo3-TCEforms .class-main15,
 246 .typo3-TCEforms .class-main25,
 247 .typo3-TCEforms .class-main35,
 248 .typo3-TCEforms .class-main45,
 249 .typo3-TCEforms .class-main55 {
 250         color: #3c3c44;
 251 }
 252
 253 .typo3-TCEforms .wrapperTable,
 254 .typo3-TCEforms .wrapperTable1,
 255 .typo3-TCEforms .wrapperTable2,
 256 .typo3-TCEforms .wrapperTable3,
 257 .typo3-TCEforms .wrapperTable4,
 258 .typo3-TCEforms .wrapperTable5 {
 259         border: 1px solid #c0c0c0;
 260 }
 261
 262 .typo3-TCEforms .wrapperTable1 {
 263         border-top: 1px solid #c0c0c0;
 264 }
 265
 266 .typo3-TCEforms .typo3-dyntabmenu-divs .wrapperTable,
 267 .typo3-TCEforms .typo3-dyntabmenu-divs .wrapperTable1,
 268 .typo3-TCEforms .typo3-dyntabmenu-divs .wrapperTable2,
 269 .typo3-TCEforms .typo3-dyntabmenu-divs .wrapperTable3,
 270 .typo3-TCEforms .typo3-dyntabmenu-divs .wrapperTable4,
 271 .typo3-TCEforms .typo3-dyntabmenu-divs .wrapperTable5 {
 272         border: none;
 273         border-bottom: 1px solid #c0c0c0;
 274 }
 275
 276 .typo3-TCEforms table.wrapperAttention .wrapperTable,
 277 .typo3-TCEforms table.wrapperAttention .wrapperTable1,
 278 .typo3-TCEforms table.wrapperAttention .wrapperTable2,
 279 .typo3-TCEforms table.wrapperAttention .wrapperTable3,
 280 .typo3-TCEforms table.wrapperAttention .wrapperTable4,
 281 .typo3-TCEforms table.wrapperAttention .wrapperTable5 {
 282 }
 283
 284 .t3-form-palette-fieldset {
 285         border:none;
 286 }
 287
 288 .typo3-TCEforms div.imagethumbs .nobr {
 289         background-color: #CCC;
 290 }
 291
 292 .typo3-TCEforms span.filetypes {
 293         font-size: 0.8em;
 294 }
 295
 296 input.typo3-TCEforms-suggest-search {
 297         background-image: url('../../../../icons/gfx/zoom.gif');
 298         background-position: 2px center;
 299         background-repeat: no-repeat;
 300 }
 301
 302 div.typo3-TCEforms-suggest-choices {
 303         background-color: white;
 304         border: 1px solid #888;
 305 }
 306
 307 div.typo3-TCEforms-suggest-choices ul {
 308         list-style-type: none;
 309 }
 310
 311 div.typo3-TCEforms-suggest-choices li.selected {
 312         background-color: #ffb !important;
 313 }
 314
 315 div.typo3-TCEforms-suggest-choices li {
 316         cursor: pointer;
 317         background-color: #efeff4;
 318         background-repeat: no-repeat;
 319         background-position: 4px center;
 320         list-style-type: none;
 321 }
 322
 323 div.typo3-TCEforms-suggest-choices li.pages {
 324         background-color: #fcc;
 325 }
 326
 327 div.typo3-TCEforms-suggest-choices span.suggest-uid {
 328         font-size: 0.9em;
 329 }
 330
 331 div.typo3-TCEforms-suggest-choices span.suggest-path {
 332         font-size: 0.9em;
 333 }
 334
 335 div.typo3-TCEforms-suggest-choices span.suggest-path abbr {
 336         border-bottom: none;
 337 }
 338
 339 div.typo3-TCEforms-suggest-choises a {
 340         cursor: pointer;
 341 }
 342
 343 /* - - - - - - - - - - - - - - - - - - - - -
 344 TCEforms Flexforms
 345 - - - - - - - - - - - - - - - - - - - - - */
 346 .t3-form-field-container-flex {
 347 }
 348
 349 .t3-form-field-label-flex {
 350         border-top: 1px solid #c0c0c0;
 351 }
 352
 353 div.t3-form-field-container:first-child .t3-form-field-label-flex {
 354         border-top: 0;
 355 }
 356
 357 /** no separate background for dyntabs in flexforms **/
 358 .typo3-TCEforms .wrapperTable div.typo3-dyntabmenu-tabs ,
 359 .typo3-TCEforms .wrapperTable1 div.typo3-dyntabmenu-tabs,
 360 .typo3-TCEforms .wrapperTable2 div.typo3-dyntabmenu-tabs,
 361 .typo3-TCEforms .wrapperTable3 div.typo3-dyntabmenu-tabs,
 362 .typo3-TCEforms .wrapperTable4 div.typo3-dyntabmenu-tabs,
 363 .typo3-TCEforms .wrapperTable5 div.typo3-dyntabmenu-tabs {
 364         background: transparent;
 365 }
 366
 367 /** tabs inside the table => flexforms */
 368 .typo3-TCEforms .wrapperTable .typo3-dyntabmenu-divs,
 369 .typo3-TCEforms .wrapperTable1 .typo3-dyntabmenu-divs,
 370 .typo3-TCEforms .wrapperTable2 .typo3-dyntabmenu-divs,
 371 .typo3-TCEforms .wrapperTable3 .typo3-dyntabmenu-divs,
 372 .typo3-TCEforms .wrapperTable4 .typo3-dyntabmenu-divs,
 373 .typo3-TCEforms .wrapperTable5 .typo3-dyntabmenu-divs {
 374         border: 1px solid #c0c0c0;
 375 }
 376
 377
 378 /* - - - - - - - - - - - - - - - - - - - - -
 379 TCEforms Inline-Relational-Record-Editing
 380 - - - - - - - - - - - - - - - - - - - - - */
 381 .t3-form-field-container-inline {
 382         border: 1px solid #aaaaaa;
 383         background-color: #f9f9f9;
 384 }
 385
 386 .t3-form-field-header-inline {
 387         background-color: #E0E0E0;
 388 }
 389 .t3-form-field-header-inline:hover {
 390         background-color: #cccccc;
 391 }
 392
 393 .t3-form-header-inline-loadingbar {
 394         border-top: 1px solid #aaaaaa;
 395 }
 396
 397 .t3-form-field-container-inline-hidden,
 398 .t3-form-field-container-inline-placeHolder {
 399         opacity:0.3;
 400 }
 401
 402 .t3-form-field-header-inline table {
 403     vertical-align:top;
 404 }
 405
 406 .t3-form-field-header-inline-thumbnail-image {
 407     border: none;
 408 }
 409
 410 .t3-form-field-record-inline {
 411         border-top: 1px solid #aaaaaa;
 412 }
 413
 414 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable,
 415 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable1,
 416 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable2,
 417 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable3,
 418 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable4,
 419 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable5 {
 420         border: 0;
 421 }
 422
 423 .t3-form-field-header-inline td.t3-form-field-header-inline-summary,
 424 .t3-form-field-header-inline td.t3-form-field-header-inline-icon {
 425         cursor: pointer;
 426 }
 427
 428 .t3-form-field-header-inline td.t3-form-field-header-inline-summary dl dt {
 429         font-weight: bold;
 430 }
 431
 432 /* - - - - - - - - - - - - - - - - - - - - -
 433 TCEforms Sections
 434 - - - - - - - - - - - - - - - - - - - - - */
 435
 436 .typo3-TCEforms-flexForm .bgColor4,
 437 .typo3-TCEforms-flexForm .bgColor5 {
 438         background: none;
 439         display: inline-block;
 440 }
 441
 442 .t3-form-field-label-flexsection {
 443         border-top: 1px solid #cdcdcd;
 444 }
 445
 446 .t3-form-field-container-flexsections {
 447         background: #dadada;
 448 }
 449
 450 .t3-form-field-record-flexsection {
 451         background: #eee;
 452 }
 453
 454 .t3-form-field-add-flexsection {
 455         border-top: 1px solid #cdcdcd;
 456 }
 457
 458
 459 .typo3-TCEforms-select-selectedItemWithBackgroundImage {
 460         background-color:#fff;
 461         background-position: 0% 50%;
 462         background-repeat:no-repeat;
 463         padding:1px 1px 1px 24px;
 464 }
 465
 466 .ext-webkit .typo3-TCEforms-select-selectedItemWithBackgroundImage {
 467         text-indent: 20px;
 468         background-position-x: 6px;
 469 }
 470 .ext-webkit .typo3-TCEforms-select-selectedItemWithBackgroundImage optgroup option {
 471         text-indent: 20px;
 472 }
 473 .ext-chrome:not(.ext-mac) .typo3-TCEforms-select-selectedItemWithBackgroundImage {
 474         text-indent: 0px;
 475         background-position-x: 5px;
 476 }
 477
 478 .t3-tceforms-fieldReadOnly {
 479     padding:5px;
 480     border:1px solid #cccccc;
 481     background: #f4f4f4;
 482     color: #696362;
 483     -webkit-box-shadow: inset 0px 0px 5px 0px #e8e8e8;
 484     box-shadow: inset 0px 0px 5px 0px #e8e8e8;
 485     padding-right:21px;
 486     position:relative;
 487 }
 488
 489 .t3-tceforms-fieldReadOnly span.t3-icon {
 490     position:absolute;
 491     right:3px;
 492     top:4px;
 493 }
 494
 495 .t3-form-field-item {
 496         position: relative;
 497         border: 1px solid transparent;
 498         padding: 7px 0;
 499 }
 500
 501 .t3-tceforms-widget-null-wrapper + .t3-form-field-item {
 502         display: inline-block;
 503 }
 504
 505 .t3-form-field-item.disabled {
 506         border: 1px dotted #696362;
 507 }
 508
 509 .t3-form-field-disable,
 510 .t3-form-field-item.disabled .t3-form-field-item.disabled .t3-form-field-disable {
 511         display: none;
 512 }
 513 .t3-form-field-item.disabled .t3-form-field-disable {
 514         z-index: 8000;
 515         background: #f4f4f4;
 516         display: block;
 517         position: absolute;
 518         width: 100%;
 519         height: 100%;
 520
 521         opacity: 0.5;
 522         filter: alpha(opacity=50);
 523         -moz-opacity: 0.5;
 524 }
 525
 526 .t3-form-palette-field-label {
 527         text-indent: 2px;
 528 }