diff options
Diffstat (limited to 'js/dojo-1.6/dijit/themes/claro/form/Common.css')
| -rw-r--r-- | js/dojo-1.6/dijit/themes/claro/form/Common.css | 155 |
1 files changed, 155 insertions, 0 deletions
diff --git a/js/dojo-1.6/dijit/themes/claro/form/Common.css b/js/dojo-1.6/dijit/themes/claro/form/Common.css new file mode 100644 index 0000000..1bad6ee --- /dev/null +++ b/js/dojo-1.6/dijit/themes/claro/form/Common.css @@ -0,0 +1,155 @@ +/* claro/form/Common.css */ +/*========================= common css =========================*/ +/* 'dijitTextBox' refers to 'dijit(TextBox|DateTextBox|CurrencyTextBox|...)' */ +.claro .dijitTextBoxError .dijitValidationContainer { + background-color: #d46464; + background-image: url('images/error.png'); + background-position: top center; + border: solid #d46464 0; + border-left-width: 1px; + width: 9px; +} +.claro .dijitTextBoxError .dijitValidationIcon { + width: 0; + background-color: transparent !important; + /* so the INPUT doesn't obscure the border in rtl+a11y */ + +} +/* Padding for the input area of TextBox based widgets, and corresponding padding for the + * down arrow button and the placeholder. placeholder is explicitly listed because + * dijitPlaceHolder is absolutely positioned, so padding set on dijitInputField + * won't affect it + */ +.claro .dijitTextArea, .claro .dijitInputField .dijitPlaceHolder { + padding: 2px; +} +.claro .dijitTextBox .dijitInputField { + padding: 1px 2px; +} +.dj_gecko .claro .dijitTextBox .dijitInputInner, .dj_webkit .claro .dijitTextBox .dijitInputInner { + padding: 1px; +} +.claro .dijitTextBox, .claro .dijitTextBox .dijitButtonNode { + /* color for (outer) border on *TextBox widgets, and border between input and buttons on ComboBox and Spinner */ + + border-color: #b5bcc7; + -webkit-transition-property: background-color, border; + -webkit-transition-duration: .35s; +} +.claro .dijitTextBox { + background-color: #ffffff; +} +/* hover */ +.claro .dijitTextBoxHover, .claro .dijitTextBoxHover .dijitButtonNode { + border-color: #769dc0; + -webkit-transition-duration: .25s; +} +.claro .dijitTextBoxHover { + background-color: #e9f4fe; + background-image: url('images/textBox_back.png'); + background-repeat: repeat-x; +} +/* error state */ +.claro .dijitTextBoxError, .claro .dijitTextBoxError .dijitButtonNode { + border-color: #d46464; +} +.claro .dijitTextBoxError, .claro .dijitTextBoxError .dijitInputContainer { + background-color: #ffffff; +} +/* focused state */ +.claro .dijitTextBoxFocused, .claro .dijitTextBoxFocused .dijitButtonNode { + border-color: #769dc0; + -webkit-transition-duration: .1s; +} +.claro .dijitTextBoxFocused { + background-color: #ffffff; + background-image: url('images/textBox_back.png'); + background-repeat: repeat-x; +} +.claro .dijitTextBoxFocused .dijitInputContainer { + background: #ffffff; +} +.claro .dijitTextBoxErrorFocused, .claro .dijitTextBoxErrorFocused .dijitButtonNode { + border-color: #ce4f4f; +} +/* disabled state */ +.claro .dijitTextBoxDisabled, .claro .dijitTextBoxDisabled .dijitButtonNode { + border-color: #d3d3d3; +} +.claro .dijitTextBoxDisabled, .claro .dijitTextBoxDisabled .dijitInputContainer { + background-color: #efefef; + background-image: none; + color: #818181; +} +/*========================= for special widgets =========================*/ +/* Input boxes with an arrow (for a drop down) */ +.claro .dijitComboBox .dijitArrowButtonInner { + background-image: url("images/commonFormArrows.png"); + background-position: -35px 53%; + background-repeat: no-repeat; + margin: 0; + width: 16px; + border: 1px solid #ffffff; +} +.claro .dijitToolbar .dijitComboBox .dijitArrowButtonInner { + border: none; +} +.claro .dijitToolbar .dijitComboBox .dijitArrowButtonInner { + border: none; +} +/* Add 1px vertical padding to the <input> where user types and the validation icon, + to match the 1px border on arrow button */ +.claro .dijitTextBox .dijitInputInner, .claro .dijitTextBox .dijitValidationContainer { + padding: 1px 0; +} +.claro .dijitComboBox .dijitButtonNode { + background-color: #efefef; + background-image: url("images/formHighlight.png"); + background-repeat: repeat-x; +} +/* Arrow "hover" effect: + * The arrow button should change color whenever the mouse is in a position such that clicking it + * will toggle the drop down. That's either (1) anywhere over the ComboBox or (2) over the arrow + * button, depending on the openOnClick setting for the widget. + */ +.claro .dijitComboBoxOpenOnClickHover .dijitButtonNode, .claro .dijitComboBox .dijitDownArrowButtonHover { + background-color: #abd6ff; +} +.claro .dijitComboBoxOpenOnClickHover .dijitArrowButtonInner, .claro .dijitComboBox .dijitDownArrowButtonHover .dijitArrowButtonInner { + background-position: -70px 53%; +} +/* Arrow Button change when drop down is open */ +.claro .dijitComboBox .dijitHasDropDownOpen { + background-color: #7dbefa; + background-position: 0 -177px; + padding: 1px; +} +.claro .dijitComboBox .dijitHasDropDownOpen .dijitArrowButtonInner { + background-position: -70px 53%; + border: 0 none; +} +/* disabled state */ +.claro div.dijitComboBoxDisabled .dijitArrowButtonInner { + /* specific selector set to override background-position setting from Button.js + * (.claro .dijitComboBoxDisabled .dijitArrowButtonInner) */ + + background-position: 0 50%; + background-color: #efefef; +} +/*========================= hacks for browsers =========================*/ +/* it seems the input[type="hidden"] has a height (16px) too... this may cause the widget's height calculate error */ +.dj_ff3 .claro .dijitInputField input[type="hidden"] { + display: none; + height: 0; + width: 0; +} +/* ie6 doesn't support transparent background img */ +.dj_ie6 .claro .dijitTextBox, .dj_ie6 .claro .dijitComboBox .dijitButtonNode { + background-image: none; +} +.dj_borderbox .claro .dijitComboBox .dijitHasDropDownOpen .dijitArrowButtonInner { + width: 18px; +} +.dj_borderbox .claro .dijitComboBoxFocused .dijitHasDropDownOpen .dijitArrowButtonInner { + width: 16px; +} |
