lib/dijit/themes/claro/form/RadioButton.css

   1 /* RadioButton
   2  *
   3  * Styling RadioButton mainly includes:
   4  *
   5  * 1. Containers
   6  *              .dijitRadio|.dijitRadioIcon - for border, padding, width|height and background image
   7  *
   8  * 2. RadioButton within ToggleButton
   9  *              .dijitToggleButton|.dijitToggleButtonChecked .* - for background image
  10  *
  11  * 3. Checked state
  12  *              .dijitRadioChecked - for checked background-color|image
  13  *              .dijitToggleButtonChecked - for border, background-color|image, display and width|height
  14  *
  15  * 4. Hover state
  16  *              .dijitRadioHover|.dijitRadioCheckedHover - for background image
  17  *
  18  * 5. Disabled state
  19  *              .dijitRadioDisabled|.dijitRadioCheckedDisabled - for background image
  20  */
  21 .claro .dijitToggleButton .dijitRadio, .claro .dijitToggleButton .dijitRadioIcon {
  22   background-image: url("../form/images/checkboxRadioButtonStates.png");
  23 }
  24 .dj_ie6 .claro .dijitToggleButton .dijitRadio, .dj_ie6 .claro .dijitToggleButton .dijitRadioIcon {
  25   background-image: url("../form/images/checkboxAndRadioButtons_IE6.png");
  26 }
  27 .claro .dijitRadio, .claro .dijitRadioIcon {
  28   /* inside a toggle button */
  29
  30   background-image: url("../form/images/checkboxRadioButtonStates.png");
  31   /* checkbox sprite image */
  32
  33   background-repeat: no-repeat;
  34   width: 15px;
  35   height: 15px;
  36   margin: 0 2px 0 0;
  37   padding: 0;
  38 }
  39 .dj_ie6 .claro .dijitRadio, .dj_ie6 .claro .dijitRadioIcon {
  40   /* inside a toggle button */
  41
  42   background-image: url("../form/images/checkboxAndRadioButtons_IE6.png");
  43   /* checkbox sprite image */
  44
  45 }
  46 .claro .dijitRadio {
  47   /* unselected */
  48
  49   background-position: -105px;
  50 }
  51 .claro .dijitToggleButton .dijitRadioIcon {
  52   /* unselected */
  53
  54   background-position: -107px;
  55 }
  56 .claro .dijitRadioDisabled {
  57   /* unselected and disabled */
  58
  59   background-position: -165px;
  60 }
  61 .claro .dijitRadioHover {
  62   /* hovering over an unselected enabled radio button */
  63
  64   background-position: -135px;
  65 }
  66 .claro .dijitRadioChecked {
  67   background-position: -90px;
  68 }
  69 .claro .dijitToggleButtonChecked .dijitRadioIcon {
  70   background-position: -92px;
  71 }
  72 .claro .dijitRadioCheckedHover {
  73   background-position: -120px;
  74 }
  75 .claro .dijitRadioCheckedDisabled {
  76   /* selected but disabled */
  77
  78   background-position: -150px;
  79 }