@syncfusion/ej2-dropdowns 29.2.11-81740 → 30.1.37

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 (314) hide show
  1. package/.eslintrc.json +263 -0
  2. package/{ReadMe.md → README.md} +217 -217
  3. package/dist/ej2-dropdowns.min.js +10 -0
  4. package/dist/ej2-dropdowns.umd.min.js +10 -1
  5. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es2015.js +90 -96
  7. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  8. package/dist/es6/ej2-dropdowns.es5.js +249 -256
  9. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  10. package/dist/global/ej2-dropdowns.min.js +11 -0
  11. package/dist/global/ej2-dropdowns.min.js.map +1 -0
  12. package/dist/global/index.d.ts +14 -0
  13. package/helpers/e2e/autocomplete.d.ts +16 -0
  14. package/helpers/e2e/autocomplete.js +60 -0
  15. package/helpers/e2e/combobox.d.ts +17 -0
  16. package/helpers/e2e/combobox.js +63 -0
  17. package/helpers/e2e/dropdownlist.d.ts +20 -0
  18. package/helpers/e2e/dropdownlist.js +72 -0
  19. package/helpers/e2e/index.d.ts +4 -0
  20. package/helpers/e2e/index.js +11 -0
  21. package/helpers/e2e/listboxHelper.d.ts +22 -0
  22. package/helpers/e2e/listboxHelper.js +56 -0
  23. package/helpers/e2e/multiselect.d.ts +31 -0
  24. package/helpers/e2e/multiselect.js +105 -0
  25. package/license +2 -2
  26. package/package.json +36 -36
  27. package/src/auto-complete/auto-complete-model.d.ts +190 -190
  28. package/src/auto-complete/auto-complete.d.ts +13 -13
  29. package/src/auto-complete/auto-complete.js +43 -43
  30. package/src/combo-box/combo-box-model.d.ts +232 -232
  31. package/src/combo-box/combo-box.d.ts +26 -26
  32. package/src/combo-box/combo-box.js +29 -29
  33. package/src/common/incremental-search.js +1 -1
  34. package/src/common/virtual-scroll.js +46 -46
  35. package/src/drop-down-base/drop-down-base-model.d.ts +205 -205
  36. package/src/drop-down-base/drop-down-base.d.ts +15 -15
  37. package/src/drop-down-base/drop-down-base.js +20 -20
  38. package/src/drop-down-list/drop-down-list-model.d.ts +310 -310
  39. package/src/drop-down-list/drop-down-list.d.ts +5 -5
  40. package/src/drop-down-list/drop-down-list.js +23 -22
  41. package/src/drop-down-tree/drop-down-tree-model.d.ts +493 -493
  42. package/src/drop-down-tree/drop-down-tree.d.ts +1 -1
  43. package/src/drop-down-tree/drop-down-tree.js +20 -20
  44. package/src/list-box/list-box-model.d.ts +237 -237
  45. package/src/list-box/list-box.d.ts +2 -2
  46. package/src/list-box/list-box.js +19 -19
  47. package/src/mention/mention-model.d.ts +272 -272
  48. package/src/mention/mention.d.ts +1 -2
  49. package/src/mention/mention.js +24 -23
  50. package/src/multi-select/multi-select-model.d.ts +564 -564
  51. package/src/multi-select/multi-select.d.ts +1 -1
  52. package/src/multi-select/multi-select.js +26 -35
  53. package/styles/auto-complete/_all.scss +1 -1
  54. package/styles/auto-complete/_bds-definition.scss +2 -2
  55. package/styles/auto-complete/_bootstrap-dark-definition.scss +3 -3
  56. package/styles/auto-complete/_bootstrap-definition.scss +2 -2
  57. package/styles/auto-complete/_bootstrap4-definition.scss +11 -11
  58. package/styles/auto-complete/_bootstrap5-definition.scss +2 -2
  59. package/styles/auto-complete/_bootstrap5.3-definition.scss +2 -2
  60. package/styles/auto-complete/_fabric-dark-definition.scss +2 -2
  61. package/styles/auto-complete/_fabric-definition.scss +2 -2
  62. package/styles/auto-complete/_fluent-definition.scss +2 -2
  63. package/styles/auto-complete/_fluent2-definition.scss +2 -2
  64. package/styles/auto-complete/_fusionnew-definition.scss +2 -2
  65. package/styles/auto-complete/_highcontrast-definition.scss +2 -2
  66. package/styles/auto-complete/_highcontrast-light-definition.scss +2 -2
  67. package/styles/auto-complete/_material-dark-definition.scss +2 -2
  68. package/styles/auto-complete/_material-definition.scss +2 -2
  69. package/styles/auto-complete/_material3-definition.scss +2 -2
  70. package/styles/auto-complete/_tailwind-definition.scss +2 -2
  71. package/styles/auto-complete/_tailwind3-definition.scss +2 -2
  72. package/styles/auto-complete/material3-dark.scss +1 -1
  73. package/styles/auto-complete/material3.scss +1 -1
  74. package/styles/combo-box/_all.scss +1 -1
  75. package/styles/combo-box/_bds-definition.scss +2 -2
  76. package/styles/combo-box/_bootstrap-dark-definition.scss +2 -2
  77. package/styles/combo-box/_bootstrap-definition.scss +2 -2
  78. package/styles/combo-box/_bootstrap4-definition.scss +11 -11
  79. package/styles/combo-box/_bootstrap5-definition.scss +2 -2
  80. package/styles/combo-box/_bootstrap5.3-definition.scss +2 -2
  81. package/styles/combo-box/_fabric-dark-definition.scss +2 -2
  82. package/styles/combo-box/_fabric-definition.scss +2 -2
  83. package/styles/combo-box/_fluent-definition.scss +2 -2
  84. package/styles/combo-box/_fluent2-definition.scss +2 -2
  85. package/styles/combo-box/_fusionnew-definition.scss +2 -2
  86. package/styles/combo-box/_highcontrast-definition.scss +2 -2
  87. package/styles/combo-box/_highcontrast-light-definition.scss +3 -3
  88. package/styles/combo-box/_material-dark-definition.scss +2 -2
  89. package/styles/combo-box/_material-definition.scss +2 -2
  90. package/styles/combo-box/_material3-definition.scss +2 -2
  91. package/styles/combo-box/_tailwind-definition.scss +2 -2
  92. package/styles/combo-box/_tailwind3-definition.scss +2 -2
  93. package/styles/combo-box/material3-dark.scss +1 -1
  94. package/styles/combo-box/material3.scss +1 -1
  95. package/styles/drop-down-base/_all.scss +2 -2
  96. package/styles/drop-down-base/_bds-definition.scss +112 -112
  97. package/styles/drop-down-base/_bigger.scss +198 -198
  98. package/styles/drop-down-base/_bootstrap-dark-definition.scss +80 -80
  99. package/styles/drop-down-base/_bootstrap-definition.scss +78 -78
  100. package/styles/drop-down-base/_bootstrap4-definition.scss +83 -83
  101. package/styles/drop-down-base/_bootstrap5-definition.scss +98 -98
  102. package/styles/drop-down-base/_bootstrap5.3-definition.scss +98 -98
  103. package/styles/drop-down-base/_definition.scss +23 -23
  104. package/styles/drop-down-base/_fabric-dark-definition.scss +81 -81
  105. package/styles/drop-down-base/_fabric-definition.scss +79 -79
  106. package/styles/drop-down-base/_fluent-definition.scss +102 -102
  107. package/styles/drop-down-base/_fluent2-definition.scss +113 -113
  108. package/styles/drop-down-base/_fusionnew-definition.scss +98 -98
  109. package/styles/drop-down-base/_highcontrast-definition.scss +96 -96
  110. package/styles/drop-down-base/_highcontrast-light-definition.scss +96 -96
  111. package/styles/drop-down-base/_layout.scss +148 -148
  112. package/styles/drop-down-base/_material-dark-definition.scss +82 -82
  113. package/styles/drop-down-base/_material-definition.scss +81 -81
  114. package/styles/drop-down-base/_material3-definition.scss +73 -73
  115. package/styles/drop-down-base/_tailwind-definition.scss +107 -107
  116. package/styles/drop-down-base/_tailwind3-definition.scss +98 -98
  117. package/styles/drop-down-base/_theme.scss +303 -303
  118. package/styles/drop-down-base/material3-dark.scss +1 -1
  119. package/styles/drop-down-base/material3.scss +1 -1
  120. package/styles/drop-down-list/_all.scss +3 -3
  121. package/styles/drop-down-list/_bds-definition.scss +100 -100
  122. package/styles/drop-down-list/_bigger.scss +713 -713
  123. package/styles/drop-down-list/_bootstrap-dark-definition.scss +94 -94
  124. package/styles/drop-down-list/_bootstrap-definition.scss +93 -93
  125. package/styles/drop-down-list/_bootstrap4-definition.scss +122 -122
  126. package/styles/drop-down-list/_bootstrap5-definition.scss +135 -135
  127. package/styles/drop-down-list/_bootstrap5.3-definition.scss +136 -136
  128. package/styles/drop-down-list/_fabric-dark-definition.scss +72 -72
  129. package/styles/drop-down-list/_fabric-definition.scss +69 -69
  130. package/styles/drop-down-list/_fluent-definition.scss +128 -128
  131. package/styles/drop-down-list/_fluent2-definition.scss +101 -101
  132. package/styles/drop-down-list/_fusionnew-definition.scss +134 -134
  133. package/styles/drop-down-list/_highcontrast-definition.scss +83 -83
  134. package/styles/drop-down-list/_highcontrast-light-definition.scss +85 -85
  135. package/styles/drop-down-list/_layout.scss +284 -284
  136. package/styles/drop-down-list/_material-dark-definition.scss +110 -110
  137. package/styles/drop-down-list/_material-definition.scss +112 -112
  138. package/styles/drop-down-list/_material3-definition.scss +114 -114
  139. package/styles/drop-down-list/_tailwind-definition.scss +100 -100
  140. package/styles/drop-down-list/_tailwind3-definition.scss +135 -135
  141. package/styles/drop-down-list/_theme.scss +17 -17
  142. package/styles/drop-down-list/icons/_bds.scss +14 -14
  143. package/styles/drop-down-list/icons/_bootstrap-dark.scss +18 -18
  144. package/styles/drop-down-list/icons/_bootstrap.scss +18 -18
  145. package/styles/drop-down-list/icons/_bootstrap4.scss +18 -18
  146. package/styles/drop-down-list/icons/_bootstrap5.3.scss +18 -18
  147. package/styles/drop-down-list/icons/_bootstrap5.scss +18 -18
  148. package/styles/drop-down-list/icons/_fabric-dark.scss +18 -18
  149. package/styles/drop-down-list/icons/_fabric.scss +18 -18
  150. package/styles/drop-down-list/icons/_fluent.scss +18 -18
  151. package/styles/drop-down-list/icons/_fluent2.scss +18 -18
  152. package/styles/drop-down-list/icons/_fusionnew.scss +14 -14
  153. package/styles/drop-down-list/icons/_highcontrast-light.scss +14 -14
  154. package/styles/drop-down-list/icons/_highcontrast.scss +18 -18
  155. package/styles/drop-down-list/icons/_material-dark.scss +18 -18
  156. package/styles/drop-down-list/icons/_material.scss +18 -18
  157. package/styles/drop-down-list/icons/_material3.scss +18 -18
  158. package/styles/drop-down-list/icons/_tailwind.scss +18 -18
  159. package/styles/drop-down-list/icons/_tailwind3.scss +14 -14
  160. package/styles/drop-down-list/material3-dark.scss +1 -1
  161. package/styles/drop-down-list/material3.scss +1 -1
  162. package/styles/drop-down-tree/_all.scss +2 -2
  163. package/styles/drop-down-tree/_bds-definition.scss +74 -74
  164. package/styles/drop-down-tree/_bigger.scss +561 -561
  165. package/styles/drop-down-tree/_bootstrap-dark-definition.scss +81 -81
  166. package/styles/drop-down-tree/_bootstrap-definition.scss +81 -81
  167. package/styles/drop-down-tree/_bootstrap4-definition.scss +85 -85
  168. package/styles/drop-down-tree/_bootstrap5-definition.scss +73 -73
  169. package/styles/drop-down-tree/_bootstrap5.3-definition.scss +74 -74
  170. package/styles/drop-down-tree/_fabric-dark-definition.scss +81 -81
  171. package/styles/drop-down-tree/_fabric-definition.scss +81 -81
  172. package/styles/drop-down-tree/_fluent-definition.scss +78 -78
  173. package/styles/drop-down-tree/_fluent2-definition.scss +85 -85
  174. package/styles/drop-down-tree/_fusionnew-definition.scss +69 -69
  175. package/styles/drop-down-tree/_highcontrast-definition.scss +81 -81
  176. package/styles/drop-down-tree/_highcontrast-light-definition.scss +81 -81
  177. package/styles/drop-down-tree/_layout.scss +942 -942
  178. package/styles/drop-down-tree/_material-dark-definition.scss +82 -82
  179. package/styles/drop-down-tree/_material-definition.scss +84 -84
  180. package/styles/drop-down-tree/_material3-definition.scss +84 -84
  181. package/styles/drop-down-tree/_tailwind-definition.scss +74 -74
  182. package/styles/drop-down-tree/_tailwind3-definition.scss +75 -75
  183. package/styles/drop-down-tree/_theme.scss +135 -135
  184. package/styles/drop-down-tree/icons/_bds.scss +11 -11
  185. package/styles/drop-down-tree/icons/_bootstrap-dark.scss +11 -11
  186. package/styles/drop-down-tree/icons/_bootstrap.scss +11 -11
  187. package/styles/drop-down-tree/icons/_bootstrap4.scss +11 -11
  188. package/styles/drop-down-tree/icons/_bootstrap5.3.scss +11 -11
  189. package/styles/drop-down-tree/icons/_bootstrap5.scss +11 -11
  190. package/styles/drop-down-tree/icons/_fabric-dark.scss +11 -11
  191. package/styles/drop-down-tree/icons/_fabric.scss +11 -11
  192. package/styles/drop-down-tree/icons/_fluent.scss +11 -11
  193. package/styles/drop-down-tree/icons/_fluent2.scss +14 -14
  194. package/styles/drop-down-tree/icons/_fusionnew.scss +11 -11
  195. package/styles/drop-down-tree/icons/_highcontrast-light.scss +11 -11
  196. package/styles/drop-down-tree/icons/_highcontrast.scss +11 -11
  197. package/styles/drop-down-tree/icons/_material-dark.scss +11 -11
  198. package/styles/drop-down-tree/icons/_material.scss +11 -11
  199. package/styles/drop-down-tree/icons/_material3.scss +11 -11
  200. package/styles/drop-down-tree/icons/_tailwind-dark.scss +11 -11
  201. package/styles/drop-down-tree/icons/_tailwind.scss +11 -11
  202. package/styles/drop-down-tree/icons/_tailwind3.scss +11 -11
  203. package/styles/drop-down-tree/material3-dark.scss +1 -1
  204. package/styles/drop-down-tree/material3.scss +1 -1
  205. package/styles/list-box/_all.scss +2 -2
  206. package/styles/list-box/_bds-definition.scss +136 -136
  207. package/styles/list-box/_bigger.scss +190 -190
  208. package/styles/list-box/_bootstrap-dark-definition.scss +126 -126
  209. package/styles/list-box/_bootstrap-definition.scss +119 -119
  210. package/styles/list-box/_bootstrap4-definition.scss +126 -126
  211. package/styles/list-box/_bootstrap5-definition.scss +121 -121
  212. package/styles/list-box/_bootstrap5.3-definition.scss +123 -123
  213. package/styles/list-box/_fabric-dark-definition.scss +124 -124
  214. package/styles/list-box/_fabric-definition.scss +119 -119
  215. package/styles/list-box/_fluent-definition.scss +120 -120
  216. package/styles/list-box/_fluent2-definition.scss +121 -121
  217. package/styles/list-box/_fusionnew-definition.scss +111 -111
  218. package/styles/list-box/_highcontrast-definition.scss +119 -119
  219. package/styles/list-box/_highcontrast-light-definition.scss +124 -124
  220. package/styles/list-box/_layout.scss +496 -496
  221. package/styles/list-box/_material-dark-definition.scss +124 -124
  222. package/styles/list-box/_material-definition.scss +119 -119
  223. package/styles/list-box/_material3-definition.scss +119 -119
  224. package/styles/list-box/_tailwind-definition.scss +119 -119
  225. package/styles/list-box/_tailwind3-definition.scss +123 -123
  226. package/styles/list-box/_theme.scss +327 -327
  227. package/styles/list-box/icons/_bds.scss +25 -25
  228. package/styles/list-box/icons/_bootstrap-dark.scss +25 -25
  229. package/styles/list-box/icons/_bootstrap.scss +25 -25
  230. package/styles/list-box/icons/_bootstrap4.scss +25 -25
  231. package/styles/list-box/icons/_bootstrap5.3.scss +25 -25
  232. package/styles/list-box/icons/_bootstrap5.scss +25 -25
  233. package/styles/list-box/icons/_fabric-dark.scss +25 -25
  234. package/styles/list-box/icons/_fabric.scss +25 -25
  235. package/styles/list-box/icons/_fluent.scss +25 -25
  236. package/styles/list-box/icons/_fluent2.scss +25 -25
  237. package/styles/list-box/icons/_fusionnew.scss +25 -25
  238. package/styles/list-box/icons/_highcontrast-light.scss +25 -25
  239. package/styles/list-box/icons/_highcontrast.scss +25 -25
  240. package/styles/list-box/icons/_material-dark.scss +25 -25
  241. package/styles/list-box/icons/_material.scss +25 -25
  242. package/styles/list-box/icons/_material3.scss +25 -25
  243. package/styles/list-box/icons/_tailwind-dark.scss +25 -25
  244. package/styles/list-box/icons/_tailwind.scss +25 -25
  245. package/styles/list-box/icons/_tailwind3.scss +25 -25
  246. package/styles/list-box/material3-dark.scss +1 -1
  247. package/styles/list-box/material3.scss +1 -1
  248. package/styles/material3-dark.scss +1 -1
  249. package/styles/material3.scss +1 -1
  250. package/styles/mention/_all.scss +1 -1
  251. package/styles/mention/_bds-definition.scss +1 -1
  252. package/styles/mention/_bootstrap-dark-definition.scss +3 -3
  253. package/styles/mention/_bootstrap-definition.scss +3 -3
  254. package/styles/mention/_bootstrap4-definition.scss +3 -3
  255. package/styles/mention/_bootstrap5-definition.scss +1 -1
  256. package/styles/mention/_bootstrap5.3-definition.scss +1 -1
  257. package/styles/mention/_fabric-dark-definition.scss +2 -2
  258. package/styles/mention/_fabric-definition.scss +3 -3
  259. package/styles/mention/_fluent-definition.scss +1 -1
  260. package/styles/mention/_fluent2-definition.scss +1 -1
  261. package/styles/mention/_fusionnew-definition.scss +1 -1
  262. package/styles/mention/_highcontrast-definition.scss +3 -3
  263. package/styles/mention/_highcontrast-light-definition.scss +3 -3
  264. package/styles/mention/_layout.scss +6 -6
  265. package/styles/mention/_material-dark-definition.scss +3 -3
  266. package/styles/mention/_material-definition.scss +3 -3
  267. package/styles/mention/_material3-definition.scss +1 -1
  268. package/styles/mention/_tailwind-definition.scss +1 -1
  269. package/styles/mention/_tailwind3-definition.scss +1 -1
  270. package/styles/mention/material3-dark.scss +1 -1
  271. package/styles/mention/material3.scss +1 -1
  272. package/styles/multi-select/_all.scss +2 -2
  273. package/styles/multi-select/_bds-definition.scss +231 -231
  274. package/styles/multi-select/_bigger.scss +2002 -2002
  275. package/styles/multi-select/_bootstrap-dark-definition.scss +198 -198
  276. package/styles/multi-select/_bootstrap-definition.scss +187 -187
  277. package/styles/multi-select/_bootstrap4-definition.scss +236 -236
  278. package/styles/multi-select/_bootstrap5-definition.scss +229 -229
  279. package/styles/multi-select/_bootstrap5.3-definition.scss +229 -229
  280. package/styles/multi-select/_fabric-dark-definition.scss +190 -190
  281. package/styles/multi-select/_fabric-definition.scss +181 -181
  282. package/styles/multi-select/_fluent-definition.scss +236 -236
  283. package/styles/multi-select/_fluent2-definition.scss +234 -234
  284. package/styles/multi-select/_fusionnew-definition.scss +222 -222
  285. package/styles/multi-select/_highcontrast-definition.scss +302 -302
  286. package/styles/multi-select/_highcontrast-light-definition.scss +296 -296
  287. package/styles/multi-select/_layout.scss +1335 -1335
  288. package/styles/multi-select/_material-dark-definition.scss +248 -248
  289. package/styles/multi-select/_material-definition.scss +250 -250
  290. package/styles/multi-select/_material3-definition.scss +233 -233
  291. package/styles/multi-select/_tailwind-definition.scss +231 -231
  292. package/styles/multi-select/_tailwind3-definition.scss +227 -227
  293. package/styles/multi-select/_theme.scss +564 -564
  294. package/styles/multi-select/icons/_bds.scss +26 -26
  295. package/styles/multi-select/icons/_bootstrap-dark.scss +30 -30
  296. package/styles/multi-select/icons/_bootstrap.scss +30 -30
  297. package/styles/multi-select/icons/_bootstrap4.scss +32 -32
  298. package/styles/multi-select/icons/_bootstrap5.3.scss +30 -30
  299. package/styles/multi-select/icons/_bootstrap5.scss +30 -30
  300. package/styles/multi-select/icons/_fabric-dark.scss +30 -30
  301. package/styles/multi-select/icons/_fabric.scss +30 -30
  302. package/styles/multi-select/icons/_fluent.scss +38 -38
  303. package/styles/multi-select/icons/_fluent2.scss +347 -347
  304. package/styles/multi-select/icons/_fusionnew.scss +26 -26
  305. package/styles/multi-select/icons/_highcontrast-light.scss +26 -26
  306. package/styles/multi-select/icons/_highcontrast.scss +30 -30
  307. package/styles/multi-select/icons/_material-dark.scss +348 -348
  308. package/styles/multi-select/icons/_material.scss +348 -348
  309. package/styles/multi-select/icons/_material3.scss +350 -350
  310. package/styles/multi-select/icons/_tailwind.scss +30 -30
  311. package/styles/multi-select/icons/_tailwind3.scss +26 -26
  312. package/styles/multi-select/material3-dark.scss +1 -1
  313. package/styles/multi-select/material3.scss +1 -1
  314. package/tslint.json +111 -0
@@ -1,1335 +1,1335 @@
1
- .e-multi-select-wrapper {
2
- box-sizing: border-box;
3
- cursor: text;
4
- line-height: normal;
5
- min-height: $ddl-control-height;
6
- padding: $ddl-control-placholder-padding;
7
- position: relative;
8
- user-select: none;
9
- width: 100%;
10
-
11
- #{if(&, '&', '*')}.e-delimiter {
12
- #{if(&, '&', '*')} .e-searcher,
13
- #{if(&, '&', '*')} .e-multi-searcher {
14
- height: 27px;
15
- vertical-align: middle;
16
- #{if(&, '&', '*')} .e-dropdownbase {
17
- height: 100%;
18
- min-height: 100%;
19
- }
20
- }
21
- }
22
-
23
- .e-delim-view {
24
- white-space: nowrap;
25
-
26
- #{if(&, '&', '*')}.e-delim-values.e-delim-overflow,
27
- #{if(&, '&', '*')}.e-delim-values.e-delim-total {
28
- box-sizing: border-box;
29
- display: inline-block;
30
- overflow: hidden;
31
- text-overflow: ellipsis;
32
- @if $ddl-multiselect-skin-name == 'tailwind' {
33
- padding: 0;
34
- }
35
- }
36
- }
37
-
38
- .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
39
- color: $ddl-chip-mobile-font;
40
- font-size: $ddl-chip-close-font;
41
- left: $ddl-sel-chip-close-mobile-left;
42
- top: $ddl-sel-chip-close-mobile-top;
43
- }
44
-
45
- .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
46
- @if $ddl-multiselect-skin-name == 'Material3' {
47
- background: $ddl-chip-mobile-bg;
48
- }
49
- @if $ddl-multiselect-skin-name != 'Material3' {
50
- background-color: $ddl-chip-mobile-bg;
51
- }
52
- color: $ddl-chip-mobile-font;
53
- padding: $ddl-chip-selected-padding;
54
- }
55
-
56
- .e-searcher.e-zero-size:not(.e-multiselect-box),
57
- .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
58
- width: 0;
59
-
60
- input[type = 'text'] {
61
- height: 1px;
62
- min-height: 1px;
63
- }
64
- }
65
-
66
- .e-chips.e-mob-chip > .e-chipcontent {
67
- max-width: 100%;
68
- }
69
- }
70
-
71
- .e-multiselect.e-control-container,
72
- .e-multiselect.e-control-container.e-input-group {
73
- .e-multi-select-wrapper .e-multi-searcher {
74
- display: flex;
75
- float: left;
76
- width: auto;
77
- }
78
-
79
- .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
80
- display: inline-flex;
81
- float: none;
82
- }
83
-
84
- .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
85
- width: 0;
86
- }
87
-
88
- .e-multi-select-wrapper .e-delim-values.e-delim-hide,
89
- .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-hide,
90
- .e-multi-select-wrapper .e-chips-collection.e-delim-hide {
91
- display: none;
92
- }
93
-
94
- .e-multi-select-wrapper.e-down-icon {
95
- @if $ddl-multiselect-skin-name != 'fluent2' {
96
- padding: 0 48px 0 0;
97
- }
98
- }
99
-
100
- .e-multi-select-wrapper .e-delim-values {
101
- align-items: center;
102
- display: inline;
103
- max-width: 100%;
104
- word-break: break-word;
105
- }
106
-
107
- .e-multi-select-wrapper .e-clear-icon,
108
- .e-multi-select-wrapper .e-ddl-icon {
109
- align-items: center;
110
- cursor: pointer;
111
- display: none;
112
- flex-direction: row;
113
- margin-top: $ddl-clear-margin-top;
114
- @if $ddl-multiselect-skin-name == 'tailwind' {
115
- margin-top: -1.55em;
116
- }
117
- outline: 0;
118
- padding: 0;
119
- position: absolute;
120
- right: $ddl-chip-hooker-right;
121
- top: $ddl-closer-hooker-top;
122
- @if $ddl-multiselect-skin-name == 'FluentUI' {
123
- right: $ddl-clear-icon-right;
124
- top: $ddl-clear-icon-top;
125
- }
126
- }
127
-
128
- :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
129
- .e-multi-select-wrapper .e-ddl-icon {
130
- display: flex;
131
- }
132
-
133
- .e-multi-select-wrapper .e-ddl-icon {
134
- margin-right: 0;
135
- margin-top: $ddl-icon-margin-top;
136
- right: 0;
137
- @if $ddl-multiselect-skin-name == 'fluent2' {
138
- padding: 9px;
139
- }
140
- @if $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'tailwind-dark'{
141
- min-width: 30px;
142
- }
143
- }
144
-
145
- .e-multi-select-wrapper.e-delimiter {
146
- @if $ddl-multiselect-skin-name != 'FluentUI' {
147
- top: -1px;
148
- }
149
- }
150
-
151
- .e-multi-select-wrapper .e-clear-icon {
152
- font-size: $ddl-closer-hooker-font;
153
- @if $ddl-multiselect-skin-name != 'bootstrap' {
154
- height: $ddl-chip-hooker-square;
155
- width: $ddl-chip-hooker-square;
156
- }
157
- }
158
- }
159
-
160
- .e-multiselect.e-control-container.e-rtl,
161
- .e-multiselect.e-control-container.e-input-group.e-rtl {
162
- .e-multi-select-wrapper .e-multi-searcher {
163
- float: right;
164
- }
165
- .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
166
- float: none;
167
- }
168
-
169
- .e-multi-select-wrapper .e-clear-icon,
170
- .e-multi-select-wrapper .e-ddl-icon {
171
- left: 0;
172
- right: auto;
173
- }
174
-
175
- .e-multi-select-wrapper.e-down-icon {
176
- padding: 0 0 0 48px;
177
- }
178
- }
179
-
180
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-disabled,
181
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disabled {
182
- opacity: .7;
183
- pointer-events: none;
184
- }
185
-
186
- .e-multiselect.e-input-group,
187
- .e-multiselect.e-float-input {
188
- word-wrap: initial;
189
- }
190
-
191
- .e-multiselect.e-input-group .e-searcher .e-label-top,
192
- .e-multiselect.e-input-group .e-multi-searcher .e-label-top {
193
- top: $ddl-multiselect-label-position;
194
- }
195
-
196
- .e-multi-select-wrapper.e-close-icon-hide {
197
- padding-right: 0;
198
- }
199
-
200
- .e-multi-select-wrapper .e-chips-collection {
201
- cursor: default;
202
- display: block;
203
- }
204
-
205
- .e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
206
- margin-right: 30px;
207
- }
208
-
209
- .e-multi-select-wrapper .e-multi-hidden {
210
- border: 0;
211
- height: 0;
212
- position: absolute;
213
- visibility: hidden;
214
- width: 0;
215
- }
216
-
217
- .e-multi-select-wrapper .e-chips {
218
- align-items: center;
219
- display: inline-flex;
220
- float: left;
221
- margin: $ddl-chip-margin;
222
- max-width: 100%;
223
- overflow: hidden;
224
- padding: $ddl-chip-padding;
225
- text-overflow: ellipsis;
226
- white-space: nowrap;
227
- }
228
-
229
- .e-multi-select-wrapper .e-chips > .e-chipcontent {
230
- max-width: 100%;
231
- overflow: hidden;
232
- padding: $ddl-chip-content-padding;
233
- text-indent: 0;
234
- text-overflow: ellipsis;
235
- white-space: nowrap;
236
- @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
237
- line-height: 1.5;
238
- }
239
- }
240
-
241
- .e-small .e-multi-select-wrapper .e-chips {
242
- @if $ddl-multiselect-skin-name == 'highcontrast' {
243
- margin: $ddl-chip-small-margin;
244
- #{if(&, '&', '*')} > .e-chipcontent {
245
- padding: $ddl-chip-small-content-padding;
246
- }
247
- }
248
- }
249
-
250
- .e-multi-select-wrapper.e-delimiter {
251
- .e-searcher {
252
- display: inline-block;
253
- float: none;
254
- }
255
- }
256
-
257
- .e-multi-select-wrapper .e-mob-chip.e-chips > .e-chipcontent {
258
- padding: $ddl-chip-mobile-content-padding;
259
- }
260
-
261
- #{&}.e-multiselect.e-rtl .e-multi-select-wrapper .e-mob-chip.e-chips>.e-chipcontent {
262
- padding: $ddl-rtl-chip-mobile-content-padding;
263
- }
264
-
265
- .e-multi-select-wrapper .e-chips-close {
266
- align-self: center;
267
- display: flex;
268
- float: right;
269
- font-family: 'e-icons';
270
- height: $ddl-chip-close-square;
271
- margin: $ddl-chip-close-margin;
272
- width: $ddl-chip-close-width;
273
- }
274
-
275
- .e-rtl .e-multi-select-wrapper .e-chips-close {
276
- margin: $ddl-chip-close-rtl-margin;
277
- }
278
-
279
- .e-multi-select-wrapper .e-mob-chip.e-chips .e-chips-close {
280
- margin: $ddl-chip-mobile-close-margin;
281
- }
282
-
283
- .e-multi-select-wrapper .e-chips-close.e-close-hooker {
284
- cursor: default;
285
- font-size: $ddl-closer-hooker-font;
286
- height: $ddl-chip-hooker-square;
287
- margin-top: $ddl-closer-margin-top;
288
- position: absolute;
289
- right: $ddl-chip-hooker-right;
290
- width: $ddl-chip-hooker-width;
291
- @if $ddl-multiselect-skin-name != 'Material3' {
292
- top: $ddl-closer-hooker-top;
293
- }
294
- @else {
295
- top: $ddl-closer-hooker-top-margin;
296
- border-radius: $ddl-closer-hooker-font;
297
- }
298
- }
299
-
300
- .e-multiselect .e-chips-close.e-close-hooker:hover {
301
- @if $ddl-multiselect-skin-name == 'Material3' {
302
- background: $ddl-bigger-closer-hooker-bg-color;
303
- border: 1px;
304
- }
305
- }
306
-
307
- .e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
308
- .e-small.e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
309
- .e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
310
- right: $ddl-close-icon-left;
311
- }
312
-
313
- .e-small.e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
314
- .e-small.e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
315
- .e-small.e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
316
- @if $ddl-multiselect-skin-name == 'FluentUI' {
317
- font-size: $ddl-closer-hooker-font-small;
318
- }
319
- @if $ddl-multiselect-skin-name == 'Material3' {
320
- right: 30px;
321
- }
322
- }
323
-
324
- .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
325
- .e-multiselect .e-down-icon .e-chips-close.e-close-hooker {
326
- @if $ddl-multiselect-skin-name == 'FluentUI' {
327
- font-size: $ddl-chip-close-font;
328
- }
329
- }
330
-
331
- .e-multiselect.e-input-group.e-control-container.e-rtl .e-multi-select-wrapper.e-down-icon .e-clear-icon {
332
- left: $ddl-close-icon-left;
333
- right: auto;
334
- }
335
-
336
- .e-small .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips-close.e-close-hooker,
337
- .e-small.e-multiselect.e-rtl .e-multi-select-wrapper .e-chips-close.e-close-hooker {
338
- @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
339
- left: 12px;
340
- right: auto;
341
- }
342
- }
343
-
344
- .e-multi-select-wrapper input[type = 'text'] {
345
- background: none;
346
- border: 0;
347
- font-family: $ddl-chip-font-family;
348
- font-size: $ddl-chip-font-size;
349
- font-weight: normal;
350
- height: $ddl-input-height;
351
- min-height: $ddl-input-height;
352
- outline: none;
353
- @if $ddl-multiselect-skin-name == 'Material3' {
354
- padding: 0;
355
- }
356
- @else {
357
- padding: $ddl-input-placeholder-padding;
358
- }
359
- text-indent: 0;
360
- }
361
-
362
- .e-multiselect.e-filled .e-multi-select-wrapper input[type = 'text'] {
363
- background: none;
364
- border: 0;
365
- color: inherit;
366
- font-family: $ddl-chip-font-family;
367
- font-size: $ddl-delim-font-size;
368
- font-weight: normal;
369
- height: $ddl-input-height;
370
- min-height: $ddl-input-height;
371
- outline: none;
372
- padding: 0;
373
- text-indent: $ddl-input-text-indent;
374
- }
375
-
376
- .e-rtl.e-multiselect.e-filled .e-multi-select-wrapper input[type = 'text'] {
377
- padding: 5px;
378
- }
379
-
380
- /* stylelint-disable property-no-vendor-prefix */
381
- .e-multi-select-wrapper input[type = 'text']::-ms-clear {
382
- display: none;
383
- }
384
-
385
- .e-multi-select-wrapper .e-searcher {
386
- display: block;
387
- float: left;
388
- width: auto;
389
- }
390
-
391
- .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
392
- width: $ddl-search-wrapper-width;
393
- }
394
-
395
- .e-small .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width,
396
- .e-small.e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
397
- width: $ddl-small-search-wrapper-width;
398
- }
399
-
400
- .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
401
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
402
- width: $ddl-search-wrapper-width;
403
- }
404
- }
405
-
406
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width,
407
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
408
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
409
- width: $ddl-small-search-wrapper-width;
410
- }
411
- }
412
-
413
- .e-multi-select-wrapper .e-delim-values {
414
- @if $ddl-multiselect-skin-name == 'tailwind' {
415
- font-family: $multi-select-delim-font-family;
416
- }
417
- @else {
418
- font-family: $ddl-chip-font-family;
419
- }
420
- font-size: $ddl-delim-font-size;
421
- line-height: $ddl-delimviewheight;
422
- max-width: 100%;
423
- padding-left: $ddl-delim-text-indent;
424
- padding-right: $ddl-delim-text-padding-right;
425
- vertical-align: middle;
426
- }
427
-
428
- .e-small .e-multi-select-wrapper .e-delim-values .e-remain {
429
- @if $ddl-multiselect-skin-name == 'tailwind' {
430
- font-size: $ddl-chip-small-font-size;
431
- }
432
- }
433
-
434
- .e-multi-select-list-wrapper .e-hide-listitem,
435
- .e-multi-select-list-wrapper .e-hide-group-header {
436
- display: none;
437
- }
438
-
439
- .e-multi-select-wrapper .e-delim-values .e-remain {
440
- color: $ddl-remains-font-color;
441
- cursor: pointer;
442
- display: inline-block;
443
- font-size: $ddl-chip-font-size;
444
- padding-left: $ddl-remains-padding-left;
445
- }
446
-
447
- #{&}.e-multiselect.e-disabled .e-multi-select-wrapper,
448
- #{&}.e-multiselect.e-disabled .e-multi-select-wrapper .e-chips .e-chips-close::before {
449
- cursor: not-allowed;
450
- }
451
-
452
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
453
- height: $ddl-chip-sel-mobile-height;
454
- left: $ddl-chip-mob-left;
455
- margin: $ddl-chip-sel-mobile-close-margin;
456
- margin-left: auto;
457
- position: relative;
458
- top: $ddl-chip-close-mob-top;
459
- width: $ddl-chip-sel-mobile-height;
460
- }
461
-
462
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
463
- align-self: center;
464
- box-shadow: $ddl-chip-selected-shadow-value;
465
- display: inline-flex;
466
- padding: $ddl-chip-mob-padding;
467
- width: 92%;
468
- }
469
-
470
- .e-multi-select-wrapper .e-ddl-disable-icon::before {
471
- content: '';
472
- }
473
-
474
- #{&}.e-multiselect.e-rtl .e-multi-select-wrapper.e-delimiter {
475
- .e-searcher {
476
- float: none;
477
- }
478
- }
479
-
480
- #{&}.e-multiselect.e-rtl {
481
- .e-multi-select-wrapper.e-close-icon-hide {
482
- padding-left: 0;
483
- }
484
-
485
- .e-multi-select-wrapper {
486
- padding: $ddl-rtl-wrapper;
487
-
488
- .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
489
- left: $ddl-rtl-chip-sel-close-left;
490
- }
491
-
492
- .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
493
- margin: 0;
494
- margin-right: auto;
495
- }
496
-
497
- .e-searcher {
498
- float: right;
499
- }
500
-
501
- .e-chips {
502
- float: right;
503
- margin: $ddl-rtl-mob-chip-content-margin;
504
- padding: $ddl-rtl-chip-padding;
505
-
506
- .e-chipcontent {
507
- padding: $ddl-rtl-chip-content-padding;
508
- }
509
-
510
- .e-chips-close {
511
- float: left;
512
- }
513
-
514
- .e-chips-close::before {
515
- left: $ddl-rtl-chip-close-left;
516
- }
517
- }
518
-
519
- .e-chips.e-mob-chip {
520
- padding: $ddl-rtl-mob-chip-padding;
521
-
522
- .e-chipcontent {
523
- padding: $ddl-rtl-mob-chip-content-padding;
524
- }
525
- }
526
-
527
- .e-chips.e-mob-chip.e-chip-selected {
528
- padding: $ddl-rtl-mob-sel-chip-padding;
529
-
530
- .e-chipcontent {
531
- padding: $ddl-rtl-mob-sel-chip-content-padding;
532
- }
533
- }
534
-
535
- .e-chips-close.e-close-hooker {
536
- left: $ddl-close-icon-left;
537
- position: absolute;
538
- right: auto;
539
- @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' or $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'Material3' {
540
- left: 0;
541
- }
542
- }
543
-
544
- .e-close-hooker::before {
545
- @if $ddl-multiselect-skin-name != 'Material3' {
546
- left: $ddl-rtl-hooker-left;
547
- }
548
- }
549
-
550
- .e-delim-values .e-remain {
551
- padding-right: $ddl-remains-padding-left;
552
- }
553
- }
554
- }
555
-
556
- .e-multiselect.e-rtl .e-down-icon .e-chips-close.e-close-hooker {
557
- left: $ddl-close-rtl-icon-left;
558
- }
559
-
560
- .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
561
- left: $ddl-chip-close-rtl-left;
562
- }
563
-
564
- .e-small.e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before,
565
- .e-small .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
566
- @if ($ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3') {
567
- left: $ddl-chip-close-rtl-small-left;
568
- }
569
- }
570
-
571
- .e-popup.e-multi-select-list-wrapper .e-list-item .e-checkbox-wrapper {
572
- bottom: 1px;
573
- margin-right: $ddl-check-right-margin;
574
- position: relative;
575
- text-indent: 0;
576
- vertical-align: middle;
577
- }
578
-
579
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group:not(.e-rtl) .e-list-item .e-checkbox-wrapper {
580
- @if ($ddl-multiselect-skin-name != 'tailwind' and $ddl-multiselect-skin-name != 'FluentUI') {
581
- padding-left: $ddl-multiselect-group-checkbox-wrapper-padding-left;
582
- }
583
- }
584
-
585
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group:not(.e-rtl) .e-list-item .e-checkbox-wrapper .e-ripple-container {
586
- @if ($ddl-multiselect-skin-name == 'Material3') {
587
- left: 4px;
588
- }
589
- }
590
-
591
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-item .e-checkbox-wrapper {
592
- @if ($ddl-multiselect-skin-name != 'tailwind' and $ddl-multiselect-skin-name != 'FluentUI') {
593
- padding-right: $ddl-multiselect-group-list-item-rtl-padding-right;
594
- }
595
- }
596
-
597
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item .e-checkbox-wrapper {
598
- bottom: 1px;
599
- @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
600
- bottom: 2px;
601
- }
602
- margin-right: $ddl-check-right-margin;
603
- position: relative;
604
- text-indent: 0;
605
- vertical-align: middle;
606
- }
607
-
608
- .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item .e-checkbox-wrapper {
609
- margin-left: 12px;
610
- margin-right: 0;
611
- }
612
-
613
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-group-item .e-checkbox-wrapper {
614
- margin-left: 12px;
615
- margin-right: 0;
616
- }
617
-
618
- .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item {
619
- @if ($ddl-multiselect-skin-name != 'tailwind') {
620
- padding-right: 0;
621
- }
622
- }
623
-
624
- .e-popup.e-multi-select-list-wrapper.e-rtl .e-dropdownbase.e-rtl.e-dd-group .e-list-item {
625
- @if ($ddl-multiselect-skin-name != 'tailwind') {
626
- padding-right: $ddl-list-rtl-padding-right;
627
- }
628
- }
629
-
630
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-dropdownbase.e-rtl.e-dd-group .e-list-group-item {
631
- @if $ddl-multiselect-skin-name == 'highcontrast' or $ddl-multiselect-skin-name == 'fabric' {
632
- padding-right: $ddl-multiselect-group-list-group-item-rtl-padding-right;
633
- }
634
- }
635
-
636
- .e-multi-select-list-wrapper .e-selectall-parent {
637
- cursor: pointer;
638
- display: block;
639
- line-height: $ddl-select-all-height;
640
- overflow: hidden;
641
- text-overflow: ellipsis;
642
- padding-right: $ddl-list-padding-right;
643
- position: relative;
644
- text-indent: $ddl-check-right;
645
- white-space: nowrap;
646
- width: 100%;
647
- }
648
-
649
- .e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-selectall-parent {
650
- @if ($ddl-multiselect-skin-name == 'FluentUI') {
651
- text-indent: $ddl-check-group-right;
652
- }
653
- }
654
-
655
- .e-rtl .e-multi-select-list-wrapper .e-selectall-parent,
656
- .e-multi-select-list-wrapper.e-rtl .e-selectall-parent {
657
- padding-left: $ddl-list-rtl-padding-left;
658
- padding-right: $ddl-list-rtl-padding-right;
659
- }
660
-
661
- .e-multi-select-list-wrapper .e-selectall-parent .e-all-text {
662
- color: $ddl-multi-list-default-font-color;
663
- font-family: $ddl-chip-font-family;
664
- font-size: $ddl-selectall-font-size;
665
- }
666
-
667
- .e-small.e-multi-select-list-wrapper .e-selectall-parent .e-all-text,
668
- .e-small .e-multi-select-list-wrapper .e-selectall-parent .e-all-text {
669
- @if $ddl-multiselect-skin-name == 'tailwind' {
670
- font-size: $ddl-small-selectall-font-size;
671
- }
672
- }
673
-
674
- .e-multi-select-list-wrapper .e-selectall-parent .e-checkbox-wrapper {
675
- bottom: 1px;
676
- margin-right: $ddl-check-right-margin;
677
- position: relative;
678
- text-indent: 0;
679
- vertical-align: middle;
680
- }
681
-
682
- .e-multi-select-list-wrapper.e-rtl .e-selectall-parent .e-checkbox-wrapper {
683
- margin-left: $ddl-check-left;
684
- margin-right: 0;
685
- }
686
-
687
- .e-multiselect .e-input-group-icon.e-ddl-icon {
688
- float: right;
689
- margin-top: $ddl-check-icon-top;
690
- @if $ddl-multiselect-skin-name == 'Material3' {
691
- top: 1px;
692
- }
693
- }
694
-
695
- .e-small .e-multiselect:not(.e-outline):not(.e-filled) .e-input-group-icon.e-ddl-icon {
696
- @if $ddl-multiselect-skin-name == 'Material3' {
697
- top: 6px;
698
- }
699
- }
700
-
701
- .e-multiselect.e-rtl .e-input-group-icon.e-ddl-icon {
702
- float: left;
703
- }
704
-
705
- .e-multiselect .e-ddl-icon::before {
706
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
707
- transform: rotate(0deg);
708
- transition: transform 300ms ease;
709
- }
710
- }
711
-
712
- .e-multiselect.e-icon-anim .e-ddl-icon::before {
713
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
714
- transform: rotate(180deg);
715
- transition: transform 300ms ease;
716
- }
717
- }
718
-
719
- .e-multiselect.e-checkbox .e-multi-select-wrapper,
720
- .e-multiselect .e-multi-select-wrapper.e-down-icon {
721
- @if $ddl-multiselect-skin-name != 'fluent2' {
722
- padding: 0;
723
- }
724
- }
725
-
726
- .e-multiselect.e-control-wrapper.e-checkbox .e-multi-select-wrapper.e-down-icon
727
- {
728
- @if $ddl-multiselect-skin-name == 'fluent2' {
729
- padding-right: 0 48px 0 0;
730
- }
731
- }
732
-
733
- .e-multiselect .e-multi-select-wrapper.e-down-icon {
734
- @if $ddl-multiselect-skin-name =='fluent2' {
735
- padding: 1px 0;
736
- }
737
- }
738
-
739
- .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-filter,
740
- .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-group.e-input-focus .e-input-filter {
741
- @if $ddl-multiselect-skin-name != 'bootstrap5' and $ddl-multiselect-skin-name != 'bootstrap5.3' and $ddl-multiselect-skin-name != 'tailwind' and $ddl-multiselect-skin-name != 'fluent2' {
742
- padding: $ddl-filterbar-padding;
743
- }
744
- }
745
-
746
- .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-group:not(.e-control-container) .e-clear-icon {
747
- @if $ddl-multiselect-skin-name != 'Material3' {
748
- padding-left: 8px;
749
- }
750
- @if $ddl-multiselect-skin-name == 'material' {
751
- padding-right: 8px;
752
- }
753
- }
754
-
755
- .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-back-icon {
756
- padding: $ddl-back-icon-padding;
757
- }
758
-
759
- .e-checkbox .e-multi-select-wrapper .e-delim-values .e-remain {
760
- line-height: 20px;
761
- padding-left: 10px;
762
- @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
763
- padding-left: 0;
764
- }
765
- }
766
-
767
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable .e-checkbox-wrapper .e-frame,
768
- .e-popup.e-multi-select-list-wrapper .e-list-group-item.e-disable .e-checkbox-wrapper .e-frame {
769
- opacity: .3;
770
- }
771
-
772
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable,
773
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disable {
774
- opacity: .7;
775
- }
776
-
777
- .e-multi-select-wrapper input[readonly = 'true'] {
778
- pointer-events: none;
779
- }
780
-
781
- .e-multiselect.e-checkbox .e-multi-select-wrapper .e-searcher {
782
- pointer-events: none;
783
- }
784
-
785
- ejs-multiselect {
786
- display: block;
787
- }
788
-
789
- .e-small.e-multi-select-list-wrapper .e-selectall-parent,
790
- .e-small .e-multi-select-list-wrapper .e-selectall-parent {
791
- line-height: $ddl-select-all-height-small;
792
- @if $ddl-multiselect-skin-name == 'tailwind' {
793
- font-size: $ddl-chip-small-font-size;
794
- text-indent: $ddl-small-check-right;
795
- }
796
- }
797
-
798
- .e-small .e-multi-select-wrapper .e-chips-close {
799
- height: $ddl-small-chip-close-square;
800
- width: $ddl-small-chip-close-width;
801
- }
802
-
803
- .e-small .e-multiselect .e-down-icon .e-chips-close.e-close-hooker {
804
- @if $ddl-multiselect-skin-name == 'Material3' {
805
- right: 24px;
806
- }
807
- }
808
-
809
- .e-small .e-multi-select-wrapper .e-chips-close.e-close-hooker {
810
- @if $ddl-multiselect-skin-name == 'Material3' {
811
- margin-top: $ddl-small-close-hooker-margin-top;
812
- height: $ddl-small-chip-close-hooker-height;
813
- width: $ddl-small-chip-close-hooker-width;
814
- line-height: normal;
815
- }
816
- }
817
-
818
- .e-small .e-multi-select-wrapper {
819
- min-height: $ddl-control-small-height;
820
- }
821
-
822
- .e-small .e-multi-select-wrapper.e-delimiter .e-searcher,
823
- .e-small .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
824
- @if $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'FluentUI' {
825
- height: $ddl-small-input-height;
826
- }
827
- }
828
-
829
- .e-small .e-multi-select-wrapper input[type = 'text'] {
830
- @if $ddl-multiselect-skin-name == 'tailwind' {
831
- font-size: $ddl-chip-small-font-size;
832
- }
833
- height: $ddl-small-input-height;
834
- min-height: $ddl-small-input-height;
835
- }
836
-
837
- .e-small .e-multi-select-wrapper .e-delim-values {
838
- font-size: $ddl-delim-small-font-size;
839
- line-height: $ddl-delimviewheight-small;
840
- }
841
-
842
- .e-small .e-multi-select-wrapper .e-chips-close.e-close-hooker,
843
- .e-small .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
844
- @if $ddl-multiselect-skin-name != 'fluent2' {
845
- margin-top: $ddl-small-closer-margin-top;
846
- }
847
- @if $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'FluentUI' or $ddl-multiselect-skin-name == 'Material3' {
848
- font-size: $ddl-closer-hooker-font-small;
849
- height: $ddl-small-clear-icon-height;
850
- width: $ddl-small-clear-icon-width;
851
- }
852
- }
853
-
854
- .e-small .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
855
- .e-small .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
856
- @if $ddl-multiselect-skin-name == 'Material3' {
857
- margin-top: $ddl-small-ddl-icon-top;
858
- }
859
- }
860
-
861
- .e-small.e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
862
- .e-small.e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
863
- margin-top: $ddl-small-ddl-icon-top;
864
- }
865
-
866
- .e-small .e-multi-select-wrapper .e-chips-close.e-close-hooker {
867
- @if ddl-multiselect-skin-name == 'Material3' {
868
- height: $ddl-small-clear-icon-height;
869
- width: $ddl-small-clear-icon-width;
870
- }
871
- }
872
-
873
- .e-small .e-multi-select-wrapper .e-chips > .e-chipcontent {
874
- @if $ddl-multiselect-skin-name == 'bootstrap4' {
875
- padding: $ddl-chip-small-content-padding;
876
- }
877
- }
878
-
879
- .e-small .e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
880
- @if $ddl-multiselect-skin-name == 'Material3' {
881
- right: $ddl-close-icon-small-right;
882
- }
883
- }
884
-
885
- .e-content-placeholder.e-multiselect.e-placeholder-multiselect {
886
- background-size: 300px 33px;
887
- min-height: 33px;
888
- }
889
-
890
- .e-multiselect.e-outline .e-multi-select-wrapper input[type = 'text'] {
891
- color: inherit;
892
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
893
- font-size: inherit;
894
- min-height: $outline-multiselect-inner-input-height;
895
- padding: 8px 12px 9px;
896
- }
897
- }
898
-
899
- .e-multiselect.e-outline.e-input-focus .e-multi-select-wrapper input[type = 'text'] {
900
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
901
- padding: 8px 12px 9px;
902
- }
903
- }
904
-
905
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper input[type = 'text'],
906
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper input[type = 'text'] {
907
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
908
- font-size: inherit;
909
- min-height: $outline-multiselect-small-inner-input-height;
910
- padding: 7px 10px;
911
- }
912
- }
913
-
914
- .e-small.e-multiselect.e-outline.e-input-focus .e-multi-select-wrapper input[type = 'text'],
915
- .e-small .e-multiselect.e-outline.e-input-focus .e-multi-select-wrapper input[type = 'text'] {
916
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
917
- padding: 7px 10px;
918
- }
919
- }
920
-
921
- .e-small {
922
- .e-multiselect.e-outline .e-multi-select-wrapper,
923
- #{if(&, '&', '*')}.e-multiselect.e-outline .e-multi-select-wrapper {
924
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
925
- min-height: $outline-multiselect-small-height;
926
- padding: $outline-multiselect-overall-padding;
927
- }
928
- }
929
- }
930
-
931
- .e-multiselect.e-outline .e-multi-select-wrapper {
932
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
933
- min-height: $ddl-outline-multiselect-height;
934
- padding: $outline-multiselect-overall-padding;
935
- }
936
- }
937
-
938
- .e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
939
- .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon {
940
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
941
- padding-right: 0;
942
- }
943
- }
944
-
945
- .e-rtl.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
946
- .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
947
- .e-rtl .e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
948
- .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
949
- .e-rtl.e-small.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
950
- .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
951
- .e-small .e-rtl.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
952
- .e-small .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
953
- .e-rtl .e-small.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
954
- .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon {
955
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
956
- padding-left: 0;
957
- }
958
- }
959
-
960
- .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper,
961
- .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper,
962
- .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper,
963
- .e-rtl.e-small .e-multiselect.e-outline .e-multi-select-wrapper,
964
- .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper {
965
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
966
- padding: $outline-rtl-multiselect-overall-padding;
967
- }
968
- }
969
-
970
- .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
971
- .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
972
- .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
973
- .e-rtl.e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
974
- .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide {
975
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
976
- padding-left: 0;
977
- }
978
- }
979
-
980
- .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
981
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
982
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide {
983
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
984
- padding-right: 0;
985
- }
986
- }
987
-
988
- .e-multiselect.e-outline .e-multi-select-wrapper.e-delimiter .e-searcher {
989
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
990
- height: $ddl-outline-multiselect-height;
991
- }
992
- }
993
-
994
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-delimiter .e-searcher,
995
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-delimiter .e-searcher {
996
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
997
- height: $outline-multiselect-small-height;
998
- }
999
- }
1000
-
1001
- .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1002
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1003
- font-size: 14px;
1004
- line-height: $ddl-outline-multiselect-height;
1005
- padding: $outline-multiselect-delimeter-padding;
1006
- }
1007
- }
1008
-
1009
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1010
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1011
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1012
- font-size: 13px;
1013
- line-height: $outline-multiselect-small-height;
1014
- padding: $outline-multiselect-small-delimeter-padding;
1015
- }
1016
- }
1017
-
1018
- .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1019
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1020
- padding: $outline-rtl-multiselect-delimeter-padding;
1021
- }
1022
- }
1023
-
1024
- .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1025
- .e-rtl.e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1026
- .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1027
- .e-small .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1028
- .e-small .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1029
- .e-rtl .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1030
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1031
- padding: $outline-rtl-multiselect-small-delimeter-padding;
1032
- }
1033
- }
1034
-
1035
- .e-multiselect.e-outline .e-multi-select-wrapper .e-chips {
1036
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1037
- height: $outline-multiselect-chip-height;
1038
- margin: $outline-multiselect-chip-margin;
1039
- padding: $outline-multiselect-chip-padding;
1040
- }
1041
- }
1042
-
1043
- .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper .e-chips,
1044
- .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-chips {
1045
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1046
- margin: $outline-rtl-multiselect-chip-margin;
1047
- }
1048
- }
1049
-
1050
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-chips,
1051
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-chips {
1052
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1053
- height: $outline-multiselect-small-chip-height;
1054
- padding: $outline-multiselect-chip-padding;
1055
- }
1056
- }
1057
-
1058
- .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1059
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1060
- padding: 0 8px 0 0;
1061
- }
1062
- }
1063
-
1064
- .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent,
1065
- .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1066
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1067
- padding: 0 0 0 8px;
1068
- }
1069
- }
1070
-
1071
- .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1072
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1073
- font-size: $outline-multiselect-chip-font-size;
1074
- }
1075
- }
1076
-
1077
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent,
1078
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1079
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1080
- font-size: $outline-multiselect-small-chip-font-size;
1081
- }
1082
- }
1083
-
1084
- .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
1085
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1086
- align-items: normal;
1087
- }
1088
-
1089
- .e-multiselect.e-filled .e-multi-select-wrapper .e-delim-values .e-remain,
1090
- .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values .e-remain {
1091
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1092
- font-size: 14px;
1093
- }
1094
- }
1095
-
1096
- .e-small.e-multiselect.e-filled .e-multi-select-wrapper .e-delim-values .e-remain,
1097
- .e-small .e-multiselect.e-filled .e-multi-select-wrapper .e-delim-values .e-remain,
1098
- .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values .e-remain,
1099
- .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values .e-remain {
1100
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1101
- font-size: 13px;
1102
- }
1103
- }
1104
-
1105
- .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper {
1106
- padding: 0 12px 0 8px;
1107
- }
1108
-
1109
- .e-multiselect.e-filled.e-input-group.e-control-wrapper {
1110
- padding: 0;
1111
- }
1112
-
1113
- .e-filled.e-float-input .e-multi-select-wrapper {
1114
- padding: 11px 12px 0;
1115
- }
1116
-
1117
- .e-small.e-filled.e-float-input .e-multi-select-wrapper,
1118
- .e-small .e-filled.e-float-input .e-multi-select-wrapper {
1119
- padding: 12px 12px 0 8px;
1120
- }
1121
-
1122
- .e-rtl.e-multiselect.e-filled.e-input-group.e-control-wrapper,
1123
- .e-rtl.e-multiselect.e-filled.e-float-input.e-control-wrapper {
1124
- padding: 0;
1125
- }
1126
-
1127
- .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper input[type = 'text'] {
1128
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1129
- min-height: $ddl-multiselect-filled-input-min-height;
1130
- padding-right: 10px;
1131
- }
1132
- }
1133
-
1134
- .e-small.e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper input[type = 'text'],
1135
- .e-small .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper input[type = 'text'] {
1136
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1137
- min-height: $ddl-multiselect-filled-input-min-height-small;
1138
- }
1139
- }
1140
-
1141
- .e-small.e-multiselect.e-filled.e-float-input .e-multi-select-wrapper input[type = 'text'],
1142
- .e-small .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper input[type = 'text'] {
1143
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1144
- height: $ddl-multiselect-filled-float-input-min-height-small;
1145
- min-height: $ddl-multiselect-filled-float-input-min-height-small;
1146
- padding: 2px;
1147
- }
1148
- }
1149
-
1150
- .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper.e-delimiter .e-searcher {
1151
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1152
- height: $ddl-multiselect-filled-input-min-height;
1153
- }
1154
- }
1155
-
1156
- .e-small.e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper.e-delimiter .e-searcher,
1157
- .e-small .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper.e-delimiter .e-searcher {
1158
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1159
- height: $ddl-multiselect-filled-input-min-height-small;
1160
- }
1161
- }
1162
-
1163
- .e-small.e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-delimiter .e-searcher,
1164
- .e-small .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-delimiter .e-searcher {
1165
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1166
- height: $ddl-multiselect-filled-float-input-min-height-small;
1167
- }
1168
- }
1169
-
1170
- .e-multiselect.e-filled.e-float-input .e-searcher .e-dropdownbase {
1171
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1172
- min-height: $ddl-multiselect-filled-float-input-min-height;
1173
- }
1174
- }
1175
-
1176
- .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-delim-values {
1177
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1178
- font-size: 13px;
1179
- line-height: $ddl-multiselect-filled-input-min-height;
1180
- }
1181
- }
1182
-
1183
- .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values {
1184
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1185
- font-size: 14px;
1186
- line-height: $ddl-multiselect-filled-float-input-min-height;
1187
- }
1188
- }
1189
-
1190
- .e-small.e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-delim-values,
1191
- .e-small .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-delim-values,
1192
- .e-small.e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values,
1193
- .e-small .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values {
1194
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1195
- font-size: $ddl-delim-bigger-small-font-size;
1196
- line-height: $ddl-multiselect-filled-input-min-height-small;
1197
- }
1198
- }
1199
-
1200
- .e-small.e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values,
1201
- .e-small .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values {
1202
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1203
- line-height: $ddl-multiselect-filled-float-input-min-height-small;
1204
- }
1205
- }
1206
-
1207
- .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1208
- height: 28px;
1209
- }
1210
-
1211
- .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
1212
- .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
1213
- .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips.e-mob-chip,
1214
- .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
1215
- .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1216
- height: 24px;
1217
- }
1218
-
1219
- .e-filled.e-float-input .e-multi-select-wrapper .e-chips {
1220
- height: 18px;
1221
- }
1222
-
1223
- .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
1224
- .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1225
- margin: 8px 8px 0 0;
1226
- padding: 0 8px;
1227
- }
1228
-
1229
- .e-rtl.e-filled.e-float-input .e-multi-select-wrapper .e-chips,
1230
- .e-rtl.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1231
- margin: 8px 0 0 8px;
1232
- padding: 0 8px;
1233
- }
1234
-
1235
- .e-small .e-filled .e-multi-select-wrapper .e-chips,
1236
- .e-small.e-filled .e-multi-select-wrapper .e-chips {
1237
- height: 16px;
1238
- margin: 4px 4px 0 0;
1239
- padding-right: 8px;
1240
- }
1241
-
1242
- .e.rtl.e-small .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
1243
- .e-rtl.e-small.e-filled.e-float-input .e-multi-select-wrapper .e-chips {
1244
- margin: 4px 0 0 4px;
1245
- }
1246
-
1247
- .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper .e-chips:not(.e-mob-chip) .e-chips-close {
1248
- @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1249
- height: $ddl-multiselect-filled-float-input-chip-clear-icon-size;
1250
- width: $ddl-multiselect-filled-float-input-chip-clear-icon-size;
1251
- }
1252
- }
1253
-
1254
- .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper .e-chips > .e-chipcontent {
1255
- font-size: 13px;
1256
- padding: 0 8px 0 0;
1257
- }
1258
-
1259
- .e-small.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
1260
- .e-small .e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1261
- font-size: 12px;
1262
- }
1263
-
1264
- .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1265
- font-size: 12px;
1266
- padding: 0 4px 0 0;
1267
- }
1268
-
1269
- .e-rtl.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1270
- padding: 0 0 0 4px;
1271
- }
1272
-
1273
- .e-small.e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
1274
- .e-small .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1275
- font-size: 10px;
1276
- }
1277
-
1278
- .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips > .e-chipcontent {
1279
- font-size: 13px;
1280
- padding-right: 4px;
1281
- }
1282
-
1283
- // Clear icon styles
1284
-
1285
- .e-filled.e-multi-select-wrapper .e-chips-close.e-close-hooker,
1286
- .e-multiselect.e-control-container .e-filled.e-multi-select-wrapper .e-clear-icon {
1287
- height: 38px;
1288
- margin-top: -38px;
1289
- right: 12px;
1290
- top: 100%;
1291
- width: 16px;
1292
- }
1293
-
1294
- .e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
1295
- .e-outline.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
1296
- .e-filled.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
1297
- .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
1298
- .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container.e-input-group :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon {
1299
- display: none;
1300
- }
1301
-
1302
- .e-multiselect.e-input-group.e-control-wrapper .e-input-group-icon {
1303
- @if $ddl-multiselect-skin-name != 'Material3' {
1304
- margin-right: 0;
1305
- }
1306
- @else {
1307
- margin: 0;
1308
- }
1309
- }
1310
-
1311
- .e-multiselect.e-control-container.e-input-group.e-disabled .e-input-group-icon.e-ddl-icon.e-icons,
1312
- .e-multiselect.e-control-container.e-input-group.e-disabled .e-clear-icon {
1313
- cursor: not-allowed;
1314
- }
1315
-
1316
- .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon,
1317
- .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon .e-multi-searcher .e-dropdownbase.e-control.e-multiselect.e-lib {
1318
- cursor: pointer;
1319
- }
1320
-
1321
- .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
1322
- bottom: 0;
1323
- right: 0;
1324
- cursor: nwse-resize;
1325
- height: 15px;
1326
- position: absolute;
1327
- width: 15px;
1328
- }
1329
-
1330
- .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
1331
- @if $skin-name == 'bootstrap-dark' or $skin-name == 'material-dark' or $skin-name == 'tailwind-dark' or $skin-name == 'material3-dark' or $skin-name == 'bootstrap5-dark' or $skin-name == 'fluent-dark' or $skin-name == 'fabric-dark' or $skin-name == 'highcontrast' {
1332
- background: transparent;
1333
- color: rgb(221, 218, 218);
1334
- }
1335
- }
1
+ .e-multi-select-wrapper {
2
+ box-sizing: border-box;
3
+ cursor: text;
4
+ line-height: normal;
5
+ min-height: $ddl-control-height;
6
+ padding: $ddl-control-placholder-padding;
7
+ position: relative;
8
+ user-select: none;
9
+ width: 100%;
10
+
11
+ #{if(&, '&', '*')}.e-delimiter {
12
+ #{if(&, '&', '*')} .e-searcher,
13
+ #{if(&, '&', '*')} .e-multi-searcher {
14
+ height: 27px;
15
+ vertical-align: middle;
16
+ #{if(&, '&', '*')} .e-dropdownbase {
17
+ height: 100%;
18
+ min-height: 100%;
19
+ }
20
+ }
21
+ }
22
+
23
+ .e-delim-view {
24
+ white-space: nowrap;
25
+
26
+ #{if(&, '&', '*')}.e-delim-values.e-delim-overflow,
27
+ #{if(&, '&', '*')}.e-delim-values.e-delim-total {
28
+ box-sizing: border-box;
29
+ display: inline-block;
30
+ overflow: hidden;
31
+ text-overflow: ellipsis;
32
+ @if $ddl-multiselect-skin-name == 'tailwind' {
33
+ padding: 0;
34
+ }
35
+ }
36
+ }
37
+
38
+ .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
39
+ color: $ddl-chip-mobile-font;
40
+ font-size: $ddl-chip-close-font;
41
+ left: $ddl-sel-chip-close-mobile-left;
42
+ top: $ddl-sel-chip-close-mobile-top;
43
+ }
44
+
45
+ .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
46
+ @if $ddl-multiselect-skin-name == 'Material3' {
47
+ background: $ddl-chip-mobile-bg;
48
+ }
49
+ @if $ddl-multiselect-skin-name != 'Material3' {
50
+ background-color: $ddl-chip-mobile-bg;
51
+ }
52
+ color: $ddl-chip-mobile-font;
53
+ padding: $ddl-chip-selected-padding;
54
+ }
55
+
56
+ .e-searcher.e-zero-size:not(.e-multiselect-box),
57
+ .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
58
+ width: 0;
59
+
60
+ input[type = 'text'] {
61
+ height: 1px;
62
+ min-height: 1px;
63
+ }
64
+ }
65
+
66
+ .e-chips.e-mob-chip > .e-chipcontent {
67
+ max-width: 100%;
68
+ }
69
+ }
70
+
71
+ .e-multiselect.e-control-container,
72
+ .e-multiselect.e-control-container.e-input-group {
73
+ .e-multi-select-wrapper .e-multi-searcher {
74
+ display: flex;
75
+ float: left;
76
+ width: auto;
77
+ }
78
+
79
+ .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
80
+ display: inline-flex;
81
+ float: none;
82
+ }
83
+
84
+ .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
85
+ width: 0;
86
+ }
87
+
88
+ .e-multi-select-wrapper .e-delim-values.e-delim-hide,
89
+ .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-hide,
90
+ .e-multi-select-wrapper .e-chips-collection.e-delim-hide {
91
+ display: none;
92
+ }
93
+
94
+ .e-multi-select-wrapper.e-down-icon {
95
+ @if $ddl-multiselect-skin-name != 'fluent2' {
96
+ padding: 0 48px 0 0;
97
+ }
98
+ }
99
+
100
+ .e-multi-select-wrapper .e-delim-values {
101
+ align-items: center;
102
+ display: inline;
103
+ max-width: 100%;
104
+ word-break: break-word;
105
+ }
106
+
107
+ .e-multi-select-wrapper .e-clear-icon,
108
+ .e-multi-select-wrapper .e-ddl-icon {
109
+ align-items: center;
110
+ cursor: pointer;
111
+ display: none;
112
+ flex-direction: row;
113
+ margin-top: $ddl-clear-margin-top;
114
+ @if $ddl-multiselect-skin-name == 'tailwind' {
115
+ margin-top: -1.55em;
116
+ }
117
+ outline: 0;
118
+ padding: 0;
119
+ position: absolute;
120
+ right: $ddl-chip-hooker-right;
121
+ top: $ddl-closer-hooker-top;
122
+ @if $ddl-multiselect-skin-name == 'FluentUI' {
123
+ right: $ddl-clear-icon-right;
124
+ top: $ddl-clear-icon-top;
125
+ }
126
+ }
127
+
128
+ :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
129
+ .e-multi-select-wrapper .e-ddl-icon {
130
+ display: flex;
131
+ }
132
+
133
+ .e-multi-select-wrapper .e-ddl-icon {
134
+ margin-right: 0;
135
+ margin-top: $ddl-icon-margin-top;
136
+ right: 0;
137
+ @if $ddl-multiselect-skin-name == 'fluent2' {
138
+ padding: 9px;
139
+ }
140
+ @if $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'tailwind-dark'{
141
+ min-width: 30px;
142
+ }
143
+ }
144
+
145
+ .e-multi-select-wrapper.e-delimiter {
146
+ @if $ddl-multiselect-skin-name != 'FluentUI' {
147
+ top: -1px;
148
+ }
149
+ }
150
+
151
+ .e-multi-select-wrapper .e-clear-icon {
152
+ font-size: $ddl-closer-hooker-font;
153
+ @if $ddl-multiselect-skin-name != 'bootstrap' {
154
+ height: $ddl-chip-hooker-square;
155
+ width: $ddl-chip-hooker-square;
156
+ }
157
+ }
158
+ }
159
+
160
+ .e-multiselect.e-control-container.e-rtl,
161
+ .e-multiselect.e-control-container.e-input-group.e-rtl {
162
+ .e-multi-select-wrapper .e-multi-searcher {
163
+ float: right;
164
+ }
165
+ .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
166
+ float: none;
167
+ }
168
+
169
+ .e-multi-select-wrapper .e-clear-icon,
170
+ .e-multi-select-wrapper .e-ddl-icon {
171
+ left: 0;
172
+ right: auto;
173
+ }
174
+
175
+ .e-multi-select-wrapper.e-down-icon {
176
+ padding: 0 0 0 48px;
177
+ }
178
+ }
179
+
180
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-disabled,
181
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disabled {
182
+ opacity: .7;
183
+ pointer-events: none;
184
+ }
185
+
186
+ .e-multiselect.e-input-group,
187
+ .e-multiselect.e-float-input {
188
+ word-wrap: initial;
189
+ }
190
+
191
+ .e-multiselect.e-input-group .e-searcher .e-label-top,
192
+ .e-multiselect.e-input-group .e-multi-searcher .e-label-top {
193
+ top: $ddl-multiselect-label-position;
194
+ }
195
+
196
+ .e-multi-select-wrapper.e-close-icon-hide {
197
+ padding-right: 0;
198
+ }
199
+
200
+ .e-multi-select-wrapper .e-chips-collection {
201
+ cursor: default;
202
+ display: block;
203
+ }
204
+
205
+ .e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
206
+ margin-right: 30px;
207
+ }
208
+
209
+ .e-multi-select-wrapper .e-multi-hidden {
210
+ border: 0;
211
+ height: 0;
212
+ position: absolute;
213
+ visibility: hidden;
214
+ width: 0;
215
+ }
216
+
217
+ .e-multi-select-wrapper .e-chips {
218
+ align-items: center;
219
+ display: inline-flex;
220
+ float: left;
221
+ margin: $ddl-chip-margin;
222
+ max-width: 100%;
223
+ overflow: hidden;
224
+ padding: $ddl-chip-padding;
225
+ text-overflow: ellipsis;
226
+ white-space: nowrap;
227
+ }
228
+
229
+ .e-multi-select-wrapper .e-chips > .e-chipcontent {
230
+ max-width: 100%;
231
+ overflow: hidden;
232
+ padding: $ddl-chip-content-padding;
233
+ text-indent: 0;
234
+ text-overflow: ellipsis;
235
+ white-space: nowrap;
236
+ @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
237
+ line-height: 1.5;
238
+ }
239
+ }
240
+
241
+ .e-small .e-multi-select-wrapper .e-chips {
242
+ @if $ddl-multiselect-skin-name == 'highcontrast' {
243
+ margin: $ddl-chip-small-margin;
244
+ #{if(&, '&', '*')} > .e-chipcontent {
245
+ padding: $ddl-chip-small-content-padding;
246
+ }
247
+ }
248
+ }
249
+
250
+ .e-multi-select-wrapper.e-delimiter {
251
+ .e-searcher {
252
+ display: inline-block;
253
+ float: none;
254
+ }
255
+ }
256
+
257
+ .e-multi-select-wrapper .e-mob-chip.e-chips > .e-chipcontent {
258
+ padding: $ddl-chip-mobile-content-padding;
259
+ }
260
+
261
+ #{&}.e-multiselect.e-rtl .e-multi-select-wrapper .e-mob-chip.e-chips>.e-chipcontent {
262
+ padding: $ddl-rtl-chip-mobile-content-padding;
263
+ }
264
+
265
+ .e-multi-select-wrapper .e-chips-close {
266
+ align-self: center;
267
+ display: flex;
268
+ float: right;
269
+ font-family: 'e-icons';
270
+ height: $ddl-chip-close-square;
271
+ margin: $ddl-chip-close-margin;
272
+ width: $ddl-chip-close-width;
273
+ }
274
+
275
+ .e-rtl .e-multi-select-wrapper .e-chips-close {
276
+ margin: $ddl-chip-close-rtl-margin;
277
+ }
278
+
279
+ .e-multi-select-wrapper .e-mob-chip.e-chips .e-chips-close {
280
+ margin: $ddl-chip-mobile-close-margin;
281
+ }
282
+
283
+ .e-multi-select-wrapper .e-chips-close.e-close-hooker {
284
+ cursor: default;
285
+ font-size: $ddl-closer-hooker-font;
286
+ height: $ddl-chip-hooker-square;
287
+ margin-top: $ddl-closer-margin-top;
288
+ position: absolute;
289
+ right: $ddl-chip-hooker-right;
290
+ width: $ddl-chip-hooker-width;
291
+ @if $ddl-multiselect-skin-name != 'Material3' {
292
+ top: $ddl-closer-hooker-top;
293
+ }
294
+ @else {
295
+ top: $ddl-closer-hooker-top-margin;
296
+ border-radius: $ddl-closer-hooker-font;
297
+ }
298
+ }
299
+
300
+ .e-multiselect .e-chips-close.e-close-hooker:hover {
301
+ @if $ddl-multiselect-skin-name == 'Material3' {
302
+ background: $ddl-bigger-closer-hooker-bg-color;
303
+ border: 1px;
304
+ }
305
+ }
306
+
307
+ .e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
308
+ .e-small.e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
309
+ .e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
310
+ right: $ddl-close-icon-left;
311
+ }
312
+
313
+ .e-small.e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
314
+ .e-small.e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
315
+ .e-small.e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
316
+ @if $ddl-multiselect-skin-name == 'FluentUI' {
317
+ font-size: $ddl-closer-hooker-font-small;
318
+ }
319
+ @if $ddl-multiselect-skin-name == 'Material3' {
320
+ right: 30px;
321
+ }
322
+ }
323
+
324
+ .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
325
+ .e-multiselect .e-down-icon .e-chips-close.e-close-hooker {
326
+ @if $ddl-multiselect-skin-name == 'FluentUI' {
327
+ font-size: $ddl-chip-close-font;
328
+ }
329
+ }
330
+
331
+ .e-multiselect.e-input-group.e-control-container.e-rtl .e-multi-select-wrapper.e-down-icon .e-clear-icon {
332
+ left: $ddl-close-icon-left;
333
+ right: auto;
334
+ }
335
+
336
+ .e-small .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips-close.e-close-hooker,
337
+ .e-small.e-multiselect.e-rtl .e-multi-select-wrapper .e-chips-close.e-close-hooker {
338
+ @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
339
+ left: 12px;
340
+ right: auto;
341
+ }
342
+ }
343
+
344
+ .e-multi-select-wrapper input[type = 'text'] {
345
+ background: none;
346
+ border: 0;
347
+ font-family: $ddl-chip-font-family;
348
+ font-size: $ddl-chip-font-size;
349
+ font-weight: normal;
350
+ height: $ddl-input-height;
351
+ min-height: $ddl-input-height;
352
+ outline: none;
353
+ @if $ddl-multiselect-skin-name == 'Material3' {
354
+ padding: 0;
355
+ }
356
+ @else {
357
+ padding: $ddl-input-placeholder-padding;
358
+ }
359
+ text-indent: 0;
360
+ }
361
+
362
+ .e-multiselect.e-filled .e-multi-select-wrapper input[type = 'text'] {
363
+ background: none;
364
+ border: 0;
365
+ color: inherit;
366
+ font-family: $ddl-chip-font-family;
367
+ font-size: $ddl-delim-font-size;
368
+ font-weight: normal;
369
+ height: $ddl-input-height;
370
+ min-height: $ddl-input-height;
371
+ outline: none;
372
+ padding: 0;
373
+ text-indent: $ddl-input-text-indent;
374
+ }
375
+
376
+ .e-rtl.e-multiselect.e-filled .e-multi-select-wrapper input[type = 'text'] {
377
+ padding: 5px;
378
+ }
379
+
380
+ /* stylelint-disable property-no-vendor-prefix */
381
+ .e-multi-select-wrapper input[type = 'text']::-ms-clear {
382
+ display: none;
383
+ }
384
+
385
+ .e-multi-select-wrapper .e-searcher {
386
+ display: block;
387
+ float: left;
388
+ width: auto;
389
+ }
390
+
391
+ .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
392
+ width: $ddl-search-wrapper-width;
393
+ }
394
+
395
+ .e-small .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width,
396
+ .e-small.e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
397
+ width: $ddl-small-search-wrapper-width;
398
+ }
399
+
400
+ .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
401
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
402
+ width: $ddl-search-wrapper-width;
403
+ }
404
+ }
405
+
406
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width,
407
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
408
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
409
+ width: $ddl-small-search-wrapper-width;
410
+ }
411
+ }
412
+
413
+ .e-multi-select-wrapper .e-delim-values {
414
+ @if $ddl-multiselect-skin-name == 'tailwind' {
415
+ font-family: $multi-select-delim-font-family;
416
+ }
417
+ @else {
418
+ font-family: $ddl-chip-font-family;
419
+ }
420
+ font-size: $ddl-delim-font-size;
421
+ line-height: $ddl-delimviewheight;
422
+ max-width: 100%;
423
+ padding-left: $ddl-delim-text-indent;
424
+ padding-right: $ddl-delim-text-padding-right;
425
+ vertical-align: middle;
426
+ }
427
+
428
+ .e-small .e-multi-select-wrapper .e-delim-values .e-remain {
429
+ @if $ddl-multiselect-skin-name == 'tailwind' {
430
+ font-size: $ddl-chip-small-font-size;
431
+ }
432
+ }
433
+
434
+ .e-multi-select-list-wrapper .e-hide-listitem,
435
+ .e-multi-select-list-wrapper .e-hide-group-header {
436
+ display: none;
437
+ }
438
+
439
+ .e-multi-select-wrapper .e-delim-values .e-remain {
440
+ color: $ddl-remains-font-color;
441
+ cursor: pointer;
442
+ display: inline-block;
443
+ font-size: $ddl-chip-font-size;
444
+ padding-left: $ddl-remains-padding-left;
445
+ }
446
+
447
+ #{&}.e-multiselect.e-disabled .e-multi-select-wrapper,
448
+ #{&}.e-multiselect.e-disabled .e-multi-select-wrapper .e-chips .e-chips-close::before {
449
+ cursor: not-allowed;
450
+ }
451
+
452
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
453
+ height: $ddl-chip-sel-mobile-height;
454
+ left: $ddl-chip-mob-left;
455
+ margin: $ddl-chip-sel-mobile-close-margin;
456
+ margin-left: auto;
457
+ position: relative;
458
+ top: $ddl-chip-close-mob-top;
459
+ width: $ddl-chip-sel-mobile-height;
460
+ }
461
+
462
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
463
+ align-self: center;
464
+ box-shadow: $ddl-chip-selected-shadow-value;
465
+ display: inline-flex;
466
+ padding: $ddl-chip-mob-padding;
467
+ width: 92%;
468
+ }
469
+
470
+ .e-multi-select-wrapper .e-ddl-disable-icon::before {
471
+ content: '';
472
+ }
473
+
474
+ #{&}.e-multiselect.e-rtl .e-multi-select-wrapper.e-delimiter {
475
+ .e-searcher {
476
+ float: none;
477
+ }
478
+ }
479
+
480
+ #{&}.e-multiselect.e-rtl {
481
+ .e-multi-select-wrapper.e-close-icon-hide {
482
+ padding-left: 0;
483
+ }
484
+
485
+ .e-multi-select-wrapper {
486
+ padding: $ddl-rtl-wrapper;
487
+
488
+ .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
489
+ left: $ddl-rtl-chip-sel-close-left;
490
+ }
491
+
492
+ .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
493
+ margin: 0;
494
+ margin-right: auto;
495
+ }
496
+
497
+ .e-searcher {
498
+ float: right;
499
+ }
500
+
501
+ .e-chips {
502
+ float: right;
503
+ margin: $ddl-rtl-mob-chip-content-margin;
504
+ padding: $ddl-rtl-chip-padding;
505
+
506
+ .e-chipcontent {
507
+ padding: $ddl-rtl-chip-content-padding;
508
+ }
509
+
510
+ .e-chips-close {
511
+ float: left;
512
+ }
513
+
514
+ .e-chips-close::before {
515
+ left: $ddl-rtl-chip-close-left;
516
+ }
517
+ }
518
+
519
+ .e-chips.e-mob-chip {
520
+ padding: $ddl-rtl-mob-chip-padding;
521
+
522
+ .e-chipcontent {
523
+ padding: $ddl-rtl-mob-chip-content-padding;
524
+ }
525
+ }
526
+
527
+ .e-chips.e-mob-chip.e-chip-selected {
528
+ padding: $ddl-rtl-mob-sel-chip-padding;
529
+
530
+ .e-chipcontent {
531
+ padding: $ddl-rtl-mob-sel-chip-content-padding;
532
+ }
533
+ }
534
+
535
+ .e-chips-close.e-close-hooker {
536
+ left: $ddl-close-icon-left;
537
+ position: absolute;
538
+ right: auto;
539
+ @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' or $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'Material3' {
540
+ left: 0;
541
+ }
542
+ }
543
+
544
+ .e-close-hooker::before {
545
+ @if $ddl-multiselect-skin-name != 'Material3' {
546
+ left: $ddl-rtl-hooker-left;
547
+ }
548
+ }
549
+
550
+ .e-delim-values .e-remain {
551
+ padding-right: $ddl-remains-padding-left;
552
+ }
553
+ }
554
+ }
555
+
556
+ .e-multiselect.e-rtl .e-down-icon .e-chips-close.e-close-hooker {
557
+ left: $ddl-close-rtl-icon-left;
558
+ }
559
+
560
+ .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
561
+ left: $ddl-chip-close-rtl-left;
562
+ }
563
+
564
+ .e-small.e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before,
565
+ .e-small .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
566
+ @if ($ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3') {
567
+ left: $ddl-chip-close-rtl-small-left;
568
+ }
569
+ }
570
+
571
+ .e-popup.e-multi-select-list-wrapper .e-list-item .e-checkbox-wrapper {
572
+ bottom: 1px;
573
+ margin-right: $ddl-check-right-margin;
574
+ position: relative;
575
+ text-indent: 0;
576
+ vertical-align: middle;
577
+ }
578
+
579
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group:not(.e-rtl) .e-list-item .e-checkbox-wrapper {
580
+ @if ($ddl-multiselect-skin-name != 'tailwind' and $ddl-multiselect-skin-name != 'FluentUI') {
581
+ padding-left: $ddl-multiselect-group-checkbox-wrapper-padding-left;
582
+ }
583
+ }
584
+
585
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group:not(.e-rtl) .e-list-item .e-checkbox-wrapper .e-ripple-container {
586
+ @if ($ddl-multiselect-skin-name == 'Material3') {
587
+ left: 4px;
588
+ }
589
+ }
590
+
591
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-item .e-checkbox-wrapper {
592
+ @if ($ddl-multiselect-skin-name != 'tailwind' and $ddl-multiselect-skin-name != 'FluentUI') {
593
+ padding-right: $ddl-multiselect-group-list-item-rtl-padding-right;
594
+ }
595
+ }
596
+
597
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item .e-checkbox-wrapper {
598
+ bottom: 1px;
599
+ @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
600
+ bottom: 2px;
601
+ }
602
+ margin-right: $ddl-check-right-margin;
603
+ position: relative;
604
+ text-indent: 0;
605
+ vertical-align: middle;
606
+ }
607
+
608
+ .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item .e-checkbox-wrapper {
609
+ margin-left: 12px;
610
+ margin-right: 0;
611
+ }
612
+
613
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-group-item .e-checkbox-wrapper {
614
+ margin-left: 12px;
615
+ margin-right: 0;
616
+ }
617
+
618
+ .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item {
619
+ @if ($ddl-multiselect-skin-name != 'tailwind') {
620
+ padding-right: 0;
621
+ }
622
+ }
623
+
624
+ .e-popup.e-multi-select-list-wrapper.e-rtl .e-dropdownbase.e-rtl.e-dd-group .e-list-item {
625
+ @if ($ddl-multiselect-skin-name != 'tailwind') {
626
+ padding-right: $ddl-list-rtl-padding-right;
627
+ }
628
+ }
629
+
630
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-dropdownbase.e-rtl.e-dd-group .e-list-group-item {
631
+ @if $ddl-multiselect-skin-name == 'highcontrast' or $ddl-multiselect-skin-name == 'fabric' {
632
+ padding-right: $ddl-multiselect-group-list-group-item-rtl-padding-right;
633
+ }
634
+ }
635
+
636
+ .e-multi-select-list-wrapper .e-selectall-parent {
637
+ cursor: pointer;
638
+ display: block;
639
+ line-height: $ddl-select-all-height;
640
+ overflow: hidden;
641
+ text-overflow: ellipsis;
642
+ padding-right: $ddl-list-padding-right;
643
+ position: relative;
644
+ text-indent: $ddl-check-right;
645
+ white-space: nowrap;
646
+ width: 100%;
647
+ }
648
+
649
+ .e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-selectall-parent {
650
+ @if ($ddl-multiselect-skin-name == 'FluentUI') {
651
+ text-indent: $ddl-check-group-right;
652
+ }
653
+ }
654
+
655
+ .e-rtl .e-multi-select-list-wrapper .e-selectall-parent,
656
+ .e-multi-select-list-wrapper.e-rtl .e-selectall-parent {
657
+ padding-left: $ddl-list-rtl-padding-left;
658
+ padding-right: $ddl-list-rtl-padding-right;
659
+ }
660
+
661
+ .e-multi-select-list-wrapper .e-selectall-parent .e-all-text {
662
+ color: $ddl-multi-list-default-font-color;
663
+ font-family: $ddl-chip-font-family;
664
+ font-size: $ddl-selectall-font-size;
665
+ }
666
+
667
+ .e-small.e-multi-select-list-wrapper .e-selectall-parent .e-all-text,
668
+ .e-small .e-multi-select-list-wrapper .e-selectall-parent .e-all-text {
669
+ @if $ddl-multiselect-skin-name == 'tailwind' {
670
+ font-size: $ddl-small-selectall-font-size;
671
+ }
672
+ }
673
+
674
+ .e-multi-select-list-wrapper .e-selectall-parent .e-checkbox-wrapper {
675
+ bottom: 1px;
676
+ margin-right: $ddl-check-right-margin;
677
+ position: relative;
678
+ text-indent: 0;
679
+ vertical-align: middle;
680
+ }
681
+
682
+ .e-multi-select-list-wrapper.e-rtl .e-selectall-parent .e-checkbox-wrapper {
683
+ margin-left: $ddl-check-left;
684
+ margin-right: 0;
685
+ }
686
+
687
+ .e-multiselect .e-input-group-icon.e-ddl-icon {
688
+ float: right;
689
+ margin-top: $ddl-check-icon-top;
690
+ @if $ddl-multiselect-skin-name == 'Material3' {
691
+ top: 1px;
692
+ }
693
+ }
694
+
695
+ .e-small .e-multiselect:not(.e-outline):not(.e-filled) .e-input-group-icon.e-ddl-icon {
696
+ @if $ddl-multiselect-skin-name == 'Material3' {
697
+ top: 6px;
698
+ }
699
+ }
700
+
701
+ .e-multiselect.e-rtl .e-input-group-icon.e-ddl-icon {
702
+ float: left;
703
+ }
704
+
705
+ .e-multiselect .e-ddl-icon::before {
706
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
707
+ transform: rotate(0deg);
708
+ transition: transform 300ms ease;
709
+ }
710
+ }
711
+
712
+ .e-multiselect.e-icon-anim .e-ddl-icon::before {
713
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
714
+ transform: rotate(180deg);
715
+ transition: transform 300ms ease;
716
+ }
717
+ }
718
+
719
+ .e-multiselect.e-checkbox .e-multi-select-wrapper,
720
+ .e-multiselect .e-multi-select-wrapper.e-down-icon {
721
+ @if $ddl-multiselect-skin-name != 'fluent2' {
722
+ padding: 0;
723
+ }
724
+ }
725
+
726
+ .e-multiselect.e-control-wrapper.e-checkbox .e-multi-select-wrapper.e-down-icon
727
+ {
728
+ @if $ddl-multiselect-skin-name == 'fluent2' {
729
+ padding-right: 0 48px 0 0;
730
+ }
731
+ }
732
+
733
+ .e-multiselect .e-multi-select-wrapper.e-down-icon {
734
+ @if $ddl-multiselect-skin-name =='fluent2' {
735
+ padding: 1px 0;
736
+ }
737
+ }
738
+
739
+ .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-filter,
740
+ .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-group.e-input-focus .e-input-filter {
741
+ @if $ddl-multiselect-skin-name != 'bootstrap5' and $ddl-multiselect-skin-name != 'bootstrap5.3' and $ddl-multiselect-skin-name != 'tailwind' and $ddl-multiselect-skin-name != 'fluent2' {
742
+ padding: $ddl-filterbar-padding;
743
+ }
744
+ }
745
+
746
+ .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-group:not(.e-control-container) .e-clear-icon {
747
+ @if $ddl-multiselect-skin-name != 'Material3' {
748
+ padding-left: 8px;
749
+ }
750
+ @if $ddl-multiselect-skin-name == 'material' {
751
+ padding-right: 8px;
752
+ }
753
+ }
754
+
755
+ .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-back-icon {
756
+ padding: $ddl-back-icon-padding;
757
+ }
758
+
759
+ .e-checkbox .e-multi-select-wrapper .e-delim-values .e-remain {
760
+ line-height: 20px;
761
+ padding-left: 10px;
762
+ @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
763
+ padding-left: 0;
764
+ }
765
+ }
766
+
767
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable .e-checkbox-wrapper .e-frame,
768
+ .e-popup.e-multi-select-list-wrapper .e-list-group-item.e-disable .e-checkbox-wrapper .e-frame {
769
+ opacity: .3;
770
+ }
771
+
772
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable,
773
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disable {
774
+ opacity: .7;
775
+ }
776
+
777
+ .e-multi-select-wrapper input[readonly = 'true'] {
778
+ pointer-events: none;
779
+ }
780
+
781
+ .e-multiselect.e-checkbox .e-multi-select-wrapper .e-searcher {
782
+ pointer-events: none;
783
+ }
784
+
785
+ ejs-multiselect {
786
+ display: block;
787
+ }
788
+
789
+ .e-small.e-multi-select-list-wrapper .e-selectall-parent,
790
+ .e-small .e-multi-select-list-wrapper .e-selectall-parent {
791
+ line-height: $ddl-select-all-height-small;
792
+ @if $ddl-multiselect-skin-name == 'tailwind' {
793
+ font-size: $ddl-chip-small-font-size;
794
+ text-indent: $ddl-small-check-right;
795
+ }
796
+ }
797
+
798
+ .e-small .e-multi-select-wrapper .e-chips-close {
799
+ height: $ddl-small-chip-close-square;
800
+ width: $ddl-small-chip-close-width;
801
+ }
802
+
803
+ .e-small .e-multiselect .e-down-icon .e-chips-close.e-close-hooker {
804
+ @if $ddl-multiselect-skin-name == 'Material3' {
805
+ right: 24px;
806
+ }
807
+ }
808
+
809
+ .e-small .e-multi-select-wrapper .e-chips-close.e-close-hooker {
810
+ @if $ddl-multiselect-skin-name == 'Material3' {
811
+ margin-top: $ddl-small-close-hooker-margin-top;
812
+ height: $ddl-small-chip-close-hooker-height;
813
+ width: $ddl-small-chip-close-hooker-width;
814
+ line-height: normal;
815
+ }
816
+ }
817
+
818
+ .e-small .e-multi-select-wrapper {
819
+ min-height: $ddl-control-small-height;
820
+ }
821
+
822
+ .e-small .e-multi-select-wrapper.e-delimiter .e-searcher,
823
+ .e-small .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
824
+ @if $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'FluentUI' {
825
+ height: $ddl-small-input-height;
826
+ }
827
+ }
828
+
829
+ .e-small .e-multi-select-wrapper input[type = 'text'] {
830
+ @if $ddl-multiselect-skin-name == 'tailwind' {
831
+ font-size: $ddl-chip-small-font-size;
832
+ }
833
+ height: $ddl-small-input-height;
834
+ min-height: $ddl-small-input-height;
835
+ }
836
+
837
+ .e-small .e-multi-select-wrapper .e-delim-values {
838
+ font-size: $ddl-delim-small-font-size;
839
+ line-height: $ddl-delimviewheight-small;
840
+ }
841
+
842
+ .e-small .e-multi-select-wrapper .e-chips-close.e-close-hooker,
843
+ .e-small .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
844
+ @if $ddl-multiselect-skin-name != 'fluent2' {
845
+ margin-top: $ddl-small-closer-margin-top;
846
+ }
847
+ @if $ddl-multiselect-skin-name == 'tailwind' or $ddl-multiselect-skin-name == 'FluentUI' or $ddl-multiselect-skin-name == 'Material3' {
848
+ font-size: $ddl-closer-hooker-font-small;
849
+ height: $ddl-small-clear-icon-height;
850
+ width: $ddl-small-clear-icon-width;
851
+ }
852
+ }
853
+
854
+ .e-small .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
855
+ .e-small .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
856
+ @if $ddl-multiselect-skin-name == 'Material3' {
857
+ margin-top: $ddl-small-ddl-icon-top;
858
+ }
859
+ }
860
+
861
+ .e-small.e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
862
+ .e-small.e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
863
+ margin-top: $ddl-small-ddl-icon-top;
864
+ }
865
+
866
+ .e-small .e-multi-select-wrapper .e-chips-close.e-close-hooker {
867
+ @if ddl-multiselect-skin-name == 'Material3' {
868
+ height: $ddl-small-clear-icon-height;
869
+ width: $ddl-small-clear-icon-width;
870
+ }
871
+ }
872
+
873
+ .e-small .e-multi-select-wrapper .e-chips > .e-chipcontent {
874
+ @if $ddl-multiselect-skin-name == 'bootstrap4' {
875
+ padding: $ddl-chip-small-content-padding;
876
+ }
877
+ }
878
+
879
+ .e-small .e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
880
+ @if $ddl-multiselect-skin-name == 'Material3' {
881
+ right: $ddl-close-icon-small-right;
882
+ }
883
+ }
884
+
885
+ .e-content-placeholder.e-multiselect.e-placeholder-multiselect {
886
+ background-size: 300px 33px;
887
+ min-height: 33px;
888
+ }
889
+
890
+ .e-multiselect.e-outline .e-multi-select-wrapper input[type = 'text'] {
891
+ color: inherit;
892
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
893
+ font-size: inherit;
894
+ min-height: $outline-multiselect-inner-input-height;
895
+ padding: 8px 12px 9px;
896
+ }
897
+ }
898
+
899
+ .e-multiselect.e-outline.e-input-focus .e-multi-select-wrapper input[type = 'text'] {
900
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
901
+ padding: 8px 12px 9px;
902
+ }
903
+ }
904
+
905
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper input[type = 'text'],
906
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper input[type = 'text'] {
907
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
908
+ font-size: inherit;
909
+ min-height: $outline-multiselect-small-inner-input-height;
910
+ padding: 7px 10px;
911
+ }
912
+ }
913
+
914
+ .e-small.e-multiselect.e-outline.e-input-focus .e-multi-select-wrapper input[type = 'text'],
915
+ .e-small .e-multiselect.e-outline.e-input-focus .e-multi-select-wrapper input[type = 'text'] {
916
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
917
+ padding: 7px 10px;
918
+ }
919
+ }
920
+
921
+ .e-small {
922
+ .e-multiselect.e-outline .e-multi-select-wrapper,
923
+ #{if(&, '&', '*')}.e-multiselect.e-outline .e-multi-select-wrapper {
924
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
925
+ min-height: $outline-multiselect-small-height;
926
+ padding: $outline-multiselect-overall-padding;
927
+ }
928
+ }
929
+ }
930
+
931
+ .e-multiselect.e-outline .e-multi-select-wrapper {
932
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
933
+ min-height: $ddl-outline-multiselect-height;
934
+ padding: $outline-multiselect-overall-padding;
935
+ }
936
+ }
937
+
938
+ .e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
939
+ .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon {
940
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
941
+ padding-right: 0;
942
+ }
943
+ }
944
+
945
+ .e-rtl.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
946
+ .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
947
+ .e-rtl .e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
948
+ .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
949
+ .e-rtl.e-small.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
950
+ .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
951
+ .e-small .e-rtl.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
952
+ .e-small .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon,
953
+ .e-rtl .e-small.e-outline.e-multiselect.e-checkbox .e-multi-select-wrapper,
954
+ .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon {
955
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
956
+ padding-left: 0;
957
+ }
958
+ }
959
+
960
+ .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper,
961
+ .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper,
962
+ .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper,
963
+ .e-rtl.e-small .e-multiselect.e-outline .e-multi-select-wrapper,
964
+ .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper {
965
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
966
+ padding: $outline-rtl-multiselect-overall-padding;
967
+ }
968
+ }
969
+
970
+ .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
971
+ .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
972
+ .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
973
+ .e-rtl.e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
974
+ .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide {
975
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
976
+ padding-left: 0;
977
+ }
978
+ }
979
+
980
+ .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
981
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide,
982
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-close-icon-hide {
983
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
984
+ padding-right: 0;
985
+ }
986
+ }
987
+
988
+ .e-multiselect.e-outline .e-multi-select-wrapper.e-delimiter .e-searcher {
989
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
990
+ height: $ddl-outline-multiselect-height;
991
+ }
992
+ }
993
+
994
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-delimiter .e-searcher,
995
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper.e-delimiter .e-searcher {
996
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
997
+ height: $outline-multiselect-small-height;
998
+ }
999
+ }
1000
+
1001
+ .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1002
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1003
+ font-size: 14px;
1004
+ line-height: $ddl-outline-multiselect-height;
1005
+ padding: $outline-multiselect-delimeter-padding;
1006
+ }
1007
+ }
1008
+
1009
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1010
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1011
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1012
+ font-size: 13px;
1013
+ line-height: $outline-multiselect-small-height;
1014
+ padding: $outline-multiselect-small-delimeter-padding;
1015
+ }
1016
+ }
1017
+
1018
+ .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1019
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1020
+ padding: $outline-rtl-multiselect-delimeter-padding;
1021
+ }
1022
+ }
1023
+
1024
+ .e-rtl.e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1025
+ .e-rtl.e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1026
+ .e-rtl .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1027
+ .e-small .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1028
+ .e-small .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values,
1029
+ .e-rtl .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values {
1030
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1031
+ padding: $outline-rtl-multiselect-small-delimeter-padding;
1032
+ }
1033
+ }
1034
+
1035
+ .e-multiselect.e-outline .e-multi-select-wrapper .e-chips {
1036
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1037
+ height: $outline-multiselect-chip-height;
1038
+ margin: $outline-multiselect-chip-margin;
1039
+ padding: $outline-multiselect-chip-padding;
1040
+ }
1041
+ }
1042
+
1043
+ .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper .e-chips,
1044
+ .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-chips {
1045
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1046
+ margin: $outline-rtl-multiselect-chip-margin;
1047
+ }
1048
+ }
1049
+
1050
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-chips,
1051
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-chips {
1052
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1053
+ height: $outline-multiselect-small-chip-height;
1054
+ padding: $outline-multiselect-chip-padding;
1055
+ }
1056
+ }
1057
+
1058
+ .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1059
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1060
+ padding: 0 8px 0 0;
1061
+ }
1062
+ }
1063
+
1064
+ .e-rtl.e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent,
1065
+ .e-rtl .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1066
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1067
+ padding: 0 0 0 8px;
1068
+ }
1069
+ }
1070
+
1071
+ .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1072
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1073
+ font-size: $outline-multiselect-chip-font-size;
1074
+ }
1075
+ }
1076
+
1077
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent,
1078
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-chips > .e-chipcontent {
1079
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1080
+ font-size: $outline-multiselect-small-chip-font-size;
1081
+ }
1082
+ }
1083
+
1084
+ .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
1085
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
1086
+ align-items: normal;
1087
+ }
1088
+
1089
+ .e-multiselect.e-filled .e-multi-select-wrapper .e-delim-values .e-remain,
1090
+ .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values .e-remain {
1091
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1092
+ font-size: 14px;
1093
+ }
1094
+ }
1095
+
1096
+ .e-small.e-multiselect.e-filled .e-multi-select-wrapper .e-delim-values .e-remain,
1097
+ .e-small .e-multiselect.e-filled .e-multi-select-wrapper .e-delim-values .e-remain,
1098
+ .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values .e-remain,
1099
+ .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-delim-values .e-remain {
1100
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1101
+ font-size: 13px;
1102
+ }
1103
+ }
1104
+
1105
+ .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper {
1106
+ padding: 0 12px 0 8px;
1107
+ }
1108
+
1109
+ .e-multiselect.e-filled.e-input-group.e-control-wrapper {
1110
+ padding: 0;
1111
+ }
1112
+
1113
+ .e-filled.e-float-input .e-multi-select-wrapper {
1114
+ padding: 11px 12px 0;
1115
+ }
1116
+
1117
+ .e-small.e-filled.e-float-input .e-multi-select-wrapper,
1118
+ .e-small .e-filled.e-float-input .e-multi-select-wrapper {
1119
+ padding: 12px 12px 0 8px;
1120
+ }
1121
+
1122
+ .e-rtl.e-multiselect.e-filled.e-input-group.e-control-wrapper,
1123
+ .e-rtl.e-multiselect.e-filled.e-float-input.e-control-wrapper {
1124
+ padding: 0;
1125
+ }
1126
+
1127
+ .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper input[type = 'text'] {
1128
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1129
+ min-height: $ddl-multiselect-filled-input-min-height;
1130
+ padding-right: 10px;
1131
+ }
1132
+ }
1133
+
1134
+ .e-small.e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper input[type = 'text'],
1135
+ .e-small .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper input[type = 'text'] {
1136
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1137
+ min-height: $ddl-multiselect-filled-input-min-height-small;
1138
+ }
1139
+ }
1140
+
1141
+ .e-small.e-multiselect.e-filled.e-float-input .e-multi-select-wrapper input[type = 'text'],
1142
+ .e-small .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper input[type = 'text'] {
1143
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1144
+ height: $ddl-multiselect-filled-float-input-min-height-small;
1145
+ min-height: $ddl-multiselect-filled-float-input-min-height-small;
1146
+ padding: 2px;
1147
+ }
1148
+ }
1149
+
1150
+ .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper.e-delimiter .e-searcher {
1151
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1152
+ height: $ddl-multiselect-filled-input-min-height;
1153
+ }
1154
+ }
1155
+
1156
+ .e-small.e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper.e-delimiter .e-searcher,
1157
+ .e-small .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper.e-delimiter .e-searcher {
1158
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1159
+ height: $ddl-multiselect-filled-input-min-height-small;
1160
+ }
1161
+ }
1162
+
1163
+ .e-small.e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-delimiter .e-searcher,
1164
+ .e-small .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-delimiter .e-searcher {
1165
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1166
+ height: $ddl-multiselect-filled-float-input-min-height-small;
1167
+ }
1168
+ }
1169
+
1170
+ .e-multiselect.e-filled.e-float-input .e-searcher .e-dropdownbase {
1171
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1172
+ min-height: $ddl-multiselect-filled-float-input-min-height;
1173
+ }
1174
+ }
1175
+
1176
+ .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-delim-values {
1177
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1178
+ font-size: 13px;
1179
+ line-height: $ddl-multiselect-filled-input-min-height;
1180
+ }
1181
+ }
1182
+
1183
+ .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values {
1184
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1185
+ font-size: 14px;
1186
+ line-height: $ddl-multiselect-filled-float-input-min-height;
1187
+ }
1188
+ }
1189
+
1190
+ .e-small.e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-delim-values,
1191
+ .e-small .e-multiselect.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-delim-values,
1192
+ .e-small.e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values,
1193
+ .e-small .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values {
1194
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1195
+ font-size: $ddl-delim-bigger-small-font-size;
1196
+ line-height: $ddl-multiselect-filled-input-min-height-small;
1197
+ }
1198
+ }
1199
+
1200
+ .e-small.e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values,
1201
+ .e-small .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper .e-delim-values {
1202
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1203
+ line-height: $ddl-multiselect-filled-float-input-min-height-small;
1204
+ }
1205
+ }
1206
+
1207
+ .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1208
+ height: 28px;
1209
+ }
1210
+
1211
+ .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
1212
+ .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
1213
+ .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips.e-mob-chip,
1214
+ .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
1215
+ .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1216
+ height: 24px;
1217
+ }
1218
+
1219
+ .e-filled.e-float-input .e-multi-select-wrapper .e-chips {
1220
+ height: 18px;
1221
+ }
1222
+
1223
+ .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
1224
+ .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1225
+ margin: 8px 8px 0 0;
1226
+ padding: 0 8px;
1227
+ }
1228
+
1229
+ .e-rtl.e-filled.e-float-input .e-multi-select-wrapper .e-chips,
1230
+ .e-rtl.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
1231
+ margin: 8px 0 0 8px;
1232
+ padding: 0 8px;
1233
+ }
1234
+
1235
+ .e-small .e-filled .e-multi-select-wrapper .e-chips,
1236
+ .e-small.e-filled .e-multi-select-wrapper .e-chips {
1237
+ height: 16px;
1238
+ margin: 4px 4px 0 0;
1239
+ padding-right: 8px;
1240
+ }
1241
+
1242
+ .e.rtl.e-small .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
1243
+ .e-rtl.e-small.e-filled.e-float-input .e-multi-select-wrapper .e-chips {
1244
+ margin: 4px 0 0 4px;
1245
+ }
1246
+
1247
+ .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper .e-chips:not(.e-mob-chip) .e-chips-close {
1248
+ @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'Material3' {
1249
+ height: $ddl-multiselect-filled-float-input-chip-clear-icon-size;
1250
+ width: $ddl-multiselect-filled-float-input-chip-clear-icon-size;
1251
+ }
1252
+ }
1253
+
1254
+ .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper .e-chips > .e-chipcontent {
1255
+ font-size: 13px;
1256
+ padding: 0 8px 0 0;
1257
+ }
1258
+
1259
+ .e-small.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
1260
+ .e-small .e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1261
+ font-size: 12px;
1262
+ }
1263
+
1264
+ .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1265
+ font-size: 12px;
1266
+ padding: 0 4px 0 0;
1267
+ }
1268
+
1269
+ .e-rtl.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1270
+ padding: 0 0 0 4px;
1271
+ }
1272
+
1273
+ .e-small.e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
1274
+ .e-small .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
1275
+ font-size: 10px;
1276
+ }
1277
+
1278
+ .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips > .e-chipcontent {
1279
+ font-size: 13px;
1280
+ padding-right: 4px;
1281
+ }
1282
+
1283
+ // Clear icon styles
1284
+
1285
+ .e-filled.e-multi-select-wrapper .e-chips-close.e-close-hooker,
1286
+ .e-multiselect.e-control-container .e-filled.e-multi-select-wrapper .e-clear-icon {
1287
+ height: 38px;
1288
+ margin-top: -38px;
1289
+ right: 12px;
1290
+ top: 100%;
1291
+ width: 16px;
1292
+ }
1293
+
1294
+ .e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
1295
+ .e-outline.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
1296
+ .e-filled.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
1297
+ .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
1298
+ .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container.e-input-group :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon {
1299
+ display: none;
1300
+ }
1301
+
1302
+ .e-multiselect.e-input-group.e-control-wrapper .e-input-group-icon {
1303
+ @if $ddl-multiselect-skin-name != 'Material3' {
1304
+ margin-right: 0;
1305
+ }
1306
+ @else {
1307
+ margin: 0;
1308
+ }
1309
+ }
1310
+
1311
+ .e-multiselect.e-control-container.e-input-group.e-disabled .e-input-group-icon.e-ddl-icon.e-icons,
1312
+ .e-multiselect.e-control-container.e-input-group.e-disabled .e-clear-icon {
1313
+ cursor: not-allowed;
1314
+ }
1315
+
1316
+ .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon,
1317
+ .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon .e-multi-searcher .e-dropdownbase.e-control.e-multiselect.e-lib {
1318
+ cursor: pointer;
1319
+ }
1320
+
1321
+ .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
1322
+ bottom: 0;
1323
+ right: 0;
1324
+ cursor: nwse-resize;
1325
+ height: 15px;
1326
+ position: absolute;
1327
+ width: 15px;
1328
+ }
1329
+
1330
+ .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
1331
+ @if $skin-name == 'bootstrap-dark' or $skin-name == 'material-dark' or $skin-name == 'tailwind-dark' or $skin-name == 'material3-dark' or $skin-name == 'bootstrap5-dark' or $skin-name == 'fluent-dark' or $skin-name == 'fabric-dark' or $skin-name == 'highcontrast' {
1332
+ background: transparent;
1333
+ color: rgb(221, 218, 218);
1334
+ }
1335
+ }