TriStateCheckBox.css 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. /* TriStateCheckBox
  2. *
  3. * Styling TriStateCheckBox mainly includes:
  4. *
  5. * 1. Containers
  6. * .dojoxTriStateCheckBox|.dojoxTriStateCheckBoxIcon - for border, padding, width|height and background image
  7. *
  8. * 2. Checked state
  9. * .dojoxTriStateCheckBoxChecked - for checked background-color|image
  10. * .dojoxTriStateCheckBoxMixed - for mixed background-color|image
  11. *
  12. * 3. Hover state
  13. * .dojoxTriStateCheckBoxHover|.dojoxTriStateCheckBoxCheckedHover|.dojoxTriStateCheckBoxMixedHover - for background image
  14. *
  15. * 4. Disabled state
  16. * .dojoxTriStateCheckBoxDisabled|.dojoxTriStateCheckBoxCheckedDisabled|.dojoxTriStateCheckBoxMixedDisabled - for background image
  17. */
  18. .claro .dijitToggleButton .dojoxTriStateCheckBoxIcon {
  19. background-image: url('../images/checkmarkNoBorder.png');
  20. }
  21. .dj_ie6 .claro .dijitToggleButton .dojoxTriStateCheckBoxIcon {
  22. background-image: url('../images/checkmarkNoBorder.gif');
  23. }
  24. .claro .dojoxTriStateCheckBox, .claro .dojoxTriStateCheckBoxIcon {
  25. background-image: url('images/tristatecheckboxStates.png');
  26. /* checkbox sprite image */
  27. background-repeat: no-repeat;
  28. width: 15px;
  29. height: 16px;
  30. margin: 0 2px 0 0;
  31. padding: 0;
  32. }
  33. .dj_ie6 .claro .dojoxTriStateCheckBox, .dj_ie6 .claro .dojoxTriStateCheckBoxIcon {
  34. background-image: url('images/tristatecheckboxStates.png');
  35. /* checkbox sprite image */
  36. }
  37. .claro .dojoxTriStateCheckBox{
  38. /* unchecked */
  39. background-position: -15px;
  40. }
  41. .claro .dojoxTriStateCheckBoxChecked{
  42. /* checked */
  43. background-position: 0px;
  44. }
  45. .claro .dojoxTriStateCheckBoxMixed {
  46. /* mixed */
  47. background-position: -30px;
  48. }
  49. .claro .dojoxTriStateCheckBoxDisabled {
  50. /* disabled and unchecked */
  51. background-position: -105px;
  52. }
  53. .claro .dojoxTriStateCheckBoxCheckedDisabled {
  54. /* disabled and checked */
  55. background-position: -90px;
  56. }
  57. .claro .dojoxTriStateCheckBoxMixedDisabled {
  58. /* disabled and mixed */
  59. background-position: -120px;
  60. }
  61. .claro .dojoxTriStateCheckBoxHover {
  62. /* hovering over and unchecked */
  63. background-position: -60px;
  64. }
  65. .claro .dojoxTriStateCheckBoxCheckedHover {
  66. /* hovering over and checked */
  67. background-position: -45px;
  68. }
  69. .claro .dojoxTriStateCheckBoxMixedHover {
  70. /* hovering over and mixed */
  71. background-position: -75px;
  72. }
  73. .dijit_a11y .dojoxTriStateCheckBoxHover .dojoxTriStateCheckBoxInner,
  74. .dijit_a11y .dojoxTriStateCheckBoxFocused .dojoxTriStateCheckBoxInner{
  75. /* focused or hovering over */
  76. border: dashed;
  77. }
  78. .dijit_a11y .dojoxTriStateCheckBoxHover .dojoxTriStateCheckBoxInner,
  79. .dijit_a11y .dojoxTriStateCheckBoxFocused .dojoxTriStateCheckBoxInner{
  80. /* focused or hovering over */
  81. border: solid;
  82. }
  83. .dijit_a11y .dojoxTriStateCheckBoxDisabled .dojoxTriStateCheckBoxInner{
  84. /* focused or hovering over */
  85. opacity: 0.5;
  86. }
  87. .dj_ie .dijit_a11y .dojoxTriStateCheckBoxDisabled .dojoxTriStateCheckBoxInner{
  88. /* disabled */
  89. }
  90. .dojoxTriStateCheckBoxInner{
  91. /* inner text */
  92. visibility: hidden;
  93. display: none;
  94. position: absolute;
  95. text-align: center;
  96. }
  97. .dijit_a11y .dojoxTriStateCheckBoxInner{
  98. /* inner text */
  99. visibility: visible;
  100. display: block;
  101. }
  102. .dojoxTriStateCheckBoxInput {
  103. /* place the actual input on top, but all-but-invisible */
  104. opacity: 0.01;
  105. padding: 0;
  106. margin: 0,
  107. border: 0;
  108. width: 15px;
  109. height: 16px;
  110. background-position:center center;
  111. background-repeat:no-repeat;
  112. }
  113. .dj_ie .dojoxTriStateCheckBoxInput {
  114. filter: alpha(opacity=0);
  115. }