RadioItem.scss 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474
  1. /**
  2. * @class Ext.menu.RadioItem
  3. */
  4. /**
  5. * @var {color}
  6. * Menu RadioItem text color
  7. */
  8. $menuradioitem-color: dynamic(null);
  9. /**
  10. * @var {color}
  11. * Menu RadioItem text color when active
  12. */
  13. $menuradioitem-active-color: dynamic(null);
  14. /**
  15. * @var {color}
  16. * Menu RadioItem text color when disabled
  17. */
  18. $menuradioitem-disabled-color: dynamic(null);
  19. /**
  20. * @var {color}
  21. * Menu RadioItem background-color
  22. */
  23. $menuradioitem-background-color: dynamic(null);
  24. /**
  25. * @var {color}
  26. * Menu RadioItem background-color when active
  27. */
  28. $menuradioitem-active-background-color: dynamic(null);
  29. /**
  30. * @var {color}
  31. * Menu RadioItem background-color when disabled
  32. */
  33. $menuradioitem-disabled-background-color: dynamic(null);
  34. /**
  35. * @var {string/number}
  36. * Menu RadioItem font-weight
  37. */
  38. $menuradioitem-font-weight: dynamic(null);
  39. /**
  40. * @var {number}
  41. * Menu RadioItem font-size
  42. */
  43. $menuradioitem-font-size: dynamic(null);
  44. /**
  45. * @var {number}
  46. * Menu RadioItem font-size in the {@link Global_CSS#$enable-big big} sizing scheme
  47. */
  48. $menuradioitem-font-size-big: dynamic(null);
  49. /**
  50. * @var {string}
  51. * Menu RadioItem font-family
  52. */
  53. $menuradioitem-font-family: dynamic(null);
  54. /**
  55. * @var {number}
  56. * Menu RadioItem height
  57. */
  58. $menuradioitem-height: dynamic(null);
  59. /**
  60. * @var {number}
  61. * Menu RadioItem height in the {@link Global_CSS#$enable-big big} sizing scheme
  62. */
  63. $menuradioitem-height-big: dynamic(null);
  64. /**
  65. * @var {string}
  66. * Menu RadioItem cursor
  67. */
  68. $menuradioitem-cursor: dynamic(null);
  69. /**
  70. * @var {string}
  71. * Menu RadioItem cursor when disabled
  72. */
  73. $menuradioitem-disabled-cursor: dynamic(null);
  74. /**
  75. * @var {number}
  76. * Menu item outline-width when focused
  77. */
  78. $menuradioitem-focused-outline-width: dynamic(null);
  79. /**
  80. * @var {string}
  81. * Menu item outline-style when focused
  82. */
  83. $menuradioitem-focused-outline-style: dynamic(null);
  84. /**
  85. * @var {color}
  86. * Menu item outline-color when focused
  87. */
  88. $menuradioitem-focused-outline-color: dynamic(null);
  89. /**
  90. * @var {color}
  91. * Menu item outline-offset when focused
  92. */
  93. $menuradioitem-focused-outline-offset: dynamic(null);
  94. /**
  95. * @var {number}
  96. * The opacity of disabled {@link Ext.menu.Item Menu RadioItems}
  97. */
  98. $menuradioitem-disabled-opacity: dynamic(null);
  99. /**
  100. * @var {color}
  101. * Menu RadioItem icon color
  102. */
  103. $menuradioitem-icon-color: dynamic(null);
  104. /**
  105. * @var {color}
  106. * Menu RadioItem icon color when active
  107. */
  108. $menuradioitem-active-icon-color: dynamic(null);
  109. /**
  110. * @var {color}
  111. * Menu RadioItem icon color when disabled
  112. */
  113. $menuradioitem-disabled-icon-color: dynamic(null);
  114. /**
  115. * @var {number}
  116. * Menu RadioItem icon size
  117. */
  118. $menuradioitem-icon-size: dynamic(null);
  119. /**
  120. * @var {number}
  121. * Menu RadioItem icon size in the {@link Global_CSS#$enable-big big} sizing scheme
  122. */
  123. $menuradioitem-icon-size-big: dynamic(null);
  124. /**
  125. * @var {number}
  126. * Menu RadioItem icon font-size
  127. */
  128. $menuradioitem-icon-font-size: dynamic(null);
  129. /**
  130. * @var {number}
  131. * Menu RadioItem icon font-size in the {@link Global_CSS#$enable-big big} sizing scheme
  132. */
  133. $menuradioitem-icon-font-size-big: dynamic(null);
  134. /**
  135. * @var {string}
  136. * Menu RadioItem arrow icon
  137. */
  138. $menuradioitem-arrow-icon: dynamic(null);
  139. /**
  140. * @var {color}
  141. * Menu RadioItem arrow icon color
  142. */
  143. $menuradioitem-arrow-icon-color: dynamic($menuradioitem-icon-color);
  144. /**
  145. * @var {color}
  146. * Menu RadioItem arrow icon color when active
  147. */
  148. $menuradioitem-active-arrow-icon-color: dynamic($menuradioitem-active-icon-color);
  149. /**
  150. * @var {color}
  151. * Menu RadioItem arrow icon color when disabled
  152. */
  153. $menuradioitem-disabled-arrow-icon-color: dynamic($menuradioitem-disabled-icon-color);
  154. /**
  155. * @var {number}
  156. * Menu RadioItem arrow icon size
  157. */
  158. $menuradioitem-arrow-icon-size: dynamic($menuradioitem-icon-size);
  159. /**
  160. * @var {number}
  161. * Menu RadioItem arrow icon size in the {@link Global_CSS#$enable-big big} sizing scheme
  162. */
  163. $menuradioitem-arrow-icon-size-big: dynamic($menuradioitem-icon-size-big);
  164. /**
  165. * @var {number}
  166. * Menu RadioItem arrow icon font-size
  167. */
  168. $menuradioitem-arrow-icon-font-size: dynamic(null);
  169. /**
  170. * @var {number}
  171. * Menu RadioItem arrow icon font-size in the {@link Global_CSS#$enable-big big} sizing scheme
  172. */
  173. $menuradioitem-arrow-icon-font-size-big: dynamic(null);
  174. /**
  175. * @var {number/list}
  176. * Menu RadioItem arrow icon margin
  177. */
  178. $menuradioitem-arrow-icon-margin: dynamic(null);
  179. /**
  180. * @var {number/list}
  181. * Menu RadioItem arrow icon margin in the {@link Global_CSS#$enable-big big} sizing scheme
  182. */
  183. $menuradioitem-arrow-icon-margin-big: dynamic(null);
  184. /**
  185. * @var {string/list}
  186. * Menu RadioItem checkbox icon
  187. */
  188. $menuradioitem-checkbox-icon: dynamic('');
  189. /**
  190. * @var {string/list}
  191. * Menu RadioItem checkbox icon when checked
  192. */
  193. $menuradioitem-checked-checkbox-icon: dynamic($fa-var-check);
  194. /**
  195. * @var {color}
  196. * Menu RadioItem checkbox color
  197. */
  198. $menuradioitem-checkbox-color: dynamic($menuitem-icon-color);
  199. /**
  200. * @var {color}
  201. * Menu RadioItem checkbox color when active
  202. */
  203. $menuradioitem-active-checkbox-color: dynamic($menuitem-active-icon-color);
  204. /**
  205. * @var {color}
  206. * Menu RadioItem checkbox color when disabled
  207. */
  208. $menuradioitem-disabled-checkbox-color: dynamic($menuitem-disabled-icon-color);
  209. /**
  210. * @var {number}
  211. * Menu RadioItem checkbox size
  212. */
  213. $menuradioitem-checkbox-size: dynamic(null);
  214. /**
  215. * @var {number}
  216. * Menu RadioItem checkbox size in the {@link Global_CSS#$enable-big big} sizing scheme
  217. */
  218. $menuradioitem-checkbox-size-big: dynamic(null);
  219. /**
  220. * @var {number}
  221. * Menu RadioItem checkbox font size
  222. */
  223. $menuradioitem-checkbox-font-size: dynamic($menuradioitem-checkbox-size);
  224. /**
  225. * @var {number}
  226. * Menu RadioItem checkbox font size in the {@link Global_CSS#$enable-big big} sizing scheme
  227. */
  228. $menuradioitem-checkbox-font-size-big: dynamic($menuradioitem-checkbox-size-big);
  229. /**
  230. * Creates a visual theme for a Menu RadioItem.
  231. *
  232. * @param {string} $ui
  233. * The name of the UI being created. Can not included spaces or special punctuation
  234. * (used in CSS class names).
  235. *
  236. * @param {String} [$xtype=menuradioitem] (protected) The {@link Ext.Class#xtype} to use
  237. * in CSS selectors. For use by UI mixins of derived classes.
  238. *
  239. * @param {color} $color
  240. * Menu RadioItem text color
  241. *
  242. * @param {color} $active-color
  243. * Menu RadioItem text color when active
  244. *
  245. * @param {color} $disabled-color
  246. * Menu RadioItem text color when disabled
  247. *
  248. * @param {color} $background-color
  249. * Menu RadioItem background-color
  250. *
  251. * @param {color} $active-background-color
  252. * Menu RadioItem background-color when active
  253. *
  254. * @param {color} $disabled-background-color
  255. * Menu RadioItem background-color when disabled
  256. *
  257. * @param {string/number} $font-weight
  258. * Menu RadioItem font-weight
  259. *
  260. * @param {number} $font-size
  261. * Menu RadioItem font-size
  262. *
  263. * @param {number} $font-size-big
  264. * Menu RadioItem font-size in the {@link Global_CSS#$enable-big big} sizing scheme
  265. *
  266. * @param {string} $font-family
  267. * Menu RadioItem font-family
  268. *
  269. * @param {number} $height
  270. * Menu RadioItem height
  271. *
  272. * @param {number} $height-big
  273. * Menu RadioItem height in the {@link Global_CSS#$enable-big big} sizing scheme
  274. *
  275. * @param {string} $cursor
  276. * Menu RadioItem cursor
  277. *
  278. * @param {string} $disabled-cursor
  279. * Menu RadioItem cursor when disabled
  280. *
  281. * @param {number} $focused-outline-width
  282. * Menu item outline-width when focused
  283. *
  284. * @param {string} $focused-outline-style
  285. * Menu item outline-style when focused
  286. *
  287. * @param {color} $focused-outline-color
  288. * Menu item outline-color when focused
  289. *
  290. * @param {color} $focused-outline-offset
  291. * Menu item outline-offset when focused
  292. *
  293. * @param {number} $disabled-opacity
  294. * The opacity of disabled {@link Ext.menu.Item Menu RadioItems}
  295. *
  296. * @param {color} $icon-color
  297. * Menu RadioItem icon color
  298. *
  299. * @param {color} $active-icon-color
  300. * Menu RadioItem icon color when active
  301. *
  302. * @param {color} $disabled-icon-color
  303. * Menu RadioItem icon color when disabled
  304. *
  305. * @param {number} $icon-size
  306. * Menu RadioItem icon size
  307. *
  308. * @param {number} $icon-size-big
  309. * Menu RadioItem icon size in the {@link Global_CSS#$enable-big big} sizing scheme
  310. *
  311. * @param {number} $icon-font-size
  312. * Menu RadioItem icon font-size
  313. *
  314. * @param {number} $icon-font-size-big
  315. * Menu RadioItem icon font-size in the {@link Global_CSS#$enable-big big} sizing scheme
  316. *
  317. * @param {string} $arrow-icon
  318. * Menu RadioItem arrow icon
  319. *
  320. * @param {color} $arrow-icon-color
  321. * Menu RadioItem arrow icon color
  322. *
  323. * @param {color} $active-arrow-icon-color
  324. * Menu RadioItem arrow icon color when active
  325. *
  326. * @param {color} $disabled-arrow-icon-color
  327. * Menu RadioItem arrow icon color when disabled
  328. *
  329. * @param {number} $arrow-icon-size
  330. * Menu RadioItem arrow icon size
  331. *
  332. * @param {number} $arrow-icon-size-big
  333. * Menu RadioItem arrow icon size in the {@link Global_CSS#$enable-big big} sizing scheme
  334. *
  335. * @param {number} $arrow-icon-font-size
  336. * Menu RadioItem arrow icon font-size
  337. *
  338. * @param {number} $arrow-icon-font-size-big
  339. * Menu RadioItem arrow icon font-size in the {@link Global_CSS#$enable-big big} sizing scheme
  340. *
  341. * @param {number/list} $arrow-icon-margin
  342. * Menu RadioItem arrow icon margin
  343. *
  344. * @param {number/list} $arrow-icon-margin-big
  345. * Menu RadioItem arrow icon margin in the {@link Global_CSS#$enable-big big} sizing scheme
  346. *
  347. * @param {string/list} $checkbox-icon
  348. * Menu RadioItem checkbox icon
  349. *
  350. * @param {string/list} $checked-checkbox-icon
  351. * Menu RadioItem checkbox icon when checked
  352. *
  353. * @param {color} $checkbox-color
  354. * Menu RadioItem checkbox color
  355. *
  356. * @param {color} $active-checkbox-color
  357. * Menu RadioItem checkbox color when active
  358. *
  359. * @param {color} $disabled-checkbox-color
  360. * Menu RadioItem checkbox color when disabled
  361. *
  362. * @param {number} $checkbox-size
  363. * Menu RadioItem checkbox size
  364. *
  365. * @param {number} $checkbox-size-big
  366. * Menu RadioItem checkbox size in the {@link Global_CSS#$enable-big big} sizing scheme
  367. *
  368. * @param {number} $checkbox-font-size
  369. * Menu RadioItem checkbox font size
  370. *
  371. * @param {number} $checkbox-font-size-big
  372. * Menu RadioItem checkbox font size in the {@link Global_CSS#$enable-big big} sizing scheme
  373. */
  374. @mixin menuradioitem-ui(
  375. $ui: null,
  376. $xtype: menuradioitem,
  377. $color: null,
  378. $active-color: null,
  379. $disabled-color: null,
  380. $background-color: null,
  381. $active-background-color: null,
  382. $disabled-background-color: null,
  383. $font-weight: null,
  384. $font-size: null,
  385. $font-size-big: null,
  386. $font-family: null,
  387. $height: null,
  388. $height-big: null,
  389. $cursor: null,
  390. $disabled-cursor: null,
  391. $focused-outline-width: null,
  392. $focused-outline-style: null,
  393. $focused-outline-color: null,
  394. $focused-outline-offset: null,
  395. $disabled-opacity: null,
  396. $icon-color: null,
  397. $active-icon-color: null,
  398. $disabled-icon-color: null,
  399. $icon-size: null,
  400. $icon-size-big: null,
  401. $icon-font-size: null,
  402. $icon-font-size-big: null,
  403. $arrow-icon: null,
  404. $arrow-icon-color: null,
  405. $active-arrow-icon-color: null,
  406. $disabled-arrow-icon-color: null,
  407. $arrow-icon-size: null,
  408. $arrow-icon-size-big: null,
  409. $arrow-icon-font-size: null,
  410. $arrow-icon-font-size-big: null,
  411. $arrow-icon-margin: null,
  412. $arrow-icon-margin-big: null,
  413. $checkbox-icon: null,
  414. $checked-checkbox-icon: null,
  415. $checkbox-color: null,
  416. $active-checkbox-color: null,
  417. $disabled-checkbox-color: null,
  418. $checkbox-size: null,
  419. $checkbox-size-big: null,
  420. $checkbox-font-size: null,
  421. $checkbox-font-size-big: null
  422. ) {
  423. $ui-suffix: ui-suffix($ui);
  424. $arguments: intersect-arguments(menuradioitem-ui, menucheckitem-ui);
  425. @include menucheckitem-ui($arguments...);
  426. }