summaryrefslogtreecommitdiff
path: root/lib/dijit/themes/tundra/form
diff options
context:
space:
mode:
Diffstat (limited to 'lib/dijit/themes/tundra/form')
-rw-r--r--lib/dijit/themes/tundra/form/Button.css40
-rw-r--r--lib/dijit/themes/tundra/form/Checkbox.css31
-rw-r--r--lib/dijit/themes/tundra/form/Common.css40
-rw-r--r--lib/dijit/themes/tundra/form/RadioButton.css28
-rw-r--r--lib/dijit/themes/tundra/form/Select.css18
-rw-r--r--lib/dijit/themes/tundra/form/Slider.css40
-rw-r--r--lib/dijit/themes/tundra/form/Slider_rtl.css13
7 files changed, 153 insertions, 57 deletions
diff --git a/lib/dijit/themes/tundra/form/Button.css b/lib/dijit/themes/tundra/form/Button.css
index d9d103fc1..2c68aef04 100644
--- a/lib/dijit/themes/tundra/form/Button.css
+++ b/lib/dijit/themes/tundra/form/Button.css
@@ -1,6 +1,14 @@
+/*****
+ 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)
+ *****/
+
.tundra .dijitButtonNode {
-
+ /* enabled state - inner */
border: 1px solid #c0c0c0;
border-bottom: 1px solid #9b9b9b;
padding: 0.1em 0.2em 0.2em 0.2em;
@@ -10,15 +18,19 @@
text-align: center;
padding: 0 0.3em;
}
+
.tundra .dijitDisabled .dijitButtonText {
color: #7F7F7F;
}
+
.tundra .dijitArrowButton {
color: #111;
}
+
.tundra .dijitComboButton .dijitDownArrowButton {
padding-right:4px;
}
+
.tundra .dijitTextBoxReadOnly,
.tundra .dijitTextBoxReadOnly .dijitButtonNode,
.tundra .dijitButtonDisabled .dijitButtonNode,
@@ -27,18 +39,19 @@
.tundra .dijitComboButtonDisabled .dijitButtonNode,
.tundra .dijitTextBoxDisabled,
.tundra .dijitTextBoxDisabled .dijitButtonNode {
-
+ /* disabled state - inner */
border-color: #d5d5d5 #d5d5d5 #bdbdbd #d5d5d5;
background:#e4e4e4 url("../images/buttonDisabled.png") top repeat-x;
}
+
.tundra .dijitButtonHover .dijitButtonNode,
.tundra .dijitButtonNodeHover,
.tundra .dijitToggleButtonHover .dijitButtonNode,
.tundra .dijitDropDownButtonHover .dijitButtonNode,
.tundra .dijitComboButton .dijitButtonContentsHover,
.tundra .dijitComboButton .dijitDownArrowButtonHover {
-
-
+ /* hover state - inner */
+ /* TODO: change from Hover to Selected so that button is still highlighted while drop down is being used */
border-color: #a5beda;
border-bottom-color:#5c7590;
color:#243C5F;
@@ -46,10 +59,11 @@
}
.tundra .dijitDownArrowButtonHover,
.tundra .dijitUpArrowButtonHover {
-
+ /* same as above except don't adjust border color (it's controlled by the containing Spinner/ComboBox) */
color:#243C5F;
background:#fcfdff url("../images/buttonHover.png") repeat-x bottom;
}
+
.tundra .dijitUpArrowButtonActive,
.tundra .dijitDownArrowButtonActive,
.tundra .dijitButtonActive .dijitButtonNode,
@@ -57,15 +71,18 @@
.tundra .dijitDropDownButtonActive .dijitButtonNode,
.tundra .dijitButtonContentsActive,
.tundra .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:#366dba;
background: #ededed url("../images/buttonActive.png") bottom repeat-x;
}
+
.tundra .dijitArrowButtonInner {
- background:url("../images/spriteArrows.png") no-repeat scroll 0px center;
+ background:url("../images/spriteArrows.png") no-repeat scroll 0 center;
width: 7px;
height: 7px;
- margin: 0px 4px 0px 4px;
+ margin: 0 4px 0 4px;
}
.tundra .dijitTextBox .dijitArrowButtonInner {
background-position: 0 center;
@@ -82,6 +99,7 @@
.tundra .dijitUpArrowButton .dijitArrowButtonInner {
background-position: -21px center;
}
+
.tundra .dijitDisabled .dijitArrowButtonInner {
background-position: -28px center;
}
@@ -95,13 +113,13 @@
background-position: -49px center;
}
.dj_webkit .tundra .dijitSpinner .dijitUpArrowButton .dijitArrowButtonInner {
- margin-top: -1px;
+ margin-top: -1px; /* image has too many blank pixels on top */
}
.dj_ie .tundra .dijitSpinner .dijitDownArrowButton .dijitArrowButtonInner {
- margin-top: -2px;
+ margin-top: -2px; /* image has too many blank pixels on top */
}
.dj_ie8 .tundra .dijitSpinner .dijitDownArrowButton .dijitArrowButtonInner {
- margin-top: -1px;
+ margin-top: -1px; /* image has too many blank pixels on top */
}
.tundra .dijitSpinnerButtonContainer {
width: auto;
diff --git a/lib/dijit/themes/tundra/form/Checkbox.css b/lib/dijit/themes/tundra/form/Checkbox.css
index e7ff2f945..28a7d79c9 100644
--- a/lib/dijit/themes/tundra/form/Checkbox.css
+++ b/lib/dijit/themes/tundra/form/Checkbox.css
@@ -1,45 +1,54 @@
.tundra .dijitToggleButton .dijitCheckBoxIcon {
background-image: url('../images/checkmarkNoBorder.png');
}
+
.dj_ie6 .tundra .dijitToggleButton .dijitCheckBoxIcon {
background-image: url('../images/checkmarkNoBorder.gif');
}
+
.tundra .dijitCheckBox,
-.tundra .dijitCheckBoxIcon {
- background-image: url('../images/checkmark.png');
+.tundra .dijitCheckBoxIcon /* inside a toggle button */ {
+ background-image: url('../images/checkmark.png'); /* checkbox sprite image */
background-repeat: no-repeat;
width: 16px;
height: 16px;
margin: 0 2px 0 0;
padding: 0;
}
+
.dj_ie6 .tundra .dijitCheckBox,
-.dj_ie6 .tundra .dijitCheckBoxIcon {
- background-image: url('../images/checkmark.gif');
+.dj_ie6 .tundra .dijitCheckBoxIcon /* inside a toggle button */ {
+ background-image: url('../images/checkmark.gif'); /* checkbox sprite image */
}
+
.tundra .dijitCheckBox,
.tundra .dijitToggleButton .dijitCheckBoxIcon {
-
+ /* unchecked */
background-position: -16px;
}
+
.tundra .dijitCheckBoxChecked,
.tundra .dijitToggleButtonChecked .dijitCheckBoxIcon {
-
- background-position: 0px;
+ /* checked */
+ background-position: 0;
}
+
.tundra .dijitCheckBoxDisabled {
-
+ /* disabled */
background-position: -48px;
}
+
.tundra .dijitCheckBoxCheckedDisabled {
-
+ /* disabled but checked */
background-position: -32px;
}
+
.tundra .dijitCheckBoxHover {
-
+ /* hovering over an unchecked enabled checkbox */
background-position: -80px;
}
+
.tundra .dijitCheckBoxCheckedHover {
-
+ /* hovering over a checked enabled checkbox */
background-position: -64px;
}
diff --git a/lib/dijit/themes/tundra/form/Common.css b/lib/dijit/themes/tundra/form/Common.css
index 999eb22ee..201368639 100644
--- a/lib/dijit/themes/tundra/form/Common.css
+++ b/lib/dijit/themes/tundra/form/Common.css
@@ -1,48 +1,76 @@
+/****
+ 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)
+ ****/
+
.tundra .dijitInputContainer INPUT,
.tundra .dijitTextBox {
- margin: 0em 0.1em;
+ margin: 0 0.1em;
}
+
.tundra .dijitTextArea {
padding: 3px;
}
+
.tundra .dijitTextBox {
-
+ /* For all except dijit.form.NumberSpinner: the actual input element.
+ For TextBox, ComboBox, Spinner: the div 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 #b3b3b3;
}
+
+/* ComboBox specific rules*/
.tundra .dijitComboBox .dijitButtonNode {
padding: 0 0.2em;
}
.tundra .dijitTextBox .dijitButtonNode {
-
+ /* line between the input area and the drop down button, and also between
+ * the up and down buttons of a spinner
+ */
border-color: #9b9b9b;
}
+
.tundra .dijitTextBoxFocused {
-
+ /* input field when focused (ie: typing affects it) */
border-color:#406b9b;
}
.tundra .dijitTextBoxFocused .dijitButtonNode {
border-color:#366dba;
}
+
.tundra .dijitError {
background-color:#f9f7ba;
background-image:none;
}
+
.tundra .dijitErrorFocused {
background-color:#f9f999;
background-image:none;
}
+
+/* Validation errors */
.tundra .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. */
.tundra .dijitComboBoxHighlightMatch {
background-color:#a5beda;
}
+
.tundra .dijitFocusedLabel {
-
+ /* for checkboxes or radio buttons, hatch border around the corresponding label, to indicate focus */
outline: 1px dotted #666666;
}
diff --git a/lib/dijit/themes/tundra/form/RadioButton.css b/lib/dijit/themes/tundra/form/RadioButton.css
index 3044d0edb..4dfc0fa6d 100644
--- a/lib/dijit/themes/tundra/form/RadioButton.css
+++ b/lib/dijit/themes/tundra/form/RadioButton.css
@@ -1,7 +1,7 @@
-.tundra .dijitRadio,
-.tundra .dijitRadioIcon {
- background-image: url('../images/checkmark.png');
+.tundra .dijitRadio, /* stand alone */
+.tundra .dijitRadioIcon { /* inside a toggle button */
+ background-image: url('../images/checkmark.png'); /* checkbox sprite image */
background-repeat: no-repeat;
width: 16px;
height: 16px;
@@ -10,35 +10,43 @@
}
.dj_ie6 .tundra .dijitRadio,
.dj_ie6 .tundra .dijitRadioIcon {
- background-image: url('../images/checkmark.gif');
+ background-image: url('../images/checkmark.gif'); /* checkbox sprite image */
}
+
.tundra .dijitToggleButton .dijitRadioIcon {
-
+ /* for checkbox in a toggle button, override above setting to have no border */
background-image: url('../images/checkmarkNoBorder.png');
}
.dj_ie6 .tundra .dijitToggleButton .dijitRadioIcon {
background-image: url('../images/checkmarkNoBorder.gif');
}
+
.tundra .dijitRadio,
.tundra .dijitRadioIcon {
-
+ /* unselected */
background-position: -112px;
}
+
.tundra .dijitRadioDisabled {
-
+ /* unselected and disabled */
background-position: -144px;
}
+
.tundra .dijitRadioHover {
-
+ /* hovering over an unselected enabled radio button */
background-position: -176px;
}
+
.tundra .dijitRadioChecked,
.tundra .dijitRadioCheckedHover,
.tundra .dijitToggleButtonChecked .dijitRadioIcon {
-
+ /* selected. Since clicking a selected radio button doesn't change anything, there's
+ * no hover effect on selected radio buttons.
+ */
background-position: -96px;
}
+
.tundra .dijitRadioCheckedDisabled {
-
+ /* selected but disabled */
background-position: -128px;
}
diff --git a/lib/dijit/themes/tundra/form/Select.css b/lib/dijit/themes/tundra/form/Select.css
index 072b1204a..b0290167a 100644
--- a/lib/dijit/themes/tundra/form/Select.css
+++ b/lib/dijit/themes/tundra/form/Select.css
@@ -1,9 +1,11 @@
.tundra .dijitSelect .dijitButtonNode {
- padding: 0px;
+ padding: 0;
}
.tundra .dijitSelect .dijitButtonNode .dijitArrowButtonInner {
- margin: 0px 4px 0px 5px;
+ margin: 0 4px 0 5px;
}
+
+/* Make unselected content portion "look" more like a text box and less like a button */
.tundra .dijitSelect .dijitButtonContents {
padding-top: 1px;
background:#fff url("../images/validationInputBg.png") repeat-x top left;
@@ -17,8 +19,10 @@
background: transparent none;
}
.dj_ie .tundra .dijitSelect .dijitButtonContents {
- padding-top: 0px;
+ padding-top: 0;
}
+
+/* Mirror DropDownButton */
.tundra .dijitSelectDisabled .dijitButtonNode {
border-color: #d5d5d5 #bdbdbd #bdbdbd #d5d5d5;
background:#e4e4e4 url("../images/buttonDisabled.png") top repeat-x;
@@ -26,6 +30,7 @@
.dj_ie .tundra .dijitSelectDisabled .dijitButtonNode * {
filter: gray() alpha(opacity=50);
}
+
.tundra .dijitSelectHover .dijitButtonNode {
border-color:#a5beda;
border-bottom-color:#5c7590;
@@ -33,15 +38,20 @@
color:#243C5F;
background:#fcfdff url("../images/buttonHover.png") repeat-x bottom;
}
+
.tundra .dijitSelectActive .dijitButtonNode,
.tundra .dijitSelectOpened .dijitButtonNode {
border-color:#366dba;
background: #ededed url("../images/buttonActive.png") bottom repeat-x;
}
+
+/* Make the menu look more combobox-like */
.tundra .dijitSelectMenu td {
- padding: 0em;
+ padding: 0;
}
.tundra .dijitSelectMenu .dijitMenuItemLabel,
.tundra .dijitSelectMenu .dijitMenuArrowCell {
padding: 0.1em 0.2em;
}
+
+
diff --git a/lib/dijit/themes/tundra/form/Slider.css b/lib/dijit/themes/tundra/form/Slider.css
index b2c2b69f8..7465e8377 100644
--- a/lib/dijit/themes/tundra/form/Slider.css
+++ b/lib/dijit/themes/tundra/form/Slider.css
@@ -2,26 +2,32 @@
border-color: #aab0bb;
background: #c0c2c5 url("../images/sliderFull.png") repeat-x top left;
}
+
.tundra .dijitSliderProgressBarV {
border-color: #aab0bb;
background: #c0c2c5 url("../images/sliderFullVertical.png") repeat-y bottom left;
}
+
.tundra .dijitSliderFocused .dijitSliderProgressBarH,
.tundra .dijitSliderFocused .dijitSliderLeftBumper {
background-image:url("../images/sliderFullFocus.png");
}
+
.tundra .dijitSliderFocused .dijitSliderProgressBarV,
.tundra .dijitSliderFocused .dijitSliderBottomBumper {
background-image:url("../images/sliderFullVerticalFocus.png");
}
+
.tundra .dijitSliderRemainingBarV {
border-color: #b4b4b4;
background: #dcdcdc url("../images/sliderEmptyVertical.png") repeat-y bottom left;
}
+
.tundra .dijitSliderRemainingBarH {
border-color: #b4b4b4;
background: #dcdcdc url("../images/sliderEmpty.png") repeat-x top left;
}
+
.tundra .dijitSliderBar {
border-style: solid;
outline:1px;
@@ -29,8 +35,9 @@
.tundra .dijitSliderFocused .dijitSliderBar {
border-color:#888;
}
+
.tundra .dijitSliderImageHandleH {
- border:0px;
+ border:0;
width:16px;
height:16px;
background:url("../images/preciseSliderThumb.png") no-repeat center top;
@@ -39,41 +46,49 @@
background-image:url("../images/preciseSliderThumbFocus.png");
#background-image:url("../images/preciseSliderThumbFocus.gif");
}
+
.dj_ie6 .tundra .dijitSliderImageHandleH {
background-image:url("../images/preciseSliderThumb.gif");
}
+
.tundra .dijitSliderLeftBumper {
border-left-width: 1px;
border-color: #aab0bb;
background: #c0c2c5 url("../images/sliderFull.png") repeat-x top left;
}
+
.tundra .dijitSliderRightBumper {
background: #dcdcdc url("../images/sliderEmpty.png") repeat-x top left;
border-color: #b4b4b4;
border-right-width: 1px;
}
+
.tundra .dijitSliderImageHandleV {
- border:0px;
+ border:0;
width:16px;
height:16px;
background:url("../images/sliderThumb.png") no-repeat center center;
}
+
.tundra .dijitSliderFocused .dijitSliderImageHandleV {
background-image:url("../images/sliderThumbFocus.png");
}
.dj_ie6 .tundra .dijitSliderFocused .dijitSliderImageHandleV {
background-image:url("../images/sliderThumbFocus.gif");
}
+
.tundra .dijitSliderBottomBumper {
border-bottom-width: 1px;
border-color: #aab0bb;
background: #c0c2c5 url("../images/sliderFullVertical.png") repeat-y bottom left;
}
+
.tundra .dijitSliderTopBumper {
background: #dcdcdc url("../images/sliderEmptyVertical.png") repeat-y top left;
border-color: #b4b4b4;
border-top-width: 1px;
}
+
.tundra .dijitSliderDecrementIconH,
.tundra .dijitSliderDecrementIconV,
.tundra .dijitSliderIncrementIconH,
@@ -91,21 +106,24 @@
.dj_ie6 .tundra .dijitSliderIncrementIconV {
background-image: url('../images/spriteArrows.gif');
}
+
.tundra .dijitSliderDecrementIconH {
- background-position: -7px 0px;
+ background-position: -7px 0;
}
.tundra .dijitSliderIncrementIconH {
- background-position: -14px 0px;
+ background-position: -14px 0;
}
.tundra .dijitSliderDecrementIconV {
- background-position: 0px 0px;
+ background-position: 0 0;
}
.tundra .dijitSliderIncrementIconV {
- background-position: -21px 0px;
+ background-position: -21px 0;
}
+
.tundra .dijitSliderButtonInner {
visibility:hidden;
}
+
.tundra .dijitSliderReadOnly *,
.tundra .dijitSliderDisabled * {
border-color: #d5d5d5 #bdbdbd #bdbdbd #d5d5d5;
@@ -113,17 +131,17 @@
}
.tundra .dijitSliderReadOnly .dijitSliderDecrementIconH,
.tundra .dijitSliderDisabled .dijitSliderDecrementIconH {
- background-position: -35px 0px;
+ background-position: -35px 0;
}
.tundra .dijitSliderReadOnly .dijitSliderIncrementIconH,
.tundra .dijitSliderDisabled .dijitSliderIncrementIconH {
- background-position: -42px 0px;
+ background-position: -42px 0;
}
.tundra .dijitSliderReadOnly .dijitSliderDecrementIconV,
.tundra .dijitSliderDisabled .dijitSliderDecrementIconV {
- background-position: -28px 0px;
+ background-position: -28px 0;
}
.tundra .dijitSliderReadOnly .dijitSliderIncrementIconV,
.tundra .dijitSliderDisabled .dijitSliderIncrementIconV {
- background-position: -49px 0px;
-}
+ background-position: -49px 0;
+} \ No newline at end of file
diff --git a/lib/dijit/themes/tundra/form/Slider_rtl.css b/lib/dijit/themes/tundra/form/Slider_rtl.css
index 979eed651..9375c4ecb 100644
--- a/lib/dijit/themes/tundra/form/Slider_rtl.css
+++ b/lib/dijit/themes/tundra/form/Slider_rtl.css
@@ -5,22 +5,27 @@
.tundra .dijitSliderRtl .dijitSliderTopBumper {
background-position: top right;
}
+
.tundra .dijitSliderRtl .dijitSliderProgressBarV,
.tundra .dijitSliderRtl .dijitSliderRemainingBarV,
.tundra .dijitSliderRtl .dijitSliderBottomBumper {
background-position: bottom right;
}
+
.tundra .dijitSliderRtl .dijitSliderLeftBumper {
- border-left-width: 0px;
+ border-left-width: 0;
border-right-width: 1px;
}
+
.tundra .dijitSliderRtl .dijitSliderRightBumper {
border-left-width: 1px;
- border-right-width: 0px;
+ border-right-width: 0;
}
+
.tundra .dijitSliderRtl .dijitSliderIncrementIconH {
- background-position: -7px 0px;
+ background-position: -7px 0;
}
+
.tundra .dijitSliderRtl .dijitSliderDecrementIconH {
- background-position: -14px 0px;
+ background-position: -14px 0;
}