CheckedMultiSelect.css 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278
  1. /*
  2. **----------------------------------------------------------------------------
  3. ** CheckedMultiSelect
  4. **----------------------------------------------------------------------------
  5. */
  6. .dojoxCheckedMultiSelectHidden{
  7. display: none;
  8. }
  9. .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
  10. border: solid black 1px;
  11. margin: 1px 0;
  12. overflow: scroll;
  13. overflow-y: scroll;
  14. overflow-x: hidden;
  15. height: 100px;
  16. }
  17. .dj_ie .dojoxCheckedMultiSelectWrapper,
  18. .dj_webkit .dojoxCheckedMultiSelectWrapper {
  19. /* So that the scroll bar doesn't cover stuff up */
  20. padding-right: 15px;
  21. }
  22. .dojoxMultiSelectItem {
  23. cursor: default;
  24. padding: 0.1em 0.2em;
  25. white-space: nowrap;
  26. }
  27. .dojoxCheckedMultiSelectItem {
  28. white-space: nowrap;
  29. padding:.1em .2em;
  30. cursor:default;
  31. }
  32. .dojoxCheckedMultiSelectDisabled *,
  33. .dojoxCheckedMultiSelectReadOnly * {
  34. color:gray !important;
  35. }
  36. .dojoxCheckedMultiSelectItemLabel {
  37. margin-left: .2em;
  38. }
  39. .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
  40. margin: 0em 0.1em;
  41. }
  42. .dojoxCheckedMultiSelectCheckBoxInput {
  43. opacity: 0.01;
  44. }
  45. .dj_ie .dojoxCheckedMultiSelectCheckBoxInput {
  46. filter: alpha(opacity=0);
  47. width: 15px;
  48. height: 16px;
  49. }
  50. .dijit_a11y .dojoxCheckedMultiSelectCheckBoxInput {
  51. opacity: 1;
  52. filter: none;
  53. }
  54. .dojoxCheckedMultiSelectMenu td.dijitMenuArrowCell {
  55. display: none;
  56. }
  57. .dojoxCheckedMultiSelectMenu td.dijitMenuItemLabel {
  58. position: static;
  59. padding: 2px;
  60. }
  61. /*
  62. **----------------------------------------------------------------------------
  63. ** Tundra theme (make look similar to text box)
  64. **----------------------------------------------------------------------------
  65. */
  66. .tundra .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
  67. background:#fff url("../../../dijit/themes/tundra/images/validationInputBg.png") repeat-x top left;
  68. #background:#fff url('../../../dijit/themes/tundra/images/validationInputBg.gif') repeat-x top left;
  69. border:1px solid #b3b3b3;
  70. line-height: normal;
  71. }
  72. .tundra .dojoxCheckedMultiSelectFocused .dojoxCheckedMultiSelectWrapper {
  73. /* input field when focused (ie: typing affects it) */
  74. border-color:#406b9b;
  75. }
  76. /*
  77. **----------------------------------------------------------------------------
  78. ** Soria theme (make look similar to text box)
  79. **----------------------------------------------------------------------------
  80. */
  81. .soria .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
  82. background:#fff url("../../../dijit/themes/soria/images/validationInputBg.png") repeat-x top left;
  83. #background:#fff url('../../../dijit/themes/soria/images/validationInputBg.gif') repeat-x top left;
  84. border:1px solid #8ba0bd;
  85. line-height: normal;
  86. }
  87. .soria .dojoxCheckedMultiSelectFocused .dojoxCheckedMultiSelectWrapper {
  88. /* input field when focused (ie: typing affects it) */
  89. border-color:#406b9b;
  90. }
  91. /*
  92. **----------------------------------------------------------------------------
  93. ** Nihilo theme (make look similar to text box)
  94. **----------------------------------------------------------------------------
  95. */
  96. .nihilo .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
  97. background:#fff url("../../../dijit/themes/nihilo/images/validationInputBg.png") repeat-x top left;
  98. #background:#fff url('../../../dijit/themes/nihilo/images/validationInputBg.gif') repeat-x top left;
  99. border:1px solid #d3d3d3;
  100. line-height: normal;
  101. }
  102. .nihilo .dojoxCheckedMultiSelectFocused .dojoxCheckedMultiSelectWrapper {
  103. /* input field when focused (ie: typing affects it) */
  104. border-color:#b3b3b3;
  105. }
  106. /*
  107. **----------------------------------------------------------------------------
  108. ** Claro theme (make look similar to text box)
  109. **----------------------------------------------------------------------------
  110. */
  111. .claro .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
  112. border: 1px solid #b5bcc7;
  113. background-color: #f7fcff;
  114. line-height: normal;
  115. -webkit-transition-property:background-color, border;
  116. -webkit-transition-duration:.35s;
  117. }
  118. .claro .dojoxCheckedMultiSelectHover .dojoxCheckedMultiSelectWrapper {
  119. border-color: #769dc0;
  120. background-color: #e9f4fe;
  121. background-image: url('../../../dijit/themes/claro/form/images/textBox_back.png');
  122. background-repeat: repeat-x;
  123. -webkit-transition-duration:.25s;
  124. }
  125. .claro .dojoxCheckedMultiSelectFocused .dojoxCheckedMultiSelectWrapper {
  126. border: 1px solid #769dc0;
  127. -webkit-transition-duration:.1s;
  128. }
  129. .claro .dojoxCheckedMultiSelectMenuCheckBoxItemIcon {
  130. background-image: url('../../../dijit/themes/claro/form/images/checkboxRadioButtonStates.png');
  131. background-repeat: no-repeat;
  132. background-position: -15px;
  133. width: 15px;
  134. height: 16px;
  135. }
  136. .claro .dojoxCheckedMultiSelectMenuRadioItemIcon {
  137. background-image: url('../../../dijit/themes/claro/form/images/checkboxRadioButtonStates.png');
  138. background-repeat: no-repeat;
  139. background-position: -105px;
  140. width: 15px;
  141. height: 16px;
  142. }
  143. .dj_ie6 .claro .dojoxCheckedMultiSelectMenuItemIcon {
  144. background-image: url('../../../dijit/themes/claro/form/images/checkboxRadioButtonStates.png');
  145. }
  146. .claro .dojoxCheckedMultiSelectMenuItemChecked .dojoxCheckedMultiSelectMenuCheckBoxItemIcon {
  147. background-position: 0;
  148. }
  149. .claro .dojoxCheckedMultiSelectMenuItemChecked .dojoxCheckedMultiSelectMenuRadioItemIcon {
  150. background-position: -90px;
  151. }
  152. /* Drop down button */
  153. .claro .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectButton .dijitButtonText {
  154. padding: 2px;
  155. }
  156. /* normal status */
  157. .claro .dojoxCheckedMultiSelectButton {
  158. border: 1px solid #b5bcc7;
  159. background-color: #ffffff;
  160. border-collapse: separate;
  161. }
  162. .claro .dojoxCheckedMultiSelect .dijitButtonNode {
  163. border: 0 solid #b5bcc7;
  164. border-width: 0 0 0 0;
  165. }
  166. .dj_ie6 .claro .dojoxCheckedMultiSelectButton, .dj_ie6 .claro .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectButton .dijitButtonNode {
  167. background-image: none;
  168. }
  169. .claro .dojoxCheckedMultiSelectButton .dijitButtonContents {
  170. border: 0 solid #b5bcc7;
  171. border-right-width: 1px;
  172. }
  173. .claro .dojoxCheckedMultiSelectButton .dijitArrowButton {
  174. padding: 0;
  175. border: 1px solid #ffffff;
  176. border-top: none;
  177. background-color: #efefef;
  178. background-image: url("../../../dijit/themes/claro/form/images/formHighlight.png");
  179. background-repeat: repeat-x;
  180. }
  181. .claro .dojoxCheckedMultiSelectButton .dijitArrowButton .dijitArrowButtonInner {
  182. background-image: url("../../../dijit/themes/claro/form/images/commonFormArrows.png");
  183. background-position: -35px;
  184. background-repeat: no-repeat;
  185. width: 16px;
  186. height: 16px;
  187. }
  188. /* hover status */
  189. .claro .dojoxCheckedMultiSelectButtonHover {
  190. border: 1px solid #769dc0;
  191. background-color: #e9f4fe;
  192. background-image: url('../../../dijit/themes/claro/form/images/textBox_back.png');
  193. background-repeat: repeat-x;
  194. }
  195. .claro .dojoxCheckedMultiSelectButtonHover .dijitButtonContents {
  196. border-color: #769dc0;
  197. }
  198. .claro .dojoxCheckedMultiSelectButtonHover .dijitArrowButton {
  199. background-color: #abd6ff;
  200. }
  201. .claro .dojoxCheckedMultiSelectButtonHover .dijitArrowButton .dijitArrowButtonInner {
  202. background-position: -70px ;
  203. }
  204. /* focused status */
  205. .claro .dojoxCheckedMultiSelectButtonFocused {
  206. border: 1px solid #769dc0;
  207. }
  208. .claro .dojoxCheckedMultiSelectButtonFocused .dijitButtonContents {
  209. border-color: #769dc0;
  210. }
  211. .claro .dojoxCheckedMultiSelectButtonFocused .dijitArrowButton {
  212. background-color: #7dbefa;
  213. background-position: 0 -177px;
  214. border: none;
  215. padding: 0 1px;
  216. }
  217. .claro .dojoxCheckedMultiSelectButtonFocused .dijitArrowButton .dijitArrowButtonInner {
  218. background-position: -70px;
  219. margin-bottom: 1px;
  220. }
  221. /* disable status */
  222. .claro .dojoxCheckedMultiSelectButtonDisabled {
  223. border: 1px solid #d3d3d3;
  224. background-color: #efefef;
  225. background-image: none;
  226. color: #818181;
  227. }
  228. .claro .dojoxCheckedMultiSelectButtonDisabled .dijitArrowButton {
  229. background-color: #efefef;
  230. }
  231. .claro .dojoxCheckedMultiSelectButtonDisabled .dijitArrowButton .dijitArrowButtonInner {
  232. background-position: 0;
  233. }