@syncfusion/ej2-dropdowns 18.1.57 → 18.2.44-4569

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