PageRenderTime 38ms CodeModel.GetById 2ms app.highlight 32ms RepoModel.GetById 1ms app.codeStats 0ms

/jsonwebservice/src_client_yui/com/jaxws/json/yui/doc/provider/inputex/css/inputEx.css

http://jsonwebservice.googlecode.com/
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}