/jsonwebservice/src_client_yui/com/jaxws/json/yui/doc/provider/inputex/css/inputEx.css
CSS | 712 lines | 484 code | 135 blank | 93 comment | 0 complexity | b94fe5dfaf6239ca42c94ae5c26cfa23 MD5 | raw file
1 2/** 3 * inputEx.Field 4 */ 5div.inputEx-fieldWrapper { 6 margin-bottom:0.2em; 7} 8 9div.inputEx-label { 10 float: left; 11 color: #505050; 12 text-align: right; 13 padding: 0.2em 0.5em 0 0; 14} 15 16div.inputEx-Group div.inputEx-label { 17 width: 130px; 18} 19 20div.inputEx-Field { 21 float: left; 22} 23 24div.inputEx-description { 25 clear:both; 26 color: #505050; 27 font-size: 75%; 28 margin-top: 2px; 29} 30 31div.inputEx-message { 32 float: left; 33 margin: 4px; 34 font-size: 85%; 35} 36 37div.inputEx-clear-div { 38 clear: both; 39} 40 41 42/** 43 * VALID, INVALID, EMPTY states (and focused) 44 */ 45 46div.inputEx-invalid > div.inputEx-message { 47 color:#C00E0C; 48 font-weight:bold; 49} 50 51div.inputEx-invalid > div.inputEx-label { 52 color:#C00E0C; 53 font-weight:bold; 54} 55 56div.inputEx-invalid > div.inputEx-label label { 57 background:transparent url(?CLIENT_RESOURCE=inputex/images/error_bang.gif) no-repeat scroll 0 1px; 58 padding-left:20px; 59} 60 61div.inputEx-valid > div.inputEx-message { 62 color:#505050; 63 font-weight: normal; 64} 65 66div.inputEx-valid > div.inputEx-label { 67 color:#505050; 68 font-weight:normal; 69} 70 71/* Properties set by an invalid higher hierarchy field are disabled for valid or empty subfields */ 72div.inputEx-valid > div.inputEx-label label, 73div.inputEx-empty > div.inputEx-label label { 74 background: none; 75 padding-left: inherit; 76 font-weight:normal; 77 color: #505050; 78} 79 80 81div.inputEx-typeInvite > div.inputEx-Field input, div.inputEx-typeInvite > div.inputEx-Field textarea { 82 color: #aaa; 83} 84div.inputEx-empty div.inputEx-valid div.inputEx-Field input, div.inputEx-empty div.inputEx-valid div.inputEx-Field textarea { 85 color: black; 86} 87 88/** 89 * inputEx.StringField 90 */ 91div.inputEx-StringField-wrapper { 92 float: none; 93} 94 95/** 96 * inputEx.Group 97 */ 98 99legend.inputEx-Group-legend { 100 color:#63126B; 101 font-weight: bold; 102} 103 104div.inputEx-Group div.inputEx-Group-collapseImg { 105 width: 14px; 106 height: 14px; 107 background-image: url(?CLIENT_RESOURCE=inputex/images/sprite-menu.gif); 108 background-color: transparent; 109 background-repeat: no-repeat; 110 background-attachment: scroll; 111 float: left; 112} 113 114div.inputEx-Group fieldset.inputEx-Expanded legend , 115div.inputEx-Group fieldset.inputEx-Collapsed legend { 116 cursor: pointer; 117} 118 119div.inputEx-Group fieldset.inputEx-Expanded legend div.inputEx-Group-collapseImg { 120 background-position: -8px 2px; 121} 122 123div.inputEx-Group fieldset.inputEx-Expanded legend:hover div.inputEx-Group-collapseImg { 124 background-position: -8px -78px; 125} 126 127div.inputEx-Group fieldset.inputEx-Collapsed legend div.inputEx-Group-collapseImg { 128 background-position: -8px -317px; 129} 130 131div.inputEx-Group fieldset.inputEx-Collapsed legend:hover div.inputEx-Group-collapseImg { 132 background-position: -8px -397px; 133} 134 135div.inputEx-Group fieldset.inputEx-Collapsed div.inputEx-fieldWrapper { 136 display: none; 137} 138 139 140/** 141 * inputEx.Form 142 */ 143 144div.inputEx-Form-buttonBar { 145 margin: 3px 0 0 137px; 146} 147 148.inputEx-Button { margin:0 4px 0 0; } 149 150div.inputEx-Form-Mask { 151 height:275px; 152 left:0pt; 153 position:absolute; 154 top:0pt; 155 width:180px; 156} 157 158div.inputEx-Form-Mask div.inputEx-Form-Mask-bg { 159 background-color:#FFFFFF; 160 height:100%; 161 left:0pt; 162 opacity:0.9; 163 position:absolute; 164 top:0pt; 165 width:100%; 166} 167div.inputEx-Form-Mask div.inputEx-Form-Mask-spinner { 168 width: 36px; 169 height: 36px; 170 background-image: url(?CLIENT_RESOURCE=inputex/images/spinner.gif); 171} 172div.inputEx-Form-Mask span { 173 color:#666666; 174} 175 176 177 178 179/** 180 * UrlField 181 */ 182 183/* position relative to position:absolute favicon inside */ 184div.inputEx-UrlField {position:relative;} 185 186div.inputEx-UrlField input { padding-left: 20px; } 187 188div.inputEx-UrlField input.nofavicon { 189 padding-left: 0px; 190} 191 192div.inputEx-UrlField img { 193 position: absolute; 194 top: 3px; 195 left: 2px; 196 width: 16px; 197 height: 16px; 198} 199 200 201/** 202 * inputEx-ListField 203 */ 204 205/* Buttons */ 206img.inputEx-ListField-addButton { 207 background: transparent url(?CLIENT_RESOURCE=inputex/images/add.png) no-repeat scroll 0%; 208 width: 16px; 209 height: 16px; 210 cursor: pointer; 211 } 212 213img.inputEx-ListField-delButton { 214 background: transparent url(?CLIENT_RESOURCE=inputex/images/delete.png) no-repeat scroll 0%; 215 width: 16px; 216 height: 16px; 217 float: left; 218 cursor: pointer; 219} 220 221/* Arrows */ 222div.inputEx-ListField-Arrow { 223 width: 16px; 224 height: 16px; 225 float: left; 226 cursor: pointer; 227} 228 229div.inputEx-ListField-ArrowUp { 230 background: transparent url(?CLIENT_RESOURCE=inputex/images/bullet_arrow_up.png) no-repeat scroll 0%; 231} 232div.inputEx-ListField-ArrowDown { 233 background: transparent url(?CLIENT_RESOURCE=inputex/images/bullet_arrow_down.png) no-repeat scroll 0%; 234} 235 236div.inputEx-ListField-subFieldEl { 237 float:left; 238 margin-left:4px; 239} 240 241a.inputEx-List-link { 242 color: blue; 243 cursor: pointer; 244 margin-left: 10px; 245} 246 247a.inputEx-List-link:hover { 248 text-decoration: underline; 249} 250 251 252/** 253 * inputEx.InPlaceEdit 254 */ 255div.inputEx-InPlaceEdit-visu { cursor: pointer; padding: 3px; } 256 257.inputEx-InPlaceEdit-editor .inputEx-InPlaceEdit-editorDiv { 258 float: left; 259 margin-bottom:0; /* remove 0.2em bottom margin because no need to cumulate field and editor-field margins */ 260} 261 262.inputEx-InPlaceEdit-OkButton { margin-left: 5px; } 263 264 265/** 266 * inputEx.AutoComplete 267 */ 268.yui-skin-sam div.inputEx-AutoComplete .yui-ac-input { 269 width: auto; 270 position: relative; 271} 272.yui-skin-sam div.inputEx-AutoComplete .yui-ac-content { 273 width: auto; 274} 275div.inputEx-AutoComplete div.yui-ac-container { 276 margin-bottom:2em; 277 width:25em; 278} 279 280/** 281 * DateField 282 */ 283 284div.inputEx-DateField { 285 background: transparent url(?CLIENT_RESOURCE=inputex/images/calendar.gif) no-repeat scroll left center; 286 padding-left: 20px; 287} 288 289div.inputEx-DateField input { 290 width: 75px; 291} 292 293/** 294 * Picker fields 295 */ 296div.inputEx-PickerField, div.inputEx-PickerField input { 297 vertical-align: top; 298} 299 300div.inputEx-PickerField { 301 background: none; 302 padding-left: 0; 303} 304 305div.inputEx-PickerField .yui-menu-button button { 306 background-position: center center; 307 background-repeat: no-repeat; 308 padding:0; 309 width:20px; 310 height:18px; 311 min-height:0; /* reset "min-height:2em" that prevented "height:18px" to be applied */ 312} 313 314div.inputEx-PickerField .yui-overlay { 315 -moz-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.2), -2px 2px 4px rgba(0, 0, 0, 0.2); 316 -webkit-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.2), -2px 2px 4px rgba(0, 0, 0, 0.2); 317} 318 319/* 320* Date Picker 321*/ 322div.inputEx-DatePickerField .yui-menu-button button { 323 background-image: url(?CLIENT_RESOURCE=inputex/images/calendar.gif); 324} 325 326 327/** 328 * Color Field 329 */ 330 331div.inputEx-ColorField div.yui-overlay div.bd { 332 background:white no-repeat scroll 5px 5px; 333 border:1px solid #AAAAAA; 334} 335 336div.inputEx-ColorField .yui-menu-button button { 337 background-image: url(?CLIENT_RESOURCE=inputex/images/palette.png); 338} 339 340div.inputEx-ColorField-button { 341 height: 19px; 342 width: 100px; 343 border: 1px solid #B5B8C8; 344 margin-left: 0px; 345 cursor: pointer; 346 float:left; /* to display color picker icon on the right */ 347} 348 349.inputEx-ColorField-square { 350 float:left; 351 cursor: pointer; 352 width:15px; 353 height:15px; 354 margin:2px; 355} 356 357.inputEx-ColorField-square.selected { 358 width:13px; 359 height:13px; 360 border-width:1px; 361 border-style:solid; 362 border-color:#666666; 363 border-color:rgba(0,0,0,0.5); 364} 365 366.inputEx-ColorField-square:hover { 367 width:13px; 368 height:13px; 369 border-width:1px; 370 border-style:solid; 371 border-color:#666666; 372 border-color:rgba(0,0,0,0.5); 373} 374 375.inputEx-ColorField-Grid { padding:5px; } 376 377 378/** 379 * ColorPicker Field (YUI ColorPicker) 380 */ 381 382.inputEx-ColorPicker-Button { vertical-align: baseline; } 383.inputEx-ColorPicker-Button button { 384 outline: none; /* Safari */ 385 line-height: 1.5; 386} 387 388/* Style the Button instance's label as a square whose background color 389 represents the current value of the ColorPicker instance. */ 390.inputEx-ColorPicker-Label { 391 display: block; 392 display: inline-block; 393 *display: block; /* For IE */ 394 *margin: .25em 0; /* For IE */ 395 width: 1em; 396 height: 1em; 397 overflow: hidden; 398 text-indent: 1em; 399 background-color: #fff; 400 white-space: nowrap; 401 border: solid 1px #000; 402} 403 404 405/* Hide default colors for the ColorPicker instance. */ 406.inputEx-ColorPicker-Container-nocontrols .yui-picker-controls, 407.inputEx-ColorPicker-Container-nocontrols .yui-picker-swatch, 408.inputEx-ColorPicker-Container-nocontrols .yui-picker-websafe-swatch { 409 display: none; 410} 411 412 413/* Size the body element of the Menu instance to match the dimensions of the ColorPicker instance. */ 414.inputEx-ColorPicker-Container { 415 width: 370px; 416 height: 190px; 417} 418 419.inputEx-ColorPicker-Container-nocontrols { 420 width: 220px; 421 height: 190px; 422} 423 424 425/** 426 * SliderField 427 */ 428div.inputEx-SliderField { 429} 430 431div.inputEx-SliderField div.inputEx-SliderField-bg { 432 position: relative; 433 background:url(?CLIENT_RESOURCE=inputex/css/'../images/slider-bg-h.gif') 5px 0 no-repeat; 434 height:28px; 435 width:112px; 436 float: left; 437} 438 439div.inputEx-SliderField div.inputEx-SliderField-thumb { 440 background: url(?CLIENT_RESOURCE=inputex/css/'../images/thumb-n.gif') 0px 0px no-repeat; 441 cursor: pointer; 442 position: absolute; 443 top: 4px; 444 width: 17px; 445 height: 21px; 446} 447 448div.inputEx-SliderField div.inputEx-SliderField-value { 449 float: left; 450 margin-top:6px; 451 margin-left: 5px; 452} 453 454 455/** 456 * Password Field 457 */ 458 459div.inputEx-PasswordField input { 460 float: left; 461} 462 463div.inputEx-PasswordField div.capsLockWarning { 464 float: left; 465 margin:3px 4px; 466 color: #505050; 467 font-size: 85%; 468} 469 470div.inputEx-Password-StrengthIndicator { 471 float: left; 472 color: #505050; 473 font-size: 70%; 474 margin-left:10px; 475 width:83px; 476} 477 478div.inputEx-Password-StrengthIndicator div.inputEx-Password-StrengthIndicatorBlock { 479 background-color: white; 480 width: 1.4em; 481 height: 7px; 482 border: 1px solid #aaaaaa; 483 float: left; 484 margin-left: 2px; 485} 486 487/** 488 * Checkbox 489 */ 490 491/* Common css */ 492div.inputEx-CheckBox { padding-top:0.2em; } 493div.inputEx-CheckBox input { margin-right: 0.2em; } 494label.inputExForm-checkbox-rightLabel { cursor:pointer; } 495 496/* Awful hack to target IE < 8 */ 497div.inputEx-CheckBox { *padding-top:0; } 498 499/* Awful hack to target webkit */ 500@media screen and (-webkit-min-device-pixel-ratio:0) { div.inputEx-CheckBox input {position:relative; top:1px;} } 501 502 503/** 504 * Radio Field 505 */ 506label.inputEx-RadioField-rightLabel { cursor: pointer; } 507 508div.inputEx-RadioField-choice { float: left; margin-right: 10px; padding-top:0.2em; } 509div.inputEx-RadioField-choice input[type="radio"] { margin-right:0.2em; } 510 511/* Vertical display */ 512.inputEx-RadioField-Vertically .inputEx-RadioField-choice { float: none; } 513 514/** 515 * CombineField 516 */ 517 518div.inputEx-CombineField-separator { 519 float: left; 520 margin-top:2px; 521} 522 523/** 524 * DDList 525 */ 526.inputEx-DDList-item { 527 padding: 5px; 528 background-color: #DDDDDD; 529 cursor: move; 530 border: 1px solid #BBBBBB; 531 width: 300px; 532 position: relative; 533} 534 535.inputEx-DDList-item span.inputEx-DDList-label { 536} 537 538.inputEx-DDList-item a { 539 color:#D05D00; 540 padding: 3px 5px; 541 position:absolute; 542 right:0; 543 top:0; 544 cursor: pointer; 545} 546 547.inputEx-DDList-item a:hover { 548 text-decoration: underline; 549} 550 551 552/** 553 * inputEx.TypeField 554 */ 555div.inputEx-TypeField-EditButton { 556 width: 16px; 557 height: 16px; 558 background-image: url(?CLIENT_RESOURCE=inputex/images/pencil.png); 559 cursor: pointer; 560 float: left; 561 margin-left:4px; 562 position: relative; 563} 564 565div.inputEx-TypeField-EditButton.opened { 566 background-image: url(?CLIENT_RESOURCE=inputex/images/pencil_delete.png); 567} 568 569div.inputEx-TypeField-FieldValueWrapper { 570 float: left; 571 margin-left: 4px; 572} 573 574div.inputEx-TypeField-PropertiesPanel { 575 border: 1px solid #aaa; 576 padding: 3px; 577 background-color: white; 578 position: absolute; 579 top: 0px; 580 left: 16px; 581 z-index:1; 582 width: 380px; 583} 584 585/** 586 * inputEx.MenuField 587 */ 588 589div.inputEx-MenuField div.inputEx-Result {background-color:#FFFFFF; border:1px solid #CCCCCC; padding:2px 25px 2px 5px; cursor:pointer} 590div.inputEx-MenuField div.inputEx-RightArrow {background-image:url(?CLIENT_RESOURCE=inputex/images/menu-right-arrow.png);background-position:right center;background-repeat:no-repeat;} 591div.inputEx-MenuField div.inputEx-DownArrow {background-image:url(?CLIENT_RESOURCE=inputex/images/menu-down-arrow.png);background-position:right center;background-repeat:no-repeat;} 592 593 594/** 595 * inputEx-JsonTreeInspector 596 */ 597ul.inputEx-JsonTreeInspector li { 598 padding-left: 20px; 599 list-style-type: none; 600} 601 602ul.inputEx-JsonTreeInspector li.collapsed { 603 background:transparent url(?CLIENT_RESOURCE=inputex/images/plus.gif) no-repeat scroll 0 0; 604 cursor: pointer; 605} 606 607ul.inputEx-JsonTreeInspector li.expanded { 608 background:transparent url(?CLIENT_RESOURCE=inputex/images/minus.gif) no-repeat scroll 0 0; 609 cursor: pointer; 610} 611 612ul.inputEx-JsonTreeInspector li span { 613 padding-left: 20px; 614 color: green; 615} 616 617ul.inputEx-JsonTreeInspector li span.type-number, 618ul.inputEx-JsonTreeInspector li span.type-boolean { 619 color: blue; 620} 621 622ul.inputEx-JsonTreeInspector li span.type-null { 623 color: red; 624} 625 626 627/** 628 * Datatable 629 */ 630.yui-skin-sam .inputex-datatable-columnsDlg {visibility:hidden;border:1px solid #808080;background-color:#E3E3E3;} 631.yui-skin-sam .inputex-datatable-columnsDlg .hd {font-weight:bold;padding:1em;background:none;background-color:#E3E3E3;border-bottom:0;} 632.yui-skin-sam .inputex-datatable-columnsDlg .ft {text-align:right;padding:.5em;background-color:#E3E3E3;} 633.yui-skin-sam .inputex-datatable-columnsDlg .bd {height:10em;margin:0 1em;overflow:auto;border:1px solid black;background-color:white;} 634.yui-skin-sam .inputex-datatable-columnsDlg .dt-dlg-pickercol {clear:both;padding:.5em 1em 3em;border-bottom:1px solid gray;} 635.yui-skin-sam .inputex-datatable-columnsDlg .dt-dlg-pickerkey {float:left;} 636.yui-skin-sam .inputex-datatable-columnsDlg .dt-dlg-pickerbtns {float:right;} 637/* Container workarounds for Mac Gecko scrollbar issues */ 638.yui-skin-sam .yui-panel-container.hide-scrollbars .inputex-datatable-columnsDlg .bd { 639 /* Hide scrollbars by default for Gecko on OS X */ 640 overflow: hidden; 641} 642.yui-skin-sam .yui-panel-container.show-scrollbars .inputex-datatable-columnsDlg .bd { 643 /* Show scrollbars for Gecko on OS X when the Panel is visible */ 644 overflow: auto; 645} 646 647/** 648 * inputEx-dtInPlaceEdit 649 */ 650tbody.yui-dt-data td.yui-dt-editable div.inputEx-dtInPlaceEdit-onModifyItem{ 651 background-color: #FFAFAF; 652} 653 654tbody.yui-dt-data div.inputEx-dtInPlaceEdit-deleteLinkSpinner{ 655 width:16px; 656 height:16px; 657 background:transparent url(?CLIENT_RESOURCE=inputex/images/ajax-loader.gif) no-repeat scroll 20px 4px; 658} 659 660.yui-dt-editor .yui-dt-button button { 661 width: auto; 662} 663 664/** 665 * StringAvailability 666 */ 667div.inputEx-fieldWrapper div.availabilityDiv { 668 display:none; 669 float:left; 670 height:20px; 671} 672 673div.inputEx-fieldWrapper div.availabilityDiv div.icon { 674 float:left; 675 display:none; 676 height:20px; 677 width:16px; 678 margin-left:5px; 679} 680 681div.inputEx-fieldWrapper div.availabilityDiv.loading div.icon { 682 display:block; 683 background: transparent url(?CLIENT_RESOURCE=inputex/images/ajax-loader.gif) no-repeat 0 3px; 684} 685 686div.inputEx-fieldWrapper div.availabilityDiv.available div.icon { 687 display:block; 688 background: transparent url(?CLIENT_RESOURCE=inputex/images/tick.gif) no-repeat 0 3px; 689} 690 691div.inputEx-fieldWrapper div.availabilityDiv.unavailable div.icon { 692 display:block; 693 background: transparent url(?CLIENT_RESOURCE=inputex/images/exclamation.gif) no-repeat 0 3px; 694} 695 696 697div.inputEx-fieldWrapper div.availabilityDiv div.text { 698 float:left; 699 height:20px; 700 padding:4px 5px 0; 701 font-size:85%; 702 font-weight:bold; 703} 704 705div.inputEx-fieldWrapper div.availabilityDiv.unavailable div.text, 706div.inputEx-fieldWrapper div.availabilityDiv.required div.text{ 707 color:#C00E0C; 708} 709 710div.inputEx-fieldWrapper div.availabilityDiv.available div.text{ 711 color:#2C811D; 712}