/* * 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 */ .soria .dijitToggleButton .dijitCheckBox, .soria .dijitToggleButton .dijitCheckBoxIcon { background-image: url('../images/spriteCheckbox.gif'); } .soria .dijitCheckBox, .soria .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; } .soria .dijitCheckBox, .soria .dijitToggleButton .dijitCheckBoxIcon { /* unchecked */ background-position: -16px; } .soria .dijitCheckBoxChecked, .soria .dijitToggleButtonChecked .dijitCheckBoxIcon { /* checked */ background-position: 0; } .soria .dijitCheckBoxDisabled { /* disabled */ background-position: -48px; } .soria .dijitCheckBoxCheckedDisabled { /* disabled but checked */ background-position: -32px; } .soria .dijitCheckBoxHover { /* hovering over an unchecked enabled checkbox */ background-position: -80px; } .soria .dijitCheckBoxCheckedHover { /* hovering over a checked enabled checkbox */ background-position: -64px; }