diff options
Diffstat (limited to 'lib/dijit/themes/nihilo/form')
| -rw-r--r-- | lib/dijit/themes/nihilo/form/Button.css | 43 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/Button_rtl.css | 3 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/Checkbox.css | 47 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/Common.css | 33 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/RadioButton.css | 46 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/Select.css | 18 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/Slider.css | 35 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/Slider_rtl.css | 11 | ||||
| -rw-r--r-- | lib/dijit/themes/nihilo/form/TimeTextBox.css | 2 |
9 files changed, 187 insertions, 51 deletions
diff --git a/lib/dijit/themes/nihilo/form/Button.css b/lib/dijit/themes/nihilo/form/Button.css index b1ea84e96..0be9ea4a3 100644 --- a/lib/dijit/themes/nihilo/form/Button.css +++ b/lib/dijit/themes/nihilo/form/Button.css @@ -1,28 +1,42 @@ +/***** + dijit.form.Button + dijit.form.DropDownButton + dijit.form.ComboButton + dijit.form.ComboBox (partial) + dijit.form.Spinner (partial) (TODO: create NumberSpinner.css file like claro has) + *****/ + .nihilo .dijitButtonNode { - - + /* enabled state - inner */ + /* border:1px outset #a0a0a0; */ border:1px solid #dedede; border-bottom:1px solid #dedede; padding: 0.1em 0.2em 0.2em 0.2em; background: #fff url("../images/buttonEnabled.png") repeat-x top left; } + .nihilo .dijitSelect .dijitButtonContents { border-right: none; } + .nihilo .dijitButtonText { text-align: center; padding: 0 0.3em; } + .nihilo .dijitComboBox .dijitButtonNode { - border-width: 0px 0px 0px 1px; + border-width: 0 0 0 1px; } + .nihilo .dijitArrowButton { color: #111; } + .nihilo .dijitComboButton .dijitDownArrowButton { padding-right:4px; } + .nihilo .dijitComboBoxReadOnly, .nihilo .dijitSpinnerReadOnly, .nihilo .dijitSpinnerReadOnly .dijitButtonNode, @@ -33,7 +47,7 @@ .nihilo .dijitComboBoxDisabled, .nihilo .dijitSpinnerDisabled, .nihilo .dijitSpinnerDisabled .dijitButtonNode { - + /* disabled state - inner */ border-color: #dedede; background:#fafafa url("../images/buttonDisabled.png") top repeat-x; opacity: 0.60; @@ -42,9 +56,11 @@ .dj_ie7 .nihilo .dijitReadOnly INPUT, .dj_ie6 .nihilo .dijitComboButtonDisabled .dijitButtonText, .dj_ie7 .nihilo .dijitComboButtonDisabled .dijitButtonText { - + /* opacity doesn't work on table node in IE, work around here */ color: #aaa; } + + .nihilo .dijitButtonHover .dijitButtonNode, .nihilo .dijitButtonNodeHover, .nihilo .dijitToggleButtonHover .dijitButtonNode, @@ -52,11 +68,12 @@ .nihilo .dijitButtonContentsHover, .nihilo .dijitDownArrowButtonHover, .nihilo .dijitUpArrowButtonHover { - - + /* hover state - inner */ + /* TODO: change from Hover to Selected so that button is still highlighted while drop down is being used */ color:#243C5F; background:#fcfcfc url("../images/buttonHover.png") repeat-x top left; } + .nihilo .dijitUpArrowButtonActive, .nihilo .dijitDownArrowButtonActive, .nihilo .dijitButtonActive .dijitButtonNode, @@ -64,14 +81,18 @@ .nihilo .dijitDropDownButtonActive .dijitButtonNode, .nihilo .dijitComboButton .dijitButtonContentsActive, .nihilo .dijitStackController .dijitToggleButtonChecked .dijitButtonNode { - + /* active state - inner (for when you are pressing a normal button, or + * when a radio-type button is in a depressed state + */ border-color:#dedede; background: #f5f5f5 url("../images/buttonActive.png") top left repeat-x; } + + .nihilo .dijitArrowButtonInner { background-image: url("../images/spriteArrows.png"); background-repeat: no-repeat; - background-position: 0px center; + background-position: 0 center; width: 11px; height: 11px; } @@ -88,10 +109,10 @@ background-image: url("../images/spriteArrows.gif"); } .dj_webkit .nihilo .dijitSpinner .dijitUpArrowButton .dijitArrowButtonInner { - margin-top: -1px; + margin-top: -1px; /* image has too many blank pixels on top */ } .dj_ie .nihilo .dijitSpinner .dijitUpArrowButton .dijitArrowButtonInner { - margin-top: 1px; + margin-top: 1px; /* image has too many blank pixels on top */ } .nihilo .dijitSpinnerButtonContainer { width: auto; diff --git a/lib/dijit/themes/nihilo/form/Button_rtl.css b/lib/dijit/themes/nihilo/form/Button_rtl.css index 3a7acc04c..60d4c4da4 100644 --- a/lib/dijit/themes/nihilo/form/Button_rtl.css +++ b/lib/dijit/themes/nihilo/form/Button_rtl.css @@ -1,7 +1,8 @@ .dijitRtl .nihilo .dijitComboBox .dijitButtonNode { - border-width: 0px 0px 0px 1px; + border-width: 0 0 0 1px; } .dijitRtl .nihilo .dijitSelect .dijitButtonContents { border-left: none; border-right-width: 1px; } + diff --git a/lib/dijit/themes/nihilo/form/Checkbox.css b/lib/dijit/themes/nihilo/form/Checkbox.css index ceee44ffe..260666f99 100644 --- a/lib/dijit/themes/nihilo/form/Checkbox.css +++ b/lib/dijit/themes/nihilo/form/Checkbox.css @@ -1,40 +1,67 @@ +/* + * CheckBox and Radio Widgets, + * and the CSS to embed a checkbox or radio icon inside a ToggleButton. + * + * Order of images in the default sprite (from L to R, checkbox and radio in same image): + * checkbox normal - checked + * - unchecked + * disabled - checked + * - unchecked + * hover - checked + * - unchecked + * + * radio normal - checked + * - unchecked + * disabled - checked + * - unchecked + * hover - checked + * - unchecked +*/ + .nihilo .dijitToggleButton .dijitCheckBox, .nihilo .dijitToggleButton .dijitCheckBoxIcon { background-image: url('../images/spriteCheckbox.gif'); } + .nihilo .dijitCheckBox, -.nihilo .dijitCheckBoxIcon { - background-image: url('../images/spriteCheckbox.gif'); +.nihilo .dijitCheckBoxIcon { /* inside a toggle button */ + background-image: url('../images/spriteCheckbox.gif'); /* checkbox sprite image */ background-repeat: no-repeat; width: 16px; height: 16px; margin: 0; padding: 0; } + .nihilo .dijitCheckBox, .nihilo .dijitToggleButton .dijitCheckBoxIcon { - + /* unchecked */ background-position: -16px; } + .nihilo .dijitCheckBoxChecked, .nihilo .dijitToggleButtonChecked .dijitCheckBoxIcon { - - background-position: 0px; + /* checked */ + background-position: 0; } + .nihilo .dijitCheckBoxDisabled { - + /* disabled */ background-position: -48px; } + .nihilo .dijitCheckBoxCheckedDisabled { - + /* disabled but checked */ background-position: -32px; } + .nihilo .dijitCheckBoxHover { - + /* hovering over an unchecked enabled checkbox */ background-position: -80px; } + .nihilo .dijitCheckBoxCheckedHover { - + /* hovering over a checked enabled checkbox */ background-position: -64px; -} +}
\ No newline at end of file diff --git a/lib/dijit/themes/nihilo/form/Common.css b/lib/dijit/themes/nihilo/form/Common.css index fab63eba8..65dddc637 100644 --- a/lib/dijit/themes/nihilo/form/Common.css +++ b/lib/dijit/themes/nihilo/form/Common.css @@ -1,25 +1,42 @@ +/**** + dijit.form.TextBox + dijit.form.ValidationTextBox + dijit.form.SerializableTextBox + dijit.form.RangeBoundTextBox + dijit.form.NumberTextBox + dijit.form.CurrencyTextBox + dijit.form.NumberSpinner + dijit.form.ComboBox (partial) + ****/ + .nihilo .dijitInputContainer INPUT, .nihilo .dijitTextBox { - margin: 0em 0.1em; + margin: 0 0.1em; } + .nihilo .dijitTextBox, .nihilo .dijitTextArea { - + /* For all except dijit.form.NumberSpinner: the actual input element. + For TextBox, ComboBox, Spinner: the table that contains the input. + Otherwise the actual input element. + */ background:#fff url("../images/validationInputBg.png") repeat-x top left; #background:#fff url('../images/validationInputBg.gif') repeat-x top left; border:1px solid #d3d3d3; } + .nihilo .dijitComboBox .dijitButtonNode { padding: 0 0.2em !important; } .nihilo .dijitTextBox .dijitButtonNode { - + /* line between the input area and the drop down button */ border-color: #d3d3d3; } + .nihilo .dijitTextBoxFocused, .nihilo .dijitTextAreaFocused { - + /* input field when focused (ie: typing affects it) */ border-color:#b3b3b3; } .nihilo .dijitTextBoxFocused .dijitButtonNode, @@ -32,20 +49,26 @@ .nihilo .dijitSpinner .dijitDownArrowButtonActive { border-top-color:#d3d3d3; } + .nihilo .dijitError { border-color:#b3b3b3; background-color:#f9f7ba; background-image:none; } + .nihilo .dijitErrorFocused { background-color:#ff6; background-image:none; } + +/* Validation errors */ .nihilo .dijitValidationIcon { - + /* prevent height change when widget goes from valid to invalid state */ width: 16px; background: transparent url('../images/warning.png') no-repeat center center; } + +/* The highlight is shown in the ComboBox menu. */ .nihilo .dijitComboBoxHighlightMatch { background-color:#d3d3d3; } diff --git a/lib/dijit/themes/nihilo/form/RadioButton.css b/lib/dijit/themes/nihilo/form/RadioButton.css index c876f590e..d0dba3020 100644 --- a/lib/dijit/themes/nihilo/form/RadioButton.css +++ b/lib/dijit/themes/nihilo/form/RadioButton.css @@ -1,40 +1,66 @@ +/* + * CheckBox and Radio Widgets, + * and the CSS to embed a checkbox or radio icon inside a ToggleButton. + * + * Order of images in the default sprite (from L to R, checkbox and radio in same image): + * checkbox normal - checked + * - unchecked + * disabled - checked + * - unchecked + * hover - checked + * - unchecked + * + * radio normal - checked + * - unchecked + * disabled - checked + * - unchecked + * hover - checked + * - unchecked +*/ .nihilo .dijitToggleButton .dijitRadio, .nihilo .dijitToggleButton .dijitRadioIcon { background-image: url('../images/spriteRadio.gif'); } + .nihilo .dijitRadio, -.nihilo .dijitRadioIcon { - background-image: url('../images/spriteRadio.gif'); +.nihilo .dijitRadioIcon { /* inside a toggle button */ + background-image: url('../images/spriteRadio.gif'); /* checkbox sprite image */ background-repeat: no-repeat; width: 16px; height: 16px; margin: 0; padding: 0; } + .nihilo .dijitRadio, .nihilo .dijitToggleButton .dijitRadioIcon { - + /* unselected */ background-position: -16px; } + .nihilo .dijitRadioChecked, .nihilo .dijitToggleButtonChecked .dijitRadioIcon { - - background-position: 0px; + /* selected */ + background-position: 0; } + .nihilo .dijitRadioDisabled { - + /* unselected and disabled */ background-position: -48px; } + .nihilo .dijitRadioCheckedDisabled { - + /* selected but disabled */ background-position: -32px; } + .nihilo .dijitRadioHover { - + /* hovering over an unselected enabled radio button */ background-position: -80px; } + .nihilo .dijitRadioCheckedHover { - + /* hovering over a selected enabled radio button */ background-position: -64px; -} +}
\ No newline at end of file diff --git a/lib/dijit/themes/nihilo/form/Select.css b/lib/dijit/themes/nihilo/form/Select.css index af811f50e..61967e550 100644 --- a/lib/dijit/themes/nihilo/form/Select.css +++ b/lib/dijit/themes/nihilo/form/Select.css @@ -1,6 +1,8 @@ .nihilo .dijitSelect .dijitButtonNode { - padding: 0px; + padding: 0; } + +/* Make unselected "look" more like a text box and less like a button */ .nihilo .dijitSelect .dijitButtonContents { padding-top: 1px; background:#fff url("../images/validationInputBg.png") repeat-x top left; @@ -14,11 +16,14 @@ background: transparent none; } .dj_ie .nihilo .dijitSelect .dijitButtonContents { - padding-top: 0px; + padding-top: 0; } + .nihilo .dijitSelect .dijitArrowButton { - padding: 0px 2px; + padding: 0 2px; } + +/* Mirror DropDownButton */ .nihilo .dijitSelectDisabled .dijitButtonNode { border-color: #dedede; background:#fafafa url("../images/buttonDisabled.png") top repeat-x; @@ -26,19 +31,24 @@ .dj_ie .nihilo .dijitSelectDisabled .dijitButtonNode * { filter: gray() alpha(opacity=50); } + .nihilo .dijitSelectHover .dijitButtonNode { color:#000; background:#fcfcfc url("../images/buttonHover.png") repeat-x top left; } + .nihilo .dijitSelectActive .dijitButtonNode, .nihilo .dijitSelectOpened .dijitButtonNode { border-color:#dedede; background: #f5f5f5 url("../images/buttonActive.png") top left repeat-x; } + +/* Make the menu look more combobox-like */ .nihilo .dijitSelectMenu td { - padding: 0em; + padding: 0; } .nihilo .dijitSelectMenu .dijitMenuItemLabel, .nihilo .dijitSelectMenu .dijitMenuArrowCell { padding: 0.1em 0.2em; } + diff --git a/lib/dijit/themes/nihilo/form/Slider.css b/lib/dijit/themes/nihilo/form/Slider.css index 6458e89f0..16bcd0980 100644 --- a/lib/dijit/themes/nihilo/form/Slider.css +++ b/lib/dijit/themes/nihilo/form/Slider.css @@ -1,38 +1,49 @@ +/**** + SLIDER +****/ + .nihilo .dijitSliderProgressBarH { border-color: #aab0bb; background: #c0c2c5 url("../images/sliderFull.png") repeat-x top left; } + .nihilo .dijitSliderProgressBarV { border-color: #aab0bb; background: #c0c2c5 url("../images/sliderFullVertical.png") repeat-y bottom left; } + .nihilo .dijitSliderFocused .dijitSliderProgressBarH, .nihilo .dijitSliderFocused .dijitSliderLeftBumper { background-image:url("../images/sliderFullFocus.png"); } + .nihilo .dijitSliderFocused .dijitSliderProgressBarV, .nihilo .dijitSliderFocused .dijitSliderBottomBumper { background-image:url("../images/sliderFullVerticalFocus.png"); } + .nihilo .dijitSliderRemainingBarV { border-color: #b4b4b4; background: #dcdcdc url("../images/sliderEmptyVertical.png") repeat-y bottom left; } + .nihilo .dijitSliderRemainingBarH { border-color: #b4b4b4; background: #dcdcdc url("../images/sliderEmpty.png") repeat-x top left; } + .nihilo .dijitSliderBar { border-style: solid; outline:1px; - + /* border-color: #b4b4b4; */ } .nihilo .dijitSliderFocused .dijitSliderBar { border-color:#727272; } + .nihilo .dijitSliderImageHandleH { - border:0px; + border:0; width:15px; height:18px; background:url("../images/preciseSliderThumb.png") no-repeat center top; @@ -42,37 +53,44 @@ background-image:url("../images/preciseSliderThumbFocus.png"); #background-image:url("../images/preciseSliderThumbFocus.gif"); } + .nihilo .dijitSliderLeftBumper { border-left-width: 1px; border-color: #aab0bb; background: #c0c2c5 url("../images/sliderFull.png") repeat-x top left; } + .nihilo .dijitSliderRightBumper { background: #dcdcdc url("../images/sliderEmpty.png") repeat-x top left; border-color: #b4b4b4; border-right-width: 1px; } + .nihilo .dijitSliderImageHandleV { - border:0px; + border:0; width:20px; height:15px; background:url("../images/sliderThumb.png") no-repeat center center; #background:url("../images/sliderThumb.gif") no-repeat center center; } + .nihilo .dijitSliderFocused .dijitSliderImageHandleV { background-image:url("../images/sliderThumbFocus.png"); #background-image:url("../images/sliderThumbFocus.gif"); } + .nihilo .dijitSliderBottomBumper { border-bottom-width: 1px; border-color: #aab0bb; background: #c0c2c5 url("../images/sliderFullVertical.png") repeat-y bottom left; } + .nihilo .dijitSliderTopBumper { background: #dcdcdc url("../images/sliderEmptyVertical.png") repeat-y top left; border-color: #b4b4b4; border-top-width: 1px; } + .nihilo .dijitSliderIncrementIconH, .nihilo .dijitSliderIncrementIconV { background:url('../images/spriteRoundedIconsSmall.png') no-repeat -45px top; @@ -83,6 +101,7 @@ background:url('../images/spriteRoundedIconsSmall.png') no-repeat -30px top; #background:url('../images/spriteRoundedIconsSmall.gif') no-repeat -30px top; } + .nihilo .dijitSliderDecrementIconH, .nihilo .dijitSliderDecrementIconV { width:15px; @@ -91,12 +110,14 @@ #background:url('../images/spriteRoundedIconsSmall.gif') no-repeat -15px top; } .nihilo .dijitSliderDecrementIconH { - background:url('../images/spriteRoundedIconsSmall.png') no-repeat 0px top; - #background:url('../images/spriteRoundedIconsSmall.gif') no-repeat 0px top; + background:url('../images/spriteRoundedIconsSmall.png') no-repeat 0 top; + #background:url('../images/spriteRoundedIconsSmall.gif') no-repeat 0 top; } + .nihilo .dijitSliderButtonInner { visibility:hidden; } + .nihilo .dijitSliderReadOnly *, .nihilo .dijitSliderDisabled * { border-color: #d5d5d5 #bdbdbd #bdbdbd #d5d5d5; @@ -104,7 +125,7 @@ } .nihilo .dijitSliderReadOnly .dijitSliderDecrementIconH, .nihilo .dijitSliderDisabled .dijitSliderDecrementIconH { - background-position: 0px -15px; + background-position: 0 -15px; } .nihilo .dijitSliderReadOnly .dijitSliderIncrementIconH, .nihilo .dijitSliderDisabled .dijitSliderIncrementIconH { @@ -117,4 +138,4 @@ .nihilo .dijitSliderReadOnly .dijitSliderIncrementIconV, .nihilo .dijitSliderDisabled .dijitSliderIncrementIconV { background-position: -45px -15px; -} +}
\ No newline at end of file diff --git a/lib/dijit/themes/nihilo/form/Slider_rtl.css b/lib/dijit/themes/nihilo/form/Slider_rtl.css index fc40452de..1523d4a96 100644 --- a/lib/dijit/themes/nihilo/form/Slider_rtl.css +++ b/lib/dijit/themes/nihilo/form/Slider_rtl.css @@ -1,4 +1,6 @@ +/* Slider */ + .dijitRtl .nihilo .dijitSliderProgressBarH, .dijitRtl .nihilo .dijitSliderRemainingBarH, .dijitRtl .nihilo .dijitSliderLeftBumper, @@ -6,23 +8,28 @@ .dijitRtl .nihilo .dijitSliderTopBumper { background-position: top right; } + .dijitRtl .nihilo .dijitSliderProgressBarV, .dijitRtl .nihilo .dijitSliderRemainingBarV, .dijitRtl .nihilo .dijitSliderBottomBumper { background-position: bottom right; } + .dijitRtl .nihilo .dijitSliderLeftBumper { - border-left-width: 0px; + border-left-width: 0; border-right-width: 1px; } + .dijitRtl .nihilo .dijitSliderRightBumper { border-left-width: 1px; - border-right-width: 0px; + border-right-width: 0; } + .dijitRtl .nihilo .dijitSliderIncrementIconH { background:url('../images/spriteRoundedIconsSmall.png') no-repeat left top; #background:url('../images/spriteRoundedIconsSmall.gif') no-repeat left top; } + .dijitRtl .nihilo .dijitSliderDecrementIconH { background:url('../images/spriteRoundedIconsSmall.png') no-repeat -30px top; #background:url('../images/spriteRoundedIconsSmall.gif') no-repeat -30px top; diff --git a/lib/dijit/themes/nihilo/form/TimeTextBox.css b/lib/dijit/themes/nihilo/form/TimeTextBox.css index d450925b4..bf67b66d0 100644 --- a/lib/dijit/themes/nihilo/form/TimeTextBox.css +++ b/lib/dijit/themes/nihilo/form/TimeTextBox.css @@ -1 +1 @@ -@CHARSET "UTF-8"; +@CHARSET "UTF-8";
\ No newline at end of file |