dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
132 lines (109 loc) • 3.16 kB
CSS
/* TriStateCheckBox
*
* Styling TriStateCheckBox mainly includes:
*
* 1. Containers
* .dojoxTriStateCheckBox|.dojoxTriStateCheckBoxIcon - for border, padding, width|height and background image
*
* 2. Checked state
* .dojoxTriStateCheckBoxChecked - for checked background-color|image
* .dojoxTriStateCheckBoxMixed - for mixed background-color|image
*
* 3. Hover state
* .dojoxTriStateCheckBoxHover|.dojoxTriStateCheckBoxCheckedHover|.dojoxTriStateCheckBoxMixedHover - for background image
*
* 4. Disabled state
* .dojoxTriStateCheckBoxDisabled|.dojoxTriStateCheckBoxCheckedDisabled|.dojoxTriStateCheckBoxMixedDisabled - for background image
*/
.claro .dojoxTriStateCheckBox, .claro .dojoxTriStateCheckBoxIcon {
background-image: url('images/tristatecheckboxStates.png');
/* checkbox sprite image */
background-repeat: no-repeat;
width: 15px;
height: 16px;
margin: 0 2px 0 0;
padding: 0;
}
.dj_ie6 .claro .dojoxTriStateCheckBox, .dj_ie6 .claro .dojoxTriStateCheckBoxIcon {
background-image: url('images/tristatecheckboxStates.png');
/* checkbox sprite image */
}
.claro .dojoxTriStateCheckBox{
/* unchecked */
background-position: -15px;
}
.claro .dojoxTriStateCheckBoxChecked{
/* checked */
background-position: 0px;
}
.claro .dojoxTriStateCheckBoxMixed {
/* mixed */
background-position: -30px;
}
.claro .dojoxTriStateCheckBoxDisabled {
/* disabled and unchecked */
background-position: -105px;
}
.claro .dojoxTriStateCheckBoxCheckedDisabled {
/* disabled and checked */
background-position: -90px;
}
.claro .dojoxTriStateCheckBoxMixedDisabled {
/* disabled and mixed */
background-position: -120px;
}
.claro .dojoxTriStateCheckBoxHover {
/* hovering over and unchecked */
background-position: -60px;
}
.claro .dojoxTriStateCheckBoxCheckedHover {
/* hovering over and checked */
background-position: -45px;
}
.claro .dojoxTriStateCheckBoxMixedHover {
/* hovering over and mixed */
background-position: -75px;
}
.dijit_a11y .dojoxTriStateCheckBoxHover .dojoxTriStateCheckBoxInner,
.dijit_a11y .dojoxTriStateCheckBoxFocused .dojoxTriStateCheckBoxInner{
/* focused or hovering over */
border: dashed;
}
.dijit_a11y .dojoxTriStateCheckBoxHover .dojoxTriStateCheckBoxInner,
.dijit_a11y .dojoxTriStateCheckBoxFocused .dojoxTriStateCheckBoxInner{
/* focused or hovering over */
border: solid;
}
.dijit_a11y .dojoxTriStateCheckBoxDisabled .dojoxTriStateCheckBoxInner{
/* focused or hovering over */
opacity: 0.5;
}
.dj_ie .dijit_a11y .dojoxTriStateCheckBoxDisabled .dojoxTriStateCheckBoxInner{
/* disabled */
}
.dojoxTriStateCheckBoxInner{
/* inner text */
visibility: hidden;
display: none;
position: absolute;
text-align: center;
}
.dijit_a11y .dojoxTriStateCheckBoxInner{
/* inner text */
visibility: visible;
display: block;
}
.dojoxTriStateCheckBoxInput {
/* place the actual input on top, but all-but-invisible */
opacity: 0.01;
padding: 0;
margin: 0,
border: 0;
width: 15px;
height: 16px;
background-position:center center;
background-repeat:no-repeat;
}
.dj_ie .dojoxTriStateCheckBoxInput {
filter: alpha(opacity=0);
}