@syncfusion/blazor-themes 28.1.41 → 28.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (455) hide show
  1. package/Compiled-Themes/bds-dark-lite.css +19 -8
  2. package/Compiled-Themes/bds-dark.css +35 -11
  3. package/Compiled-Themes/bds-lite.css +19 -8
  4. package/Compiled-Themes/bds.css +35 -11
  5. package/Compiled-Themes/bootstrap-dark-lite.css +20 -9
  6. package/Compiled-Themes/bootstrap-dark.css +35 -11
  7. package/Compiled-Themes/bootstrap-lite.css +20 -9
  8. package/Compiled-Themes/bootstrap.css +35 -11
  9. package/Compiled-Themes/bootstrap4-lite.css +20 -9
  10. package/Compiled-Themes/bootstrap4.css +35 -11
  11. package/Compiled-Themes/bootstrap5-dark-lite.css +19 -8
  12. package/Compiled-Themes/bootstrap5-dark.css +33 -9
  13. package/Compiled-Themes/bootstrap5-lite.css +19 -8
  14. package/Compiled-Themes/bootstrap5.3-dark-lite.css +15 -8
  15. package/Compiled-Themes/bootstrap5.3-dark.css +29 -9
  16. package/Compiled-Themes/bootstrap5.3-lite.css +15 -8
  17. package/Compiled-Themes/bootstrap5.3.css +29 -9
  18. package/Compiled-Themes/bootstrap5.css +33 -9
  19. package/Compiled-Themes/fabric-dark-lite.css +20 -9
  20. package/Compiled-Themes/fabric-dark.css +36 -12
  21. package/Compiled-Themes/fabric-lite.css +20 -9
  22. package/Compiled-Themes/fabric.css +36 -12
  23. package/Compiled-Themes/fluent-dark-lite.css +22 -13
  24. package/Compiled-Themes/fluent-dark.css +38 -16
  25. package/Compiled-Themes/fluent-lite.css +22 -13
  26. package/Compiled-Themes/fluent.css +38 -16
  27. package/Compiled-Themes/fluent2-dark-lite.css +19 -11
  28. package/Compiled-Themes/fluent2-dark.css +28 -11
  29. package/Compiled-Themes/fluent2-highcontrast-lite.css +19 -11
  30. package/Compiled-Themes/fluent2-highcontrast.css +28 -11
  31. package/Compiled-Themes/fluent2-lite.css +19 -11
  32. package/Compiled-Themes/fluent2.css +28 -11
  33. package/Compiled-Themes/highcontrast-lite.css +22 -11
  34. package/Compiled-Themes/highcontrast.css +38 -14
  35. package/Compiled-Themes/material-dark-lite.css +20 -9
  36. package/Compiled-Themes/material-dark.css +36 -12
  37. package/Compiled-Themes/material-lite.css +20 -9
  38. package/Compiled-Themes/material.css +36 -12
  39. package/Compiled-Themes/material3-dark-lite.css +27 -16
  40. package/Compiled-Themes/material3-dark.css +44 -20
  41. package/Compiled-Themes/material3-lite.css +27 -16
  42. package/Compiled-Themes/material3.css +44 -20
  43. package/Compiled-Themes/tailwind-dark-lite.css +23 -12
  44. package/Compiled-Themes/tailwind-dark.css +41 -17
  45. package/Compiled-Themes/tailwind-lite.css +23 -12
  46. package/Compiled-Themes/tailwind.css +41 -17
  47. package/Compiled-Themes/tailwind3-dark-lite.css +7 -7
  48. package/Compiled-Themes/tailwind3-dark.css +11 -8
  49. package/Compiled-Themes/tailwind3-lite.css +7 -7
  50. package/Compiled-Themes/tailwind3.css +11 -8
  51. package/SCSS-Themes/bds-dark-lite.scss +45 -29
  52. package/SCSS-Themes/bds-dark.scss +60 -36
  53. package/SCSS-Themes/bds-lite.scss +45 -29
  54. package/SCSS-Themes/bds.scss +60 -36
  55. package/SCSS-Themes/bootstrap-dark-lite.scss +44 -28
  56. package/SCSS-Themes/bootstrap-dark.scss +59 -35
  57. package/SCSS-Themes/bootstrap-lite.scss +44 -28
  58. package/SCSS-Themes/bootstrap.scss +59 -35
  59. package/SCSS-Themes/bootstrap4-lite.scss +44 -28
  60. package/SCSS-Themes/bootstrap4.scss +59 -35
  61. package/SCSS-Themes/bootstrap5-dark-lite.scss +44 -28
  62. package/SCSS-Themes/bootstrap5-dark.scss +59 -35
  63. package/SCSS-Themes/bootstrap5-lite.scss +44 -28
  64. package/SCSS-Themes/bootstrap5.3-dark-lite.scss +44 -28
  65. package/SCSS-Themes/bootstrap5.3-dark.scss +59 -35
  66. package/SCSS-Themes/bootstrap5.3-lite.scss +44 -28
  67. package/SCSS-Themes/bootstrap5.3.scss +59 -35
  68. package/SCSS-Themes/bootstrap5.scss +59 -35
  69. package/SCSS-Themes/fabric-dark-lite.scss +46 -30
  70. package/SCSS-Themes/fabric-dark.scss +61 -37
  71. package/SCSS-Themes/fabric-lite.scss +46 -30
  72. package/SCSS-Themes/fabric.scss +61 -37
  73. package/SCSS-Themes/fluent-dark-lite.scss +46 -30
  74. package/SCSS-Themes/fluent-dark.scss +61 -37
  75. package/SCSS-Themes/fluent-lite.scss +46 -30
  76. package/SCSS-Themes/fluent.scss +61 -37
  77. package/SCSS-Themes/fluent2-dark-lite.scss +39 -26
  78. package/SCSS-Themes/fluent2-dark.scss +54 -33
  79. package/SCSS-Themes/fluent2-highcontrast-lite.scss +39 -26
  80. package/SCSS-Themes/fluent2-highcontrast.scss +54 -33
  81. package/SCSS-Themes/fluent2-lite.scss +39 -26
  82. package/SCSS-Themes/fluent2.scss +54 -33
  83. package/SCSS-Themes/gantt/gantt/bds-dark-lite.scss +0 -1
  84. package/SCSS-Themes/gantt/gantt/bds-dark.scss +0 -1
  85. package/SCSS-Themes/gantt/gantt/bds-lite.scss +0 -1
  86. package/SCSS-Themes/gantt/gantt/bds.scss +0 -1
  87. package/SCSS-Themes/gantt/gantt/bootstrap-dark-lite.scss +0 -1
  88. package/SCSS-Themes/gantt/gantt/bootstrap-dark.scss +0 -1
  89. package/SCSS-Themes/gantt/gantt/bootstrap-lite.scss +0 -1
  90. package/SCSS-Themes/gantt/gantt/bootstrap.scss +0 -1
  91. package/SCSS-Themes/gantt/gantt/bootstrap4-lite.scss +0 -1
  92. package/SCSS-Themes/gantt/gantt/bootstrap4.scss +0 -1
  93. package/SCSS-Themes/gantt/gantt/bootstrap5-dark-lite.scss +0 -1
  94. package/SCSS-Themes/gantt/gantt/bootstrap5-dark.scss +0 -1
  95. package/SCSS-Themes/gantt/gantt/bootstrap5-lite.scss +0 -1
  96. package/SCSS-Themes/gantt/gantt/bootstrap5.3-dark-lite.scss +0 -1
  97. package/SCSS-Themes/gantt/gantt/bootstrap5.3-dark.scss +0 -1
  98. package/SCSS-Themes/gantt/gantt/bootstrap5.3-lite.scss +0 -1
  99. package/SCSS-Themes/gantt/gantt/bootstrap5.3.scss +0 -1
  100. package/SCSS-Themes/gantt/gantt/bootstrap5.scss +0 -1
  101. package/SCSS-Themes/gantt/gantt/fabric-dark-lite.scss +0 -1
  102. package/SCSS-Themes/gantt/gantt/fabric-dark.scss +0 -1
  103. package/SCSS-Themes/gantt/gantt/fabric-lite.scss +0 -1
  104. package/SCSS-Themes/gantt/gantt/fabric.scss +0 -1
  105. package/SCSS-Themes/gantt/gantt/fluent-dark-lite.scss +0 -1
  106. package/SCSS-Themes/gantt/gantt/fluent-dark.scss +0 -1
  107. package/SCSS-Themes/gantt/gantt/fluent-lite.scss +0 -1
  108. package/SCSS-Themes/gantt/gantt/fluent.scss +0 -1
  109. package/SCSS-Themes/gantt/gantt/fluent2-dark-lite.scss +0 -1
  110. package/SCSS-Themes/gantt/gantt/fluent2-dark.scss +0 -1
  111. package/SCSS-Themes/gantt/gantt/fluent2-highcontrast-lite.scss +0 -1
  112. package/SCSS-Themes/gantt/gantt/fluent2-highcontrast.scss +0 -1
  113. package/SCSS-Themes/gantt/gantt/fluent2-lite.scss +0 -1
  114. package/SCSS-Themes/gantt/gantt/fluent2.scss +0 -1
  115. package/SCSS-Themes/gantt/gantt/highcontrast-lite.scss +1 -2
  116. package/SCSS-Themes/gantt/gantt/highcontrast.scss +1 -2
  117. package/SCSS-Themes/gantt/gantt/material-dark-lite.scss +0 -1
  118. package/SCSS-Themes/gantt/gantt/material-dark.scss +0 -1
  119. package/SCSS-Themes/gantt/gantt/material-lite.scss +0 -1
  120. package/SCSS-Themes/gantt/gantt/material.scss +0 -1
  121. package/SCSS-Themes/gantt/gantt/material3-dark-lite.scss +0 -1
  122. package/SCSS-Themes/gantt/gantt/material3-dark.scss +0 -1
  123. package/SCSS-Themes/gantt/gantt/material3-lite.scss +0 -1
  124. package/SCSS-Themes/gantt/gantt/material3.scss +0 -1
  125. package/SCSS-Themes/gantt/gantt/tailwind-dark-lite.scss +0 -1
  126. package/SCSS-Themes/gantt/gantt/tailwind-dark.scss +0 -1
  127. package/SCSS-Themes/gantt/gantt/tailwind-lite.scss +0 -1
  128. package/SCSS-Themes/gantt/gantt/tailwind.scss +0 -1
  129. package/SCSS-Themes/gantt/gantt/tailwind3-dark-lite.scss +0 -1
  130. package/SCSS-Themes/gantt/gantt/tailwind3-dark.scss +0 -1
  131. package/SCSS-Themes/gantt/gantt/tailwind3-lite.scss +0 -1
  132. package/SCSS-Themes/gantt/gantt/tailwind3.scss +0 -1
  133. package/SCSS-Themes/grids/grid/bds-dark-lite.scss +14 -6
  134. package/SCSS-Themes/grids/grid/bds-dark.scss +22 -11
  135. package/SCSS-Themes/grids/grid/bds-lite.scss +14 -6
  136. package/SCSS-Themes/grids/grid/bds.scss +22 -11
  137. package/SCSS-Themes/grids/grid/bootstrap-dark-lite.scss +14 -6
  138. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +22 -11
  139. package/SCSS-Themes/grids/grid/bootstrap-lite.scss +14 -6
  140. package/SCSS-Themes/grids/grid/bootstrap.scss +22 -11
  141. package/SCSS-Themes/grids/grid/bootstrap4-lite.scss +14 -6
  142. package/SCSS-Themes/grids/grid/bootstrap4.scss +22 -11
  143. package/SCSS-Themes/grids/grid/bootstrap5-dark-lite.scss +14 -6
  144. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +22 -11
  145. package/SCSS-Themes/grids/grid/bootstrap5-lite.scss +14 -6
  146. package/SCSS-Themes/grids/grid/bootstrap5.3-dark-lite.scss +14 -6
  147. package/SCSS-Themes/grids/grid/bootstrap5.3-dark.scss +22 -11
  148. package/SCSS-Themes/grids/grid/bootstrap5.3-lite.scss +14 -6
  149. package/SCSS-Themes/grids/grid/bootstrap5.3.scss +22 -11
  150. package/SCSS-Themes/grids/grid/bootstrap5.scss +22 -11
  151. package/SCSS-Themes/grids/grid/fabric-dark-lite.scss +14 -6
  152. package/SCSS-Themes/grids/grid/fabric-dark.scss +22 -11
  153. package/SCSS-Themes/grids/grid/fabric-lite.scss +14 -6
  154. package/SCSS-Themes/grids/grid/fabric.scss +22 -11
  155. package/SCSS-Themes/grids/grid/fluent-dark-lite.scss +14 -6
  156. package/SCSS-Themes/grids/grid/fluent-dark.scss +22 -11
  157. package/SCSS-Themes/grids/grid/fluent-lite.scss +14 -6
  158. package/SCSS-Themes/grids/grid/fluent.scss +22 -11
  159. package/SCSS-Themes/grids/grid/fluent2-dark-lite.scss +14 -6
  160. package/SCSS-Themes/grids/grid/fluent2-dark.scss +22 -11
  161. package/SCSS-Themes/grids/grid/fluent2-highcontrast-lite.scss +14 -6
  162. package/SCSS-Themes/grids/grid/fluent2-highcontrast.scss +22 -11
  163. package/SCSS-Themes/grids/grid/fluent2-lite.scss +14 -6
  164. package/SCSS-Themes/grids/grid/fluent2.scss +22 -11
  165. package/SCSS-Themes/grids/grid/highcontrast-lite.scss +14 -6
  166. package/SCSS-Themes/grids/grid/highcontrast.scss +22 -11
  167. package/SCSS-Themes/grids/grid/material-dark-lite.scss +14 -6
  168. package/SCSS-Themes/grids/grid/material-dark.scss +22 -11
  169. package/SCSS-Themes/grids/grid/material-lite.scss +14 -6
  170. package/SCSS-Themes/grids/grid/material.scss +22 -11
  171. package/SCSS-Themes/grids/grid/material3-dark-lite.scss +15 -7
  172. package/SCSS-Themes/grids/grid/material3-dark.scss +23 -12
  173. package/SCSS-Themes/grids/grid/material3-lite.scss +15 -7
  174. package/SCSS-Themes/grids/grid/material3.scss +23 -12
  175. package/SCSS-Themes/grids/grid/tailwind-dark-lite.scss +14 -6
  176. package/SCSS-Themes/grids/grid/tailwind-dark.scss +22 -11
  177. package/SCSS-Themes/grids/grid/tailwind-lite.scss +14 -6
  178. package/SCSS-Themes/grids/grid/tailwind.scss +22 -11
  179. package/SCSS-Themes/grids/grid/tailwind3-dark-lite.scss +14 -6
  180. package/SCSS-Themes/grids/grid/tailwind3-dark.scss +22 -11
  181. package/SCSS-Themes/grids/grid/tailwind3-lite.scss +14 -6
  182. package/SCSS-Themes/grids/grid/tailwind3.scss +22 -11
  183. package/SCSS-Themes/highcontrast-lite.scss +47 -31
  184. package/SCSS-Themes/highcontrast.scss +62 -38
  185. package/SCSS-Themes/material-dark-lite.scss +45 -29
  186. package/SCSS-Themes/material-dark.scss +60 -36
  187. package/SCSS-Themes/material-lite.scss +45 -29
  188. package/SCSS-Themes/material.scss +60 -36
  189. package/SCSS-Themes/material3-dark-lite.scss +45 -29
  190. package/SCSS-Themes/material3-dark.scss +60 -36
  191. package/SCSS-Themes/material3-lite.scss +45 -29
  192. package/SCSS-Themes/material3.scss +60 -36
  193. package/SCSS-Themes/navigations/menu/bds-dark-lite.scss +13 -4
  194. package/SCSS-Themes/navigations/menu/bds-dark.scss +13 -4
  195. package/SCSS-Themes/navigations/menu/bds-lite.scss +13 -4
  196. package/SCSS-Themes/navigations/menu/bds.scss +13 -4
  197. package/SCSS-Themes/navigations/menu/bootstrap-dark-lite.scss +13 -4
  198. package/SCSS-Themes/navigations/menu/bootstrap-dark.scss +13 -4
  199. package/SCSS-Themes/navigations/menu/bootstrap-lite.scss +13 -4
  200. package/SCSS-Themes/navigations/menu/bootstrap.scss +13 -4
  201. package/SCSS-Themes/navigations/menu/bootstrap4-lite.scss +13 -4
  202. package/SCSS-Themes/navigations/menu/bootstrap4.scss +13 -4
  203. package/SCSS-Themes/navigations/menu/bootstrap5-dark-lite.scss +13 -4
  204. package/SCSS-Themes/navigations/menu/bootstrap5-dark.scss +13 -4
  205. package/SCSS-Themes/navigations/menu/bootstrap5-lite.scss +13 -4
  206. package/SCSS-Themes/navigations/menu/bootstrap5.3-dark-lite.scss +13 -4
  207. package/SCSS-Themes/navigations/menu/bootstrap5.3-dark.scss +13 -4
  208. package/SCSS-Themes/navigations/menu/bootstrap5.3-lite.scss +13 -4
  209. package/SCSS-Themes/navigations/menu/bootstrap5.3.scss +13 -4
  210. package/SCSS-Themes/navigations/menu/bootstrap5.scss +13 -4
  211. package/SCSS-Themes/navigations/menu/fabric-dark-lite.scss +13 -4
  212. package/SCSS-Themes/navigations/menu/fabric-dark.scss +13 -4
  213. package/SCSS-Themes/navigations/menu/fabric-lite.scss +13 -4
  214. package/SCSS-Themes/navigations/menu/fabric.scss +13 -4
  215. package/SCSS-Themes/navigations/menu/fluent-dark-lite.scss +13 -4
  216. package/SCSS-Themes/navigations/menu/fluent-dark.scss +13 -4
  217. package/SCSS-Themes/navigations/menu/fluent-lite.scss +13 -4
  218. package/SCSS-Themes/navigations/menu/fluent.scss +13 -4
  219. package/SCSS-Themes/navigations/menu/fluent2-dark-lite.scss +13 -4
  220. package/SCSS-Themes/navigations/menu/fluent2-dark.scss +13 -4
  221. package/SCSS-Themes/navigations/menu/fluent2-highcontrast-lite.scss +13 -4
  222. package/SCSS-Themes/navigations/menu/fluent2-highcontrast.scss +13 -4
  223. package/SCSS-Themes/navigations/menu/fluent2-lite.scss +13 -4
  224. package/SCSS-Themes/navigations/menu/fluent2.scss +13 -4
  225. package/SCSS-Themes/navigations/menu/highcontrast-lite.scss +13 -4
  226. package/SCSS-Themes/navigations/menu/highcontrast.scss +13 -4
  227. package/SCSS-Themes/navigations/menu/material-dark-lite.scss +13 -4
  228. package/SCSS-Themes/navigations/menu/material-dark.scss +13 -4
  229. package/SCSS-Themes/navigations/menu/material-lite.scss +13 -4
  230. package/SCSS-Themes/navigations/menu/material.scss +13 -4
  231. package/SCSS-Themes/navigations/menu/material3-dark-lite.scss +13 -4
  232. package/SCSS-Themes/navigations/menu/material3-dark.scss +13 -4
  233. package/SCSS-Themes/navigations/menu/material3-lite.scss +13 -4
  234. package/SCSS-Themes/navigations/menu/material3.scss +13 -4
  235. package/SCSS-Themes/navigations/menu/tailwind-dark-lite.scss +13 -4
  236. package/SCSS-Themes/navigations/menu/tailwind-dark.scss +13 -4
  237. package/SCSS-Themes/navigations/menu/tailwind-lite.scss +13 -4
  238. package/SCSS-Themes/navigations/menu/tailwind.scss +13 -4
  239. package/SCSS-Themes/navigations/menu/tailwind3-dark-lite.scss +13 -4
  240. package/SCSS-Themes/navigations/menu/tailwind3-dark.scss +13 -4
  241. package/SCSS-Themes/navigations/menu/tailwind3-lite.scss +13 -4
  242. package/SCSS-Themes/navigations/menu/tailwind3.scss +13 -4
  243. package/SCSS-Themes/navigations/tab/tailwind-dark-lite.scss +1 -1
  244. package/SCSS-Themes/navigations/tab/tailwind-dark.scss +1 -1
  245. package/SCSS-Themes/navigations/tab/tailwind-lite.scss +1 -1
  246. package/SCSS-Themes/navigations/tab/tailwind.scss +1 -1
  247. package/SCSS-Themes/navigations/treeview/bds-dark-lite.scss +5 -5
  248. package/SCSS-Themes/navigations/treeview/bds-dark.scss +5 -5
  249. package/SCSS-Themes/navigations/treeview/bds-lite.scss +5 -5
  250. package/SCSS-Themes/navigations/treeview/bds.scss +5 -5
  251. package/SCSS-Themes/navigations/treeview/bootstrap-dark-lite.scss +5 -5
  252. package/SCSS-Themes/navigations/treeview/bootstrap-dark.scss +5 -5
  253. package/SCSS-Themes/navigations/treeview/bootstrap-lite.scss +5 -5
  254. package/SCSS-Themes/navigations/treeview/bootstrap.scss +5 -5
  255. package/SCSS-Themes/navigations/treeview/bootstrap4-lite.scss +5 -5
  256. package/SCSS-Themes/navigations/treeview/bootstrap4.scss +5 -5
  257. package/SCSS-Themes/navigations/treeview/bootstrap5-dark-lite.scss +5 -5
  258. package/SCSS-Themes/navigations/treeview/bootstrap5-dark.scss +5 -5
  259. package/SCSS-Themes/navigations/treeview/bootstrap5-lite.scss +5 -5
  260. package/SCSS-Themes/navigations/treeview/bootstrap5.3-dark-lite.scss +5 -5
  261. package/SCSS-Themes/navigations/treeview/bootstrap5.3-dark.scss +5 -5
  262. package/SCSS-Themes/navigations/treeview/bootstrap5.3-lite.scss +5 -5
  263. package/SCSS-Themes/navigations/treeview/bootstrap5.3.scss +5 -5
  264. package/SCSS-Themes/navigations/treeview/bootstrap5.scss +5 -5
  265. package/SCSS-Themes/navigations/treeview/fabric-dark-lite.scss +5 -5
  266. package/SCSS-Themes/navigations/treeview/fabric-dark.scss +5 -5
  267. package/SCSS-Themes/navigations/treeview/fabric-lite.scss +5 -5
  268. package/SCSS-Themes/navigations/treeview/fabric.scss +5 -5
  269. package/SCSS-Themes/navigations/treeview/fluent-dark-lite.scss +5 -5
  270. package/SCSS-Themes/navigations/treeview/fluent-dark.scss +5 -5
  271. package/SCSS-Themes/navigations/treeview/fluent-lite.scss +5 -5
  272. package/SCSS-Themes/navigations/treeview/fluent.scss +5 -5
  273. package/SCSS-Themes/navigations/treeview/fluent2-dark-lite.scss +5 -5
  274. package/SCSS-Themes/navigations/treeview/fluent2-dark.scss +5 -5
  275. package/SCSS-Themes/navigations/treeview/fluent2-highcontrast-lite.scss +5 -5
  276. package/SCSS-Themes/navigations/treeview/fluent2-highcontrast.scss +5 -5
  277. package/SCSS-Themes/navigations/treeview/fluent2-lite.scss +5 -5
  278. package/SCSS-Themes/navigations/treeview/fluent2.scss +5 -5
  279. package/SCSS-Themes/navigations/treeview/highcontrast-lite.scss +5 -5
  280. package/SCSS-Themes/navigations/treeview/highcontrast.scss +5 -5
  281. package/SCSS-Themes/navigations/treeview/material-dark-lite.scss +5 -5
  282. package/SCSS-Themes/navigations/treeview/material-dark.scss +5 -5
  283. package/SCSS-Themes/navigations/treeview/material-lite.scss +5 -5
  284. package/SCSS-Themes/navigations/treeview/material.scss +5 -5
  285. package/SCSS-Themes/navigations/treeview/material3-dark-lite.scss +5 -5
  286. package/SCSS-Themes/navigations/treeview/material3-dark.scss +5 -5
  287. package/SCSS-Themes/navigations/treeview/material3-lite.scss +5 -5
  288. package/SCSS-Themes/navigations/treeview/material3.scss +5 -5
  289. package/SCSS-Themes/navigations/treeview/tailwind-dark-lite.scss +5 -5
  290. package/SCSS-Themes/navigations/treeview/tailwind-dark.scss +5 -5
  291. package/SCSS-Themes/navigations/treeview/tailwind-lite.scss +5 -5
  292. package/SCSS-Themes/navigations/treeview/tailwind.scss +5 -5
  293. package/SCSS-Themes/navigations/treeview/tailwind3-dark-lite.scss +5 -5
  294. package/SCSS-Themes/navigations/treeview/tailwind3-dark.scss +5 -5
  295. package/SCSS-Themes/navigations/treeview/tailwind3-lite.scss +5 -5
  296. package/SCSS-Themes/navigations/treeview/tailwind3.scss +5 -5
  297. package/SCSS-Themes/notifications/badge/bds-dark-lite.scss +2 -4
  298. package/SCSS-Themes/notifications/badge/bds-dark.scss +2 -4
  299. package/SCSS-Themes/notifications/badge/bds-lite.scss +2 -4
  300. package/SCSS-Themes/notifications/badge/bds.scss +2 -4
  301. package/SCSS-Themes/notifications/badge/bootstrap-dark-lite.scss +2 -4
  302. package/SCSS-Themes/notifications/badge/bootstrap-dark.scss +2 -4
  303. package/SCSS-Themes/notifications/badge/bootstrap-lite.scss +2 -4
  304. package/SCSS-Themes/notifications/badge/bootstrap.scss +2 -4
  305. package/SCSS-Themes/notifications/badge/bootstrap4-lite.scss +2 -4
  306. package/SCSS-Themes/notifications/badge/bootstrap4.scss +2 -4
  307. package/SCSS-Themes/notifications/badge/bootstrap5-dark-lite.scss +2 -4
  308. package/SCSS-Themes/notifications/badge/bootstrap5-dark.scss +2 -4
  309. package/SCSS-Themes/notifications/badge/bootstrap5-lite.scss +2 -4
  310. package/SCSS-Themes/notifications/badge/bootstrap5.3-dark-lite.scss +2 -4
  311. package/SCSS-Themes/notifications/badge/bootstrap5.3-dark.scss +2 -4
  312. package/SCSS-Themes/notifications/badge/bootstrap5.3-lite.scss +2 -4
  313. package/SCSS-Themes/notifications/badge/bootstrap5.3.scss +2 -4
  314. package/SCSS-Themes/notifications/badge/bootstrap5.scss +2 -4
  315. package/SCSS-Themes/notifications/badge/fabric-dark-lite.scss +2 -4
  316. package/SCSS-Themes/notifications/badge/fabric-dark.scss +2 -4
  317. package/SCSS-Themes/notifications/badge/fabric-lite.scss +2 -4
  318. package/SCSS-Themes/notifications/badge/fabric.scss +2 -4
  319. package/SCSS-Themes/notifications/badge/fluent-dark-lite.scss +2 -4
  320. package/SCSS-Themes/notifications/badge/fluent-dark.scss +2 -4
  321. package/SCSS-Themes/notifications/badge/fluent-lite.scss +2 -4
  322. package/SCSS-Themes/notifications/badge/fluent.scss +2 -4
  323. package/SCSS-Themes/notifications/badge/fluent2-dark-lite.scss +2 -4
  324. package/SCSS-Themes/notifications/badge/fluent2-dark.scss +2 -4
  325. package/SCSS-Themes/notifications/badge/fluent2-highcontrast-lite.scss +2 -4
  326. package/SCSS-Themes/notifications/badge/fluent2-highcontrast.scss +2 -4
  327. package/SCSS-Themes/notifications/badge/fluent2-lite.scss +2 -4
  328. package/SCSS-Themes/notifications/badge/fluent2.scss +2 -4
  329. package/SCSS-Themes/notifications/badge/highcontrast-lite.scss +2 -4
  330. package/SCSS-Themes/notifications/badge/highcontrast.scss +2 -4
  331. package/SCSS-Themes/notifications/badge/material-dark-lite.scss +2 -4
  332. package/SCSS-Themes/notifications/badge/material-dark.scss +2 -4
  333. package/SCSS-Themes/notifications/badge/material-lite.scss +2 -4
  334. package/SCSS-Themes/notifications/badge/material.scss +2 -4
  335. package/SCSS-Themes/notifications/badge/material3-dark-lite.scss +2 -4
  336. package/SCSS-Themes/notifications/badge/material3-dark.scss +2 -4
  337. package/SCSS-Themes/notifications/badge/material3-lite.scss +2 -4
  338. package/SCSS-Themes/notifications/badge/material3.scss +2 -4
  339. package/SCSS-Themes/notifications/badge/tailwind-dark-lite.scss +2 -4
  340. package/SCSS-Themes/notifications/badge/tailwind-dark.scss +2 -4
  341. package/SCSS-Themes/notifications/badge/tailwind-lite.scss +2 -4
  342. package/SCSS-Themes/notifications/badge/tailwind.scss +2 -4
  343. package/SCSS-Themes/notifications/badge/tailwind3-dark-lite.scss +2 -4
  344. package/SCSS-Themes/notifications/badge/tailwind3-dark.scss +2 -4
  345. package/SCSS-Themes/notifications/badge/tailwind3-lite.scss +2 -4
  346. package/SCSS-Themes/notifications/badge/tailwind3.scss +2 -4
  347. package/SCSS-Themes/pivotview/pivotview/bds-dark-lite.scss +0 -5
  348. package/SCSS-Themes/pivotview/pivotview/bds-dark.scss +0 -5
  349. package/SCSS-Themes/pivotview/pivotview/bds-lite.scss +0 -5
  350. package/SCSS-Themes/pivotview/pivotview/bds.scss +0 -5
  351. package/SCSS-Themes/pivotview/pivotview/bootstrap-dark-lite.scss +0 -5
  352. package/SCSS-Themes/pivotview/pivotview/bootstrap-dark.scss +0 -5
  353. package/SCSS-Themes/pivotview/pivotview/bootstrap-lite.scss +0 -5
  354. package/SCSS-Themes/pivotview/pivotview/bootstrap.scss +0 -5
  355. package/SCSS-Themes/pivotview/pivotview/bootstrap4-lite.scss +0 -5
  356. package/SCSS-Themes/pivotview/pivotview/bootstrap4.scss +0 -5
  357. package/SCSS-Themes/pivotview/pivotview/bootstrap5-dark-lite.scss +0 -5
  358. package/SCSS-Themes/pivotview/pivotview/bootstrap5-dark.scss +0 -5
  359. package/SCSS-Themes/pivotview/pivotview/bootstrap5-lite.scss +0 -5
  360. package/SCSS-Themes/pivotview/pivotview/bootstrap5.3-dark-lite.scss +0 -5
  361. package/SCSS-Themes/pivotview/pivotview/bootstrap5.3-dark.scss +0 -5
  362. package/SCSS-Themes/pivotview/pivotview/bootstrap5.3-lite.scss +0 -5
  363. package/SCSS-Themes/pivotview/pivotview/bootstrap5.3.scss +0 -5
  364. package/SCSS-Themes/pivotview/pivotview/bootstrap5.scss +0 -5
  365. package/SCSS-Themes/pivotview/pivotview/fabric-dark-lite.scss +0 -5
  366. package/SCSS-Themes/pivotview/pivotview/fabric-dark.scss +0 -5
  367. package/SCSS-Themes/pivotview/pivotview/fabric-lite.scss +0 -5
  368. package/SCSS-Themes/pivotview/pivotview/fabric.scss +0 -5
  369. package/SCSS-Themes/pivotview/pivotview/fluent-dark-lite.scss +0 -5
  370. package/SCSS-Themes/pivotview/pivotview/fluent-dark.scss +0 -5
  371. package/SCSS-Themes/pivotview/pivotview/fluent-lite.scss +0 -5
  372. package/SCSS-Themes/pivotview/pivotview/fluent.scss +0 -5
  373. package/SCSS-Themes/pivotview/pivotview/fluent2-dark-lite.scss +0 -5
  374. package/SCSS-Themes/pivotview/pivotview/fluent2-dark.scss +0 -5
  375. package/SCSS-Themes/pivotview/pivotview/fluent2-highcontrast-lite.scss +0 -5
  376. package/SCSS-Themes/pivotview/pivotview/fluent2-highcontrast.scss +0 -5
  377. package/SCSS-Themes/pivotview/pivotview/fluent2-lite.scss +0 -5
  378. package/SCSS-Themes/pivotview/pivotview/fluent2.scss +0 -5
  379. package/SCSS-Themes/pivotview/pivotview/highcontrast-lite.scss +0 -5
  380. package/SCSS-Themes/pivotview/pivotview/highcontrast.scss +0 -5
  381. package/SCSS-Themes/pivotview/pivotview/material-dark-lite.scss +0 -5
  382. package/SCSS-Themes/pivotview/pivotview/material-dark.scss +0 -5
  383. package/SCSS-Themes/pivotview/pivotview/material-lite.scss +0 -5
  384. package/SCSS-Themes/pivotview/pivotview/material.scss +0 -5
  385. package/SCSS-Themes/pivotview/pivotview/material3-dark-lite.scss +0 -5
  386. package/SCSS-Themes/pivotview/pivotview/material3-dark.scss +0 -5
  387. package/SCSS-Themes/pivotview/pivotview/material3-lite.scss +0 -5
  388. package/SCSS-Themes/pivotview/pivotview/material3.scss +0 -5
  389. package/SCSS-Themes/pivotview/pivotview/tailwind-dark-lite.scss +0 -5
  390. package/SCSS-Themes/pivotview/pivotview/tailwind-dark.scss +0 -5
  391. package/SCSS-Themes/pivotview/pivotview/tailwind-lite.scss +0 -5
  392. package/SCSS-Themes/pivotview/pivotview/tailwind.scss +0 -5
  393. package/SCSS-Themes/pivotview/pivotview/tailwind3-dark-lite.scss +0 -5
  394. package/SCSS-Themes/pivotview/pivotview/tailwind3-dark.scss +0 -5
  395. package/SCSS-Themes/pivotview/pivotview/tailwind3-lite.scss +0 -5
  396. package/SCSS-Themes/pivotview/pivotview/tailwind3.scss +0 -5
  397. package/SCSS-Themes/splitbuttons/drop-down-button/bds-dark-lite.scss +11 -4
  398. package/SCSS-Themes/splitbuttons/drop-down-button/bds-dark.scss +18 -6
  399. package/SCSS-Themes/splitbuttons/drop-down-button/bds-lite.scss +11 -4
  400. package/SCSS-Themes/splitbuttons/drop-down-button/bds.scss +18 -6
  401. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap-dark-lite.scss +10 -3
  402. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap-dark.scss +17 -5
  403. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap-lite.scss +10 -3
  404. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap.scss +17 -5
  405. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap4-lite.scss +10 -3
  406. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap4.scss +17 -5
  407. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5-dark-lite.scss +10 -3
  408. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5-dark.scss +17 -5
  409. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5-lite.scss +10 -3
  410. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5.3-dark-lite.scss +10 -3
  411. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5.3-dark.scss +17 -5
  412. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5.3-lite.scss +10 -3
  413. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5.3.scss +17 -5
  414. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5.scss +17 -5
  415. package/SCSS-Themes/splitbuttons/drop-down-button/fabric-dark-lite.scss +12 -5
  416. package/SCSS-Themes/splitbuttons/drop-down-button/fabric-dark.scss +19 -7
  417. package/SCSS-Themes/splitbuttons/drop-down-button/fabric-lite.scss +12 -5
  418. package/SCSS-Themes/splitbuttons/drop-down-button/fabric.scss +19 -7
  419. package/SCSS-Themes/splitbuttons/drop-down-button/fluent-dark-lite.scss +12 -5
  420. package/SCSS-Themes/splitbuttons/drop-down-button/fluent-dark.scss +19 -7
  421. package/SCSS-Themes/splitbuttons/drop-down-button/fluent-lite.scss +12 -5
  422. package/SCSS-Themes/splitbuttons/drop-down-button/fluent.scss +19 -7
  423. package/SCSS-Themes/splitbuttons/drop-down-button/fluent2-dark-lite.scss +5 -1
  424. package/SCSS-Themes/splitbuttons/drop-down-button/fluent2-dark.scss +12 -3
  425. package/SCSS-Themes/splitbuttons/drop-down-button/fluent2-highcontrast-lite.scss +5 -1
  426. package/SCSS-Themes/splitbuttons/drop-down-button/fluent2-highcontrast.scss +12 -3
  427. package/SCSS-Themes/splitbuttons/drop-down-button/fluent2-lite.scss +5 -1
  428. package/SCSS-Themes/splitbuttons/drop-down-button/fluent2.scss +12 -3
  429. package/SCSS-Themes/splitbuttons/drop-down-button/highcontrast-lite.scss +12 -5
  430. package/SCSS-Themes/splitbuttons/drop-down-button/highcontrast.scss +19 -7
  431. package/SCSS-Themes/splitbuttons/drop-down-button/material-dark-lite.scss +11 -4
  432. package/SCSS-Themes/splitbuttons/drop-down-button/material-dark.scss +18 -6
  433. package/SCSS-Themes/splitbuttons/drop-down-button/material-lite.scss +11 -4
  434. package/SCSS-Themes/splitbuttons/drop-down-button/material.scss +18 -6
  435. package/SCSS-Themes/splitbuttons/drop-down-button/material3-dark-lite.scss +10 -3
  436. package/SCSS-Themes/splitbuttons/drop-down-button/material3-dark.scss +17 -5
  437. package/SCSS-Themes/splitbuttons/drop-down-button/material3-lite.scss +10 -3
  438. package/SCSS-Themes/splitbuttons/drop-down-button/material3.scss +17 -5
  439. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind-dark-lite.scss +12 -5
  440. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind-dark.scss +19 -7
  441. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind-lite.scss +12 -5
  442. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind.scss +19 -7
  443. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind3-dark-lite.scss +5 -1
  444. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind3-dark.scss +12 -3
  445. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind3-lite.scss +5 -1
  446. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind3.scss +12 -3
  447. package/SCSS-Themes/tailwind-dark-lite.scss +47 -31
  448. package/SCSS-Themes/tailwind-dark.scss +62 -38
  449. package/SCSS-Themes/tailwind-lite.scss +47 -31
  450. package/SCSS-Themes/tailwind.scss +62 -38
  451. package/SCSS-Themes/tailwind3-dark-lite.scss +39 -26
  452. package/SCSS-Themes/tailwind3-dark.scss +54 -33
  453. package/SCSS-Themes/tailwind3-lite.scss +39 -26
  454. package/SCSS-Themes/tailwind3.scss +54 -33
  455. package/package.json +1 -1
@@ -13,6 +13,7 @@ $drop-down-btn-disable-text: $neutral-tertiary-alt !default;
13
13
  $drop-down-btn-font-size: 14px !default;
14
14
  $drop-down-btn-font-weight: normal !default;
15
15
  $drop-down-btn-icon-font-size: 14px !default;
16
+ $drop-down-btn-small-icon-font-size: 12px !default;
16
17
  $drop-down-btn-icon-margin-right: 10px !default;
17
18
  $drop-down-btn-bigger-icon-margin-right: 10px !default;
18
19
  $drop-down-btn-li-bgcolor: $neutral-light !default;
@@ -43,9 +44,12 @@ $drop-down-btn-ul-border-radius: 0 !default;
43
44
  $drop-down-btn-ul-padding: 0 !default;
44
45
  $drop-down-btn-ul-bigger-padding: 0 !default;
45
46
  $drop-down-btn-ul-small-padding: 0 !default;
46
- $drop-down-btn-caret-icon-font-size: 10px !default;
47
- $drop-down-btn-caret-icon-font-size-bigger: 10px !default;
48
- $drop-down-btn-icon-font-size-bigger: 16px !default;
47
+ $drop-down-btn-caret-icon-font-size: 14px !default;
48
+ $drop-down-btn-small-caret-icon-font-size: 12px !default;
49
+ $drop-down-btn-caret-icon-font-size-bigger: 18px !default;
50
+ $drop-down-btn-small-caret-icon-font-size-bigger: 16px !default;
51
+ $drop-down-btn-icon-font-size-bigger: 18px !default;
52
+ $drop-down-btn-small-icon-font-size-bigger: 16px !default;
49
53
  $drop-down-btn-box-shadow: none !default;
50
54
  $drop-down-btn-popup-margin-top: 0 !default;
51
55
  $drop-down-btn-bigger-popup-margin-top: 0 !default;
@@ -131,7 +135,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
131
135
  }
132
136
 
133
137
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
138
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
139
  font-size: $drop-down-btn-small-icon-font-size;
136
140
  }
137
141
  }
@@ -140,6 +144,9 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
140
144
  @if $skin-name == 'fluent2' {
141
145
  font-size: 12px;
142
146
  }
147
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
148
+ font-size: $drop-down-btn-small-caret-icon-font-size;
149
+ }
143
150
  }
144
151
  }
145
152
  }
@@ -404,7 +411,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
404
411
  .e-dropdown-btn.e-btn {
405
412
  .e-caret {
406
413
  &::before {
407
- content: '\e36a';
414
+ content: '\eb05';
408
415
  }
409
416
  }
410
417
  }
@@ -432,8 +439,13 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
432
439
  padding: $drop-down-btn-vertical-bigger-padding;
433
440
  }
434
441
  .e-btn-icon {
435
- @if $skin-name == 'tailwind3' {
436
- font-size: $drop-down-btn-icon-font-size-bigger;
442
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' {
443
+ font-size: $drop-down-btn-small-icon-font-size-bigger;
444
+ }
445
+ }
446
+ .e-btn-icon.e-caret {
447
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'fluent2' {
448
+ font-size: $drop-down-btn-small-caret-icon-font-size-bigger;
437
449
  }
438
450
  }
439
451
  }
@@ -13,6 +13,7 @@ $drop-down-btn-disable-text: $neutral-tertiary-alt !default;
13
13
  $drop-down-btn-font-size: 14px !default;
14
14
  $drop-down-btn-font-weight: normal !default;
15
15
  $drop-down-btn-icon-font-size: 14px !default;
16
+ $drop-down-btn-small-icon-font-size: 12px !default;
16
17
  $drop-down-btn-icon-margin-right: 10px !default;
17
18
  $drop-down-btn-bigger-icon-margin-right: 10px !default;
18
19
  $drop-down-btn-li-bgcolor: $neutral-lighter !default;
@@ -43,9 +44,12 @@ $drop-down-btn-ul-border-radius: 0 !default;
43
44
  $drop-down-btn-ul-padding: 0 !default;
44
45
  $drop-down-btn-ul-bigger-padding: 0 !default;
45
46
  $drop-down-btn-ul-small-padding: 0 !default;
46
- $drop-down-btn-caret-icon-font-size: 10px !default;
47
- $drop-down-btn-caret-icon-font-size-bigger: 10px !default;
48
- $drop-down-btn-icon-font-size-bigger: 16px !default;
47
+ $drop-down-btn-caret-icon-font-size: 14px !default;
48
+ $drop-down-btn-small-caret-icon-font-size: 12px !default;
49
+ $drop-down-btn-caret-icon-font-size-bigger: 18px !default;
50
+ $drop-down-btn-small-caret-icon-font-size-bigger: 16px !default;
51
+ $drop-down-btn-icon-font-size-bigger: 18px !default;
52
+ $drop-down-btn-small-icon-font-size-bigger: 16px !default;
49
53
  $drop-down-btn-box-shadow: none !default;
50
54
  $drop-down-btn-popup-margin-top: 0 !default;
51
55
  $drop-down-btn-bigger-popup-margin-top: 0 !default;
@@ -131,7 +135,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
131
135
  }
132
136
 
133
137
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
138
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
139
  font-size: $drop-down-btn-small-icon-font-size;
136
140
  }
137
141
  }
@@ -140,6 +144,9 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
140
144
  @if $skin-name == 'fluent2' {
141
145
  font-size: 12px;
142
146
  }
147
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
148
+ font-size: $drop-down-btn-small-caret-icon-font-size;
149
+ }
143
150
  }
144
151
  }
145
152
  }
@@ -404,7 +411,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
404
411
  .e-dropdown-btn.e-btn {
405
412
  .e-caret {
406
413
  &::before {
407
- content: '\e36a';
414
+ content: '\eb05';
408
415
  }
409
416
  }
410
417
  }
@@ -13,6 +13,7 @@ $drop-down-btn-disable-text: $neutral-tertiary-alt !default;
13
13
  $drop-down-btn-font-size: 14px !default;
14
14
  $drop-down-btn-font-weight: normal !default;
15
15
  $drop-down-btn-icon-font-size: 14px !default;
16
+ $drop-down-btn-small-icon-font-size: 12px !default;
16
17
  $drop-down-btn-icon-margin-right: 10px !default;
17
18
  $drop-down-btn-bigger-icon-margin-right: 10px !default;
18
19
  $drop-down-btn-li-bgcolor: $neutral-lighter !default;
@@ -43,9 +44,12 @@ $drop-down-btn-ul-border-radius: 0 !default;
43
44
  $drop-down-btn-ul-padding: 0 !default;
44
45
  $drop-down-btn-ul-bigger-padding: 0 !default;
45
46
  $drop-down-btn-ul-small-padding: 0 !default;
46
- $drop-down-btn-caret-icon-font-size: 10px !default;
47
- $drop-down-btn-caret-icon-font-size-bigger: 10px !default;
48
- $drop-down-btn-icon-font-size-bigger: 16px !default;
47
+ $drop-down-btn-caret-icon-font-size: 14px !default;
48
+ $drop-down-btn-small-caret-icon-font-size: 12px !default;
49
+ $drop-down-btn-caret-icon-font-size-bigger: 18px !default;
50
+ $drop-down-btn-small-caret-icon-font-size-bigger: 16px !default;
51
+ $drop-down-btn-icon-font-size-bigger: 18px !default;
52
+ $drop-down-btn-small-icon-font-size-bigger: 16px !default;
49
53
  $drop-down-btn-box-shadow: none !default;
50
54
  $drop-down-btn-popup-margin-top: 0 !default;
51
55
  $drop-down-btn-bigger-popup-margin-top: 0 !default;
@@ -131,7 +135,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
131
135
  }
132
136
 
133
137
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
138
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
139
  font-size: $drop-down-btn-small-icon-font-size;
136
140
  }
137
141
  }
@@ -140,6 +144,9 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
140
144
  @if $skin-name == 'fluent2' {
141
145
  font-size: 12px;
142
146
  }
147
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
148
+ font-size: $drop-down-btn-small-caret-icon-font-size;
149
+ }
143
150
  }
144
151
  }
145
152
  }
@@ -404,7 +411,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
404
411
  .e-dropdown-btn.e-btn {
405
412
  .e-caret {
406
413
  &::before {
407
- content: '\e36a';
414
+ content: '\eb05';
408
415
  }
409
416
  }
410
417
  }
@@ -432,8 +439,13 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
432
439
  padding: $drop-down-btn-vertical-bigger-padding;
433
440
  }
434
441
  .e-btn-icon {
435
- @if $skin-name == 'tailwind3' {
436
- font-size: $drop-down-btn-icon-font-size-bigger;
442
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' {
443
+ font-size: $drop-down-btn-small-icon-font-size-bigger;
444
+ }
445
+ }
446
+ .e-btn-icon.e-caret {
447
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'fluent2' {
448
+ font-size: $drop-down-btn-small-caret-icon-font-size-bigger;
437
449
  }
438
450
  }
439
451
  }
@@ -8,7 +8,8 @@ $drop-down-btn-bigger-font-size: $text-base !default;
8
8
  $drop-down-btn-bigger-li-height: 40px !default;
9
9
  $drop-down-btn-bigger-max-width: 202px !default;
10
10
  $drop-down-btn-bigger-min-width: 112px !default;
11
- $drop-down-btn-icon-font-size: $text-sm !default;
11
+ $drop-down-btn-icon-font-size: $text-base !default;
12
+ $drop-down-btn-small-icon-font-size: $text-sm !default;
12
13
  $drop-down-btn-icon-margin-right: 11px !default;
13
14
  $drop-down-btn-bigger-icon-margin-right: 12px !default;
14
15
  $drop-down-btn-li-border-width: 1px !default;
@@ -26,9 +27,12 @@ $drop-down-btn-ul-border-radius: 2px !default;
26
27
  $drop-down-btn-ul-padding: 0 0 !default;
27
28
  $drop-down-btn-ul-bigger-padding: 0 0 !default;
28
29
  $drop-down-btn-ul-small-padding: 0 0 !default;
29
- $drop-down-btn-caret-icon-font-size: $text-base !default;
30
- $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
- $drop-down-btn-caret-icon-font-size-bigger: $text-xl !default;
30
+ $drop-down-btn-caret-icon-font-size: $text-sm !default;
31
+ $drop-down-btn-small-caret-icon-font-size: $text-xs !default;
32
+ $drop-down-btn-icon-font-size-bigger: $text-xl !default;
33
+ $drop-down-btn-small-icon-font-size-bigger: $text-lg !default;
34
+ $drop-down-btn-caret-icon-font-size-bigger: $text-base !default;
35
+ $drop-down-btn-small-caret-icon-font-size-bigger: $text-sm !default;
32
36
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
37
  $drop-down-btn-popup-margin-top: 4px !default;
34
38
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -134,7 +138,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
134
138
  }
135
139
 
136
140
  & .e-btn-icon {
137
- @if $skin-name == 'tailwind3' {
141
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
138
142
  font-size: $drop-down-btn-small-icon-font-size;
139
143
  }
140
144
  }
@@ -143,6 +147,9 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
143
147
  @if $skin-name == 'fluent2' {
144
148
  font-size: 12px;
145
149
  }
150
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
151
+ font-size: $drop-down-btn-small-caret-icon-font-size;
152
+ }
146
153
  }
147
154
  }
148
155
  }
@@ -8,7 +8,8 @@ $drop-down-btn-bigger-font-size: $text-base !default;
8
8
  $drop-down-btn-bigger-li-height: 40px !default;
9
9
  $drop-down-btn-bigger-max-width: 202px !default;
10
10
  $drop-down-btn-bigger-min-width: 112px !default;
11
- $drop-down-btn-icon-font-size: $text-sm !default;
11
+ $drop-down-btn-icon-font-size: $text-base !default;
12
+ $drop-down-btn-small-icon-font-size: $text-sm !default;
12
13
  $drop-down-btn-icon-margin-right: 11px !default;
13
14
  $drop-down-btn-bigger-icon-margin-right: 12px !default;
14
15
  $drop-down-btn-li-border-width: 1px !default;
@@ -26,9 +27,12 @@ $drop-down-btn-ul-border-radius: 2px !default;
26
27
  $drop-down-btn-ul-padding: 0 0 !default;
27
28
  $drop-down-btn-ul-bigger-padding: 0 0 !default;
28
29
  $drop-down-btn-ul-small-padding: 0 0 !default;
29
- $drop-down-btn-caret-icon-font-size: $text-base !default;
30
- $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
- $drop-down-btn-caret-icon-font-size-bigger: $text-xl !default;
30
+ $drop-down-btn-caret-icon-font-size: $text-sm !default;
31
+ $drop-down-btn-small-caret-icon-font-size: $text-xs !default;
32
+ $drop-down-btn-icon-font-size-bigger: $text-xl !default;
33
+ $drop-down-btn-small-icon-font-size-bigger: $text-lg !default;
34
+ $drop-down-btn-caret-icon-font-size-bigger: $text-base !default;
35
+ $drop-down-btn-small-caret-icon-font-size-bigger: $text-sm !default;
32
36
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
37
  $drop-down-btn-popup-margin-top: 4px !default;
34
38
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -134,7 +138,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
134
138
  }
135
139
 
136
140
  & .e-btn-icon {
137
- @if $skin-name == 'tailwind3' {
141
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
138
142
  font-size: $drop-down-btn-small-icon-font-size;
139
143
  }
140
144
  }
@@ -143,6 +147,9 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
143
147
  @if $skin-name == 'fluent2' {
144
148
  font-size: 12px;
145
149
  }
150
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
151
+ font-size: $drop-down-btn-small-caret-icon-font-size;
152
+ }
146
153
  }
147
154
  }
148
155
  }
@@ -435,8 +442,13 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
435
442
  padding: $drop-down-btn-vertical-bigger-padding;
436
443
  }
437
444
  .e-btn-icon {
438
- @if $skin-name == 'tailwind3' {
439
- font-size: $drop-down-btn-icon-font-size-bigger;
445
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' {
446
+ font-size: $drop-down-btn-small-icon-font-size-bigger;
447
+ }
448
+ }
449
+ .e-btn-icon.e-caret {
450
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'fluent2' {
451
+ font-size: $drop-down-btn-small-caret-icon-font-size-bigger;
440
452
  }
441
453
  }
442
454
  }
@@ -8,7 +8,8 @@ $drop-down-btn-bigger-font-size: $text-base !default;
8
8
  $drop-down-btn-bigger-li-height: 40px !default;
9
9
  $drop-down-btn-bigger-max-width: 202px !default;
10
10
  $drop-down-btn-bigger-min-width: 112px !default;
11
- $drop-down-btn-icon-font-size: $text-sm !default;
11
+ $drop-down-btn-icon-font-size: $text-base !default;
12
+ $drop-down-btn-small-icon-font-size: $text-sm !default;
12
13
  $drop-down-btn-icon-margin-right: 11px !default;
13
14
  $drop-down-btn-bigger-icon-margin-right: 12px !default;
14
15
  $drop-down-btn-li-border-width: 1px !default;
@@ -26,9 +27,12 @@ $drop-down-btn-ul-border-radius: 2px !default;
26
27
  $drop-down-btn-ul-padding: 0 0 !default;
27
28
  $drop-down-btn-ul-bigger-padding: 0 0 !default;
28
29
  $drop-down-btn-ul-small-padding: 0 0 !default;
29
- $drop-down-btn-caret-icon-font-size: $text-base !default;
30
- $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
- $drop-down-btn-caret-icon-font-size-bigger: $text-xl !default;
30
+ $drop-down-btn-caret-icon-font-size: $text-sm !default;
31
+ $drop-down-btn-small-caret-icon-font-size: $text-xs !default;
32
+ $drop-down-btn-icon-font-size-bigger: $text-xl !default;
33
+ $drop-down-btn-small-icon-font-size-bigger: $text-lg !default;
34
+ $drop-down-btn-caret-icon-font-size-bigger: $text-base !default;
35
+ $drop-down-btn-small-caret-icon-font-size-bigger: $text-sm !default;
32
36
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
37
  $drop-down-btn-popup-margin-top: 4px !default;
34
38
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -134,7 +138,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
134
138
  }
135
139
 
136
140
  & .e-btn-icon {
137
- @if $skin-name == 'tailwind3' {
141
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
138
142
  font-size: $drop-down-btn-small-icon-font-size;
139
143
  }
140
144
  }
@@ -143,6 +147,9 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
143
147
  @if $skin-name == 'fluent2' {
144
148
  font-size: 12px;
145
149
  }
150
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
151
+ font-size: $drop-down-btn-small-caret-icon-font-size;
152
+ }
146
153
  }
147
154
  }
148
155
  }
@@ -8,7 +8,8 @@ $drop-down-btn-bigger-font-size: $text-base !default;
8
8
  $drop-down-btn-bigger-li-height: 40px !default;
9
9
  $drop-down-btn-bigger-max-width: 202px !default;
10
10
  $drop-down-btn-bigger-min-width: 112px !default;
11
- $drop-down-btn-icon-font-size: $text-sm !default;
11
+ $drop-down-btn-icon-font-size: $text-base !default;
12
+ $drop-down-btn-small-icon-font-size: $text-sm !default;
12
13
  $drop-down-btn-icon-margin-right: 11px !default;
13
14
  $drop-down-btn-bigger-icon-margin-right: 12px !default;
14
15
  $drop-down-btn-li-border-width: 1px !default;
@@ -26,9 +27,12 @@ $drop-down-btn-ul-border-radius: 2px !default;
26
27
  $drop-down-btn-ul-padding: 0 0 !default;
27
28
  $drop-down-btn-ul-bigger-padding: 0 0 !default;
28
29
  $drop-down-btn-ul-small-padding: 0 0 !default;
29
- $drop-down-btn-caret-icon-font-size: $text-base !default;
30
- $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
- $drop-down-btn-caret-icon-font-size-bigger: $text-xl !default;
30
+ $drop-down-btn-caret-icon-font-size: $text-sm !default;
31
+ $drop-down-btn-small-caret-icon-font-size: $text-xs !default;
32
+ $drop-down-btn-icon-font-size-bigger: $text-xl !default;
33
+ $drop-down-btn-small-icon-font-size-bigger: $text-lg !default;
34
+ $drop-down-btn-caret-icon-font-size-bigger: $text-base !default;
35
+ $drop-down-btn-small-caret-icon-font-size-bigger: $text-sm !default;
32
36
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
37
  $drop-down-btn-popup-margin-top: 4px !default;
34
38
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -134,7 +138,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
134
138
  }
135
139
 
136
140
  & .e-btn-icon {
137
- @if $skin-name == 'tailwind3' {
141
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
138
142
  font-size: $drop-down-btn-small-icon-font-size;
139
143
  }
140
144
  }
@@ -143,6 +147,9 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
143
147
  @if $skin-name == 'fluent2' {
144
148
  font-size: 12px;
145
149
  }
150
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
151
+ font-size: $drop-down-btn-small-caret-icon-font-size;
152
+ }
146
153
  }
147
154
  }
148
155
  }
@@ -435,8 +442,13 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
435
442
  padding: $drop-down-btn-vertical-bigger-padding;
436
443
  }
437
444
  .e-btn-icon {
438
- @if $skin-name == 'tailwind3' {
439
- font-size: $drop-down-btn-icon-font-size-bigger;
445
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' {
446
+ font-size: $drop-down-btn-small-icon-font-size-bigger;
447
+ }
448
+ }
449
+ .e-btn-icon.e-caret {
450
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'fluent2' {
451
+ font-size: $drop-down-btn-small-caret-icon-font-size-bigger;
440
452
  }
441
453
  }
442
454
  }
@@ -29,6 +29,7 @@ $drop-down-btn-ul-small-padding: 4px 0 !default;
29
29
  $drop-down-btn-caret-icon-font-size: $text-sm !default;
30
30
  $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
31
  $drop-down-btn-caret-icon-font-size-bigger: 16px !default;
32
+ $drop-down-btn-small-caret-icon-font-size-bigger: 14px !default;
32
33
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
34
  $drop-down-btn-popup-margin-top: 4px !default;
34
35
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -131,7 +132,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
131
132
  }
132
133
 
133
134
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
135
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
136
  font-size: $drop-down-btn-small-icon-font-size;
136
137
  }
137
138
  }
@@ -140,6 +141,9 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
140
141
  @if $skin-name == 'fluent2' {
141
142
  font-size: 12px;
142
143
  }
144
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
145
+ font-size: $drop-down-btn-small-caret-icon-font-size;
146
+ }
143
147
  }
144
148
  }
145
149
  }
@@ -29,6 +29,7 @@ $drop-down-btn-ul-small-padding: 4px 0 !default;
29
29
  $drop-down-btn-caret-icon-font-size: $text-sm !default;
30
30
  $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
31
  $drop-down-btn-caret-icon-font-size-bigger: 16px !default;
32
+ $drop-down-btn-small-caret-icon-font-size-bigger: 14px !default;
32
33
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
34
  $drop-down-btn-popup-margin-top: 4px !default;
34
35
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -131,7 +132,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
131
132
  }
132
133
 
133
134
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
135
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
136
  font-size: $drop-down-btn-small-icon-font-size;
136
137
  }
137
138
  }
@@ -140,6 +141,9 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
140
141
  @if $skin-name == 'fluent2' {
141
142
  font-size: 12px;
142
143
  }
144
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
145
+ font-size: $drop-down-btn-small-caret-icon-font-size;
146
+ }
143
147
  }
144
148
  }
145
149
  }
@@ -432,8 +436,13 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
432
436
  padding: $drop-down-btn-vertical-bigger-padding;
433
437
  }
434
438
  .e-btn-icon {
435
- @if $skin-name == 'tailwind3' {
436
- font-size: $drop-down-btn-icon-font-size-bigger;
439
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' {
440
+ font-size: $drop-down-btn-small-icon-font-size-bigger;
441
+ }
442
+ }
443
+ .e-btn-icon.e-caret {
444
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'fluent2' {
445
+ font-size: $drop-down-btn-small-caret-icon-font-size-bigger;
437
446
  }
438
447
  }
439
448
  }
@@ -29,6 +29,7 @@ $drop-down-btn-ul-small-padding: 4px 0 !default;
29
29
  $drop-down-btn-caret-icon-font-size: $text-sm !default;
30
30
  $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
31
  $drop-down-btn-caret-icon-font-size-bigger: 16px !default;
32
+ $drop-down-btn-small-caret-icon-font-size-bigger: 14px !default;
32
33
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
34
  $drop-down-btn-popup-margin-top: 4px !default;
34
35
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -131,7 +132,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
131
132
  }
132
133
 
133
134
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
135
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
136
  font-size: $drop-down-btn-small-icon-font-size;
136
137
  }
137
138
  }
@@ -140,6 +141,9 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
140
141
  @if $skin-name == 'fluent2' {
141
142
  font-size: 12px;
142
143
  }
144
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
145
+ font-size: $drop-down-btn-small-caret-icon-font-size;
146
+ }
143
147
  }
144
148
  }
145
149
  }
@@ -29,6 +29,7 @@ $drop-down-btn-ul-small-padding: 4px 0 !default;
29
29
  $drop-down-btn-caret-icon-font-size: $text-sm !default;
30
30
  $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
31
  $drop-down-btn-caret-icon-font-size-bigger: 16px !default;
32
+ $drop-down-btn-small-caret-icon-font-size-bigger: 14px !default;
32
33
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
34
  $drop-down-btn-popup-margin-top: 4px !default;
34
35
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -131,7 +132,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
131
132
  }
132
133
 
133
134
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
135
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
136
  font-size: $drop-down-btn-small-icon-font-size;
136
137
  }
137
138
  }
@@ -140,6 +141,9 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
140
141
  @if $skin-name == 'fluent2' {
141
142
  font-size: 12px;
142
143
  }
144
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
145
+ font-size: $drop-down-btn-small-caret-icon-font-size;
146
+ }
143
147
  }
144
148
  }
145
149
  }
@@ -432,8 +436,13 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
432
436
  padding: $drop-down-btn-vertical-bigger-padding;
433
437
  }
434
438
  .e-btn-icon {
435
- @if $skin-name == 'tailwind3' {
436
- font-size: $drop-down-btn-icon-font-size-bigger;
439
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' {
440
+ font-size: $drop-down-btn-small-icon-font-size-bigger;
441
+ }
442
+ }
443
+ .e-btn-icon.e-caret {
444
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'fluent2' {
445
+ font-size: $drop-down-btn-small-caret-icon-font-size-bigger;
437
446
  }
438
447
  }
439
448
  }
@@ -29,6 +29,7 @@ $drop-down-btn-ul-small-padding: 4px 0 !default;
29
29
  $drop-down-btn-caret-icon-font-size: $text-sm !default;
30
30
  $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
31
  $drop-down-btn-caret-icon-font-size-bigger: 16px !default;
32
+ $drop-down-btn-small-caret-icon-font-size-bigger: 14px !default;
32
33
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
34
  $drop-down-btn-popup-margin-top: 4px !default;
34
35
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -131,7 +132,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
131
132
  }
132
133
 
133
134
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
135
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
136
  font-size: $drop-down-btn-small-icon-font-size;
136
137
  }
137
138
  }
@@ -140,6 +141,9 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
140
141
  @if $skin-name == 'fluent2' {
141
142
  font-size: 12px;
142
143
  }
144
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
145
+ font-size: $drop-down-btn-small-caret-icon-font-size;
146
+ }
143
147
  }
144
148
  }
145
149
  }
@@ -29,6 +29,7 @@ $drop-down-btn-ul-small-padding: 4px 0 !default;
29
29
  $drop-down-btn-caret-icon-font-size: $text-sm !default;
30
30
  $drop-down-btn-icon-font-size-bigger: $text-base !default;
31
31
  $drop-down-btn-caret-icon-font-size-bigger: 16px !default;
32
+ $drop-down-btn-small-caret-icon-font-size-bigger: 14px !default;
32
33
  $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
33
34
  $drop-down-btn-popup-margin-top: 4px !default;
34
35
  $drop-down-btn-bigger-popup-margin-top: 4px !default;
@@ -131,7 +132,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
131
132
  }
132
133
 
133
134
  & .e-btn-icon {
134
- @if $skin-name == 'tailwind3' {
135
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
135
136
  font-size: $drop-down-btn-small-icon-font-size;
136
137
  }
137
138
  }
@@ -140,6 +141,9 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
140
141
  @if $skin-name == 'fluent2' {
141
142
  font-size: 12px;
142
143
  }
144
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
145
+ font-size: $drop-down-btn-small-caret-icon-font-size;
146
+ }
143
147
  }
144
148
  }
145
149
  }
@@ -432,8 +436,13 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
432
436
  padding: $drop-down-btn-vertical-bigger-padding;
433
437
  }
434
438
  .e-btn-icon {
435
- @if $skin-name == 'tailwind3' {
436
- font-size: $drop-down-btn-icon-font-size-bigger;
439
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'tailwind3' or $skin-name == 'Material3' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' {
440
+ font-size: $drop-down-btn-small-icon-font-size-bigger;
441
+ }
442
+ }
443
+ .e-btn-icon.e-caret {
444
+ @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'FluentUI' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5' or $skin-name == 'Material3' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' or $skin-name == 'bootstrap4' or $skin-name == 'highcontrast' or $skin-name == 'fluent2' {
445
+ font-size: $drop-down-btn-small-caret-icon-font-size-bigger;
437
446
  }
438
447
  }
439
448
  }