@syncfusion/ej2-splitbuttons 27.1.56 → 28.1.33

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 (112) hide show
  1. package/README.md +4 -4
  2. package/dist/ej2-splitbuttons.min.js +3 -3
  3. package/dist/ej2-splitbuttons.umd.min.js +3 -3
  4. package/dist/ej2-splitbuttons.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-splitbuttons.es2015.js +140 -46
  6. package/dist/es6/ej2-splitbuttons.es2015.js.map +1 -1
  7. package/dist/es6/ej2-splitbuttons.es5.js +146 -46
  8. package/dist/es6/ej2-splitbuttons.es5.js.map +1 -1
  9. package/dist/global/ej2-splitbuttons.min.js +3 -3
  10. package/dist/global/ej2-splitbuttons.min.js.map +1 -1
  11. package/dist/global/index.d.ts +2 -2
  12. package/package.json +8 -8
  13. package/src/common/common.d.ts +5 -0
  14. package/src/common/common.js +2 -2
  15. package/src/drop-down-button/drop-down-button-model.d.ts +63 -1
  16. package/src/drop-down-button/drop-down-button.d.ts +60 -3
  17. package/src/drop-down-button/drop-down-button.js +146 -45
  18. package/styles/bds-lite.css +1937 -0
  19. package/styles/bds-lite.scss +13 -0
  20. package/styles/bds.css +2148 -0
  21. package/styles/bds.scss +17 -0
  22. package/styles/bootstrap-dark-lite.css +11 -0
  23. package/styles/bootstrap-dark.css +11 -1
  24. package/styles/bootstrap-lite.css +11 -0
  25. package/styles/bootstrap.css +11 -1
  26. package/styles/bootstrap4-lite.css +11 -0
  27. package/styles/bootstrap4.css +11 -1
  28. package/styles/bootstrap5-dark-lite.css +11 -0
  29. package/styles/bootstrap5-dark.css +11 -1
  30. package/styles/bootstrap5-lite.css +11 -0
  31. package/styles/bootstrap5.3-lite.css +11 -0
  32. package/styles/bootstrap5.3.css +11 -1
  33. package/styles/bootstrap5.css +11 -1
  34. package/styles/button-group/_group-button-mixin.scss +2 -2
  35. package/styles/button-group/_layout.scss +1 -1
  36. package/styles/button-group/_tailwind3-definition.scss +31 -0
  37. package/styles/button-group/_theme.scss +83 -12
  38. package/styles/button-group/bds.css +861 -0
  39. package/styles/button-group/bds.scss +5 -0
  40. package/styles/button-group/tailwind3.css +847 -0
  41. package/styles/button-group/tailwind3.scss +5 -0
  42. package/styles/drop-down-button/_bigger.scss +20 -0
  43. package/styles/drop-down-button/_layout.scss +36 -3
  44. package/styles/drop-down-button/_tailwind3-definition.scss +53 -0
  45. package/styles/drop-down-button/_theme.scss +7 -0
  46. package/styles/drop-down-button/bds.css +372 -0
  47. package/styles/drop-down-button/bds.scss +7 -0
  48. package/styles/drop-down-button/bootstrap-dark.css +11 -1
  49. package/styles/drop-down-button/bootstrap.css +11 -1
  50. package/styles/drop-down-button/bootstrap4.css +11 -1
  51. package/styles/drop-down-button/bootstrap5-dark.css +11 -1
  52. package/styles/drop-down-button/bootstrap5.3.css +11 -1
  53. package/styles/drop-down-button/bootstrap5.css +11 -1
  54. package/styles/drop-down-button/fabric-dark.css +11 -1
  55. package/styles/drop-down-button/fabric.css +11 -1
  56. package/styles/drop-down-button/fluent-dark.css +11 -1
  57. package/styles/drop-down-button/fluent.css +11 -1
  58. package/styles/drop-down-button/fluent2.css +11 -1
  59. package/styles/drop-down-button/highcontrast-light.css +11 -1
  60. package/styles/drop-down-button/highcontrast.css +11 -1
  61. package/styles/drop-down-button/icons/_tailwind3.scss +10 -0
  62. package/styles/drop-down-button/material-dark.css +11 -1
  63. package/styles/drop-down-button/material.css +11 -1
  64. package/styles/drop-down-button/material3-dark.css +11 -1
  65. package/styles/drop-down-button/material3.css +11 -1
  66. package/styles/drop-down-button/tailwind-dark.css +11 -1
  67. package/styles/drop-down-button/tailwind.css +11 -1
  68. package/styles/drop-down-button/tailwind3.css +295 -0
  69. package/styles/drop-down-button/tailwind3.scss +7 -0
  70. package/styles/fabric-dark-lite.css +11 -0
  71. package/styles/fabric-dark.css +11 -1
  72. package/styles/fabric-lite.css +11 -0
  73. package/styles/fabric.css +11 -1
  74. package/styles/fluent-dark-lite.css +11 -0
  75. package/styles/fluent-dark.css +11 -1
  76. package/styles/fluent-lite.css +11 -0
  77. package/styles/fluent.css +11 -1
  78. package/styles/fluent2-lite.css +11 -0
  79. package/styles/fluent2.css +11 -1
  80. package/styles/highcontrast-light-lite.css +11 -0
  81. package/styles/highcontrast-light.css +11 -1
  82. package/styles/highcontrast-lite.css +11 -0
  83. package/styles/highcontrast.css +11 -1
  84. package/styles/material-dark-lite.css +11 -0
  85. package/styles/material-dark.css +11 -1
  86. package/styles/material-lite.css +11 -0
  87. package/styles/material.css +11 -1
  88. package/styles/material3-dark-lite.css +11 -0
  89. package/styles/material3-dark.css +11 -1
  90. package/styles/material3-lite.css +11 -0
  91. package/styles/material3.css +11 -1
  92. package/styles/progress-button/_tailwind3-definition.scss +20 -0
  93. package/styles/progress-button/_theme.scss +70 -0
  94. package/styles/progress-button/bds.css +683 -0
  95. package/styles/progress-button/bds.scss +6 -0
  96. package/styles/progress-button/tailwind3.css +636 -0
  97. package/styles/progress-button/tailwind3.scss +6 -0
  98. package/styles/split-button/_layout.scss +2 -2
  99. package/styles/split-button/_tailwind3-definition.scss +23 -0
  100. package/styles/split-button/_theme.scss +6 -1
  101. package/styles/split-button/bds.css +461 -0
  102. package/styles/split-button/bds.scss +7 -0
  103. package/styles/split-button/tailwind3.css +342 -0
  104. package/styles/split-button/tailwind3.scss +7 -0
  105. package/styles/tailwind-dark-lite.css +11 -0
  106. package/styles/tailwind-dark.css +11 -1
  107. package/styles/tailwind-lite.css +11 -0
  108. package/styles/tailwind.css +11 -1
  109. package/styles/tailwind3-lite.css +1891 -0
  110. package/styles/tailwind3-lite.scss +13 -0
  111. package/styles/tailwind3.css +2110 -0
  112. package/styles/tailwind3.scss +17 -0
@@ -140,6 +140,17 @@
140
140
  margin-right: 0;
141
141
  }
142
142
 
143
+ .e-dropdown-popup-width ul {
144
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
145
+ }
146
+
147
+ .e-dropdown-popup-width ul li {
148
+ overflow: hidden;
149
+ white-space: nowrap;
150
+ text-overflow: ellipsis;
151
+ display: block !important; /* stylelint-disable-line declaration-no-important */
152
+ }
153
+
143
154
  .e-dropdown-popup {
144
155
  background: #fff;
145
156
  color: #212529;
@@ -211,7 +222,6 @@
211
222
  line-height: 1;
212
223
  padding: 8px 16px;
213
224
  }
214
-
215
225
  *.e-bigger .e-dropdown-popup {
216
226
  background-color: transparent;
217
227
  border-radius: 4px;
@@ -144,6 +144,17 @@
144
144
  margin-right: 0;
145
145
  }
146
146
 
147
+ .e-dropdown-popup-width ul {
148
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
149
+ }
150
+
151
+ .e-dropdown-popup-width ul li {
152
+ overflow: hidden;
153
+ white-space: nowrap;
154
+ text-overflow: ellipsis;
155
+ display: block !important; /* stylelint-disable-line declaration-no-important */
156
+ }
157
+
147
158
  .e-dropdown-popup {
148
159
  background: #282727;
149
160
  color: #dadada;
@@ -215,7 +226,6 @@
215
226
  line-height: 1;
216
227
  padding: 10px 24px;
217
228
  }
218
-
219
229
  *.e-bigger .e-dropdown-popup ul,
220
230
  *.e-bigger.e-dropdown-popup ul {
221
231
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
@@ -144,6 +144,17 @@
144
144
  margin-right: 0;
145
145
  }
146
146
 
147
+ .e-dropdown-popup-width ul {
148
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
149
+ }
150
+
151
+ .e-dropdown-popup-width ul li {
152
+ overflow: hidden;
153
+ white-space: nowrap;
154
+ text-overflow: ellipsis;
155
+ display: block !important; /* stylelint-disable-line declaration-no-important */
156
+ }
157
+
147
158
  .e-dropdown-popup {
148
159
  background: #fff;
149
160
  color: #333;
@@ -215,7 +226,6 @@
215
226
  line-height: 1;
216
227
  padding: 10px 24px;
217
228
  }
218
-
219
229
  *.e-bigger .e-dropdown-popup ul,
220
230
  *.e-bigger.e-dropdown-popup ul {
221
231
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
@@ -146,6 +146,17 @@
146
146
  margin-right: 0;
147
147
  }
148
148
 
149
+ .e-dropdown-popup-width ul {
150
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
151
+ }
152
+
153
+ .e-dropdown-popup-width ul li {
154
+ overflow: hidden;
155
+ white-space: nowrap;
156
+ text-overflow: ellipsis;
157
+ display: block !important; /* stylelint-disable-line declaration-no-important */
158
+ }
159
+
149
160
  .e-dropdown-popup {
150
161
  background: #252423;
151
162
  color: #fff;
@@ -216,7 +227,6 @@
216
227
  line-height: 1;
217
228
  padding: 8px 16px;
218
229
  }
219
-
220
230
  *.e-bigger .e-dropdown-popup ul,
221
231
  *.e-bigger.e-dropdown-popup ul {
222
232
  -webkit-box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
@@ -146,6 +146,17 @@
146
146
  margin-right: 0;
147
147
  }
148
148
 
149
+ .e-dropdown-popup-width ul {
150
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
151
+ }
152
+
153
+ .e-dropdown-popup-width ul li {
154
+ overflow: hidden;
155
+ white-space: nowrap;
156
+ text-overflow: ellipsis;
157
+ display: block !important; /* stylelint-disable-line declaration-no-important */
158
+ }
159
+
149
160
  .e-dropdown-popup {
150
161
  background: #fff;
151
162
  color: #323130;
@@ -216,7 +227,6 @@
216
227
  line-height: 1;
217
228
  padding: 8px 16px;
218
229
  }
219
-
220
230
  *.e-bigger .e-dropdown-popup ul,
221
231
  *.e-bigger.e-dropdown-popup ul {
222
232
  -webkit-box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
@@ -169,6 +169,17 @@
169
169
  margin-right: 0;
170
170
  }
171
171
 
172
+ .e-dropdown-popup-width ul {
173
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
174
+ }
175
+
176
+ .e-dropdown-popup-width ul li {
177
+ overflow: hidden;
178
+ white-space: nowrap;
179
+ text-overflow: ellipsis;
180
+ display: block !important; /* stylelint-disable-line declaration-no-important */
181
+ }
182
+
172
183
  .e-dropdown-popup {
173
184
  background: var(--color-sf-flyout-bg-color);
174
185
  color: var(--color-sf-secondary-text-color);
@@ -252,7 +263,6 @@
252
263
  line-height: 1;
253
264
  padding: 8px 16px;
254
265
  }
255
-
256
266
  *.e-bigger .e-dropdown-popup ul,
257
267
  *.e-bigger.e-dropdown-popup ul {
258
268
  -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
@@ -144,6 +144,17 @@
144
144
  margin-right: 0;
145
145
  }
146
146
 
147
+ .e-dropdown-popup-width ul {
148
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
149
+ }
150
+
151
+ .e-dropdown-popup-width ul li {
152
+ overflow: hidden;
153
+ white-space: nowrap;
154
+ text-overflow: ellipsis;
155
+ display: block !important; /* stylelint-disable-line declaration-no-important */
156
+ }
157
+
147
158
  .e-dropdown-popup {
148
159
  background: #fff;
149
160
  color: #000;
@@ -215,7 +226,6 @@
215
226
  line-height: 1;
216
227
  padding: 10px 24px;
217
228
  }
218
-
219
229
  *.e-bigger .e-dropdown-popup ul,
220
230
  *.e-bigger.e-dropdown-popup ul {
221
231
  -webkit-box-shadow: 0 6px 12px rgba(255, 255, 255, 0.175);
@@ -145,6 +145,17 @@
145
145
  margin-right: 0;
146
146
  }
147
147
 
148
+ .e-dropdown-popup-width ul {
149
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
150
+ }
151
+
152
+ .e-dropdown-popup-width ul li {
153
+ overflow: hidden;
154
+ white-space: nowrap;
155
+ text-overflow: ellipsis;
156
+ display: block !important; /* stylelint-disable-line declaration-no-important */
157
+ }
158
+
148
159
  .e-dropdown-popup {
149
160
  background: #000;
150
161
  color: #fff;
@@ -216,7 +227,6 @@
216
227
  line-height: 1;
217
228
  padding: 10px 24px;
218
229
  }
219
-
220
230
  *.e-bigger .e-dropdown-popup ul,
221
231
  *.e-bigger.e-dropdown-popup ul {
222
232
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
@@ -0,0 +1,10 @@
1
+ @include export-module('drop-down-button-tailwind3-icons') {
2
+ .e-dropdown-btn,
3
+ .e-dropdown-btn.e-btn {
4
+ .e-caret {
5
+ &::before {
6
+ content: '\e729';
7
+ }
8
+ }
9
+ }
10
+ }
@@ -144,6 +144,17 @@
144
144
  margin-right: 0;
145
145
  }
146
146
 
147
+ .e-dropdown-popup-width ul {
148
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
149
+ }
150
+
151
+ .e-dropdown-popup-width ul li {
152
+ overflow: hidden;
153
+ white-space: nowrap;
154
+ text-overflow: ellipsis;
155
+ display: block !important; /* stylelint-disable-line declaration-no-important */
156
+ }
157
+
147
158
  .e-dropdown-popup {
148
159
  background: #424242;
149
160
  color: #fff;
@@ -215,7 +226,6 @@
215
226
  line-height: 1;
216
227
  padding: 16px 16px;
217
228
  }
218
-
219
229
  *.e-bigger .e-dropdown-popup ul,
220
230
  *.e-bigger.e-dropdown-popup ul {
221
231
  -webkit-box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.26);
@@ -144,6 +144,17 @@
144
144
  margin-right: 0;
145
145
  }
146
146
 
147
+ .e-dropdown-popup-width ul {
148
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
149
+ }
150
+
151
+ .e-dropdown-popup-width ul li {
152
+ overflow: hidden;
153
+ white-space: nowrap;
154
+ text-overflow: ellipsis;
155
+ display: block !important; /* stylelint-disable-line declaration-no-important */
156
+ }
157
+
147
158
  .e-dropdown-popup {
148
159
  background: #fff;
149
160
  color: rgba(0, 0, 0, 0.87);
@@ -215,7 +226,6 @@
215
226
  line-height: 1;
216
227
  padding: 16px 16px;
217
228
  }
218
-
219
229
  *.e-bigger .e-dropdown-popup ul,
220
230
  *.e-bigger.e-dropdown-popup ul {
221
231
  -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
@@ -154,6 +154,17 @@
154
154
  margin-right: 0;
155
155
  }
156
156
 
157
+ .e-dropdown-popup-width ul {
158
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
159
+ }
160
+
161
+ .e-dropdown-popup-width ul li {
162
+ overflow: hidden;
163
+ white-space: nowrap;
164
+ text-overflow: ellipsis;
165
+ display: block !important; /* stylelint-disable-line declaration-no-important */
166
+ }
167
+
157
168
  .e-dropdown-popup {
158
169
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.11)), to(rgba(var(--color-sf-primary), 0.11))), rgba(var(--color-sf-surface));
159
170
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
@@ -226,7 +237,6 @@
226
237
  line-height: 1;
227
238
  padding: 8px 16px;
228
239
  }
229
-
230
240
  *.e-bigger .e-dropdown-popup ul,
231
241
  *.e-bigger.e-dropdown-popup ul {
232
242
  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
@@ -156,6 +156,17 @@
156
156
  margin-right: 0;
157
157
  }
158
158
 
159
+ .e-dropdown-popup-width ul {
160
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
161
+ }
162
+
163
+ .e-dropdown-popup-width ul li {
164
+ overflow: hidden;
165
+ white-space: nowrap;
166
+ text-overflow: ellipsis;
167
+ display: block !important; /* stylelint-disable-line declaration-no-important */
168
+ }
169
+
159
170
  .e-dropdown-popup {
160
171
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-surface), 1)), to(rgba(var(--color-sf-surface), 1))), rgba(var(--color-sf-surface));
161
172
  background: linear-gradient(0deg, rgba(var(--color-sf-surface), 1), rgba(var(--color-sf-surface), 1)), rgba(var(--color-sf-surface));
@@ -228,7 +239,6 @@
228
239
  line-height: 1;
229
240
  padding: 8px 16px;
230
241
  }
231
-
232
242
  *.e-bigger .e-dropdown-popup ul,
233
243
  *.e-bigger.e-dropdown-popup ul {
234
244
  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
@@ -147,6 +147,17 @@
147
147
  margin-right: 0;
148
148
  }
149
149
 
150
+ .e-dropdown-popup-width ul {
151
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
152
+ }
153
+
154
+ .e-dropdown-popup-width ul li {
155
+ overflow: hidden;
156
+ white-space: nowrap;
157
+ text-overflow: ellipsis;
158
+ display: block !important; /* stylelint-disable-line declaration-no-important */
159
+ }
160
+
150
161
  .e-dropdown-popup {
151
162
  background: #374151;
152
163
  color: #fff;
@@ -218,7 +229,6 @@
218
229
  line-height: 1;
219
230
  padding: 8px 16px;
220
231
  }
221
-
222
232
  *.e-bigger .e-dropdown-popup {
223
233
  background-color: transparent;
224
234
  border-radius: 4px;
@@ -147,6 +147,17 @@
147
147
  margin-right: 0;
148
148
  }
149
149
 
150
+ .e-dropdown-popup-width ul {
151
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
152
+ }
153
+
154
+ .e-dropdown-popup-width ul li {
155
+ overflow: hidden;
156
+ white-space: nowrap;
157
+ text-overflow: ellipsis;
158
+ display: block !important; /* stylelint-disable-line declaration-no-important */
159
+ }
160
+
150
161
  .e-dropdown-popup {
151
162
  background: #fff;
152
163
  color: #374151;
@@ -218,7 +229,6 @@
218
229
  line-height: 1;
219
230
  padding: 8px 16px;
220
231
  }
221
-
222
232
  *.e-bigger .e-dropdown-popup {
223
233
  background-color: transparent;
224
234
  border-radius: 4px;
@@ -0,0 +1,295 @@
1
+
2
+
3
+
4
+
5
+ /* stylelint-disable-line no-empty-source */
6
+ .e-dropdown-btn .e-caret::before,
7
+ .e-dropdown-btn.e-btn .e-caret::before {
8
+ content: "\e729";
9
+ }
10
+
11
+ .e-dropdown-btn,
12
+ .e-dropdown-btn.e-btn {
13
+ text-transform: none;
14
+ white-space: normal;
15
+ }
16
+ .e-dropdown-btn:hover,
17
+ .e-dropdown-btn.e-btn:hover {
18
+ -webkit-box-shadow: none;
19
+ box-shadow: none;
20
+ }
21
+ .e-dropdown-btn:active,
22
+ .e-dropdown-btn.e-btn:active {
23
+ -webkit-box-shadow: 0 0 0 4px rgba(var(--color-sf-secondary-shadow), 0.5);
24
+ box-shadow: 0 0 0 4px rgba(var(--color-sf-secondary-shadow), 0.5);
25
+ }
26
+ .e-dropdown-btn .e-btn-icon,
27
+ .e-dropdown-btn.e-btn .e-btn-icon {
28
+ font-size: 14px;
29
+ }
30
+ .e-dropdown-btn .e-caret,
31
+ .e-dropdown-btn.e-btn .e-caret {
32
+ font-size: 14px;
33
+ }
34
+ .e-dropdown-btn.e-vertical,
35
+ .e-dropdown-btn.e-btn.e-vertical {
36
+ line-height: 1;
37
+ padding: 6px 12px;
38
+ }
39
+ .e-dropdown-btn.e-caret-hide .e-caret,
40
+ .e-dropdown-btn.e-btn.e-caret-hide .e-caret {
41
+ display: none;
42
+ }
43
+ .e-dropdown-btn.e-small .e-dropdown-popup ul,
44
+ .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul {
45
+ padding: 4px 0;
46
+ }
47
+ .e-dropdown-btn.e-small .e-dropdown-popup ul .e-item,
48
+ .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul .e-item {
49
+ padding: 0 8px;
50
+ }
51
+ .e-dropdown-btn.e-small.e-vertical,
52
+ .e-dropdown-btn.e-btn.e-small.e-vertical {
53
+ line-height: 1;
54
+ padding: 6px 12px;
55
+ }
56
+ .e-dropdown-btn.e-small .e-btn-icon,
57
+ .e-dropdown-btn.e-btn.e-small .e-btn-icon {
58
+ font-size: 12px;
59
+ }
60
+ .e-small.e-dropdown-popup ul .e-item {
61
+ height: 24px;
62
+ font-size: 12px;
63
+ line-height: 24px;
64
+ }
65
+ .e-small.e-dropdown-popup ul .e-item .e-menu-icon {
66
+ font-size: 12px;
67
+ line-height: 24px;
68
+ }
69
+
70
+ .e-dropdown-popup {
71
+ position: absolute;
72
+ }
73
+ .e-dropdown-popup ul {
74
+ border: 1px solid var(--color-sf-border-light);
75
+ border-radius: 4px;
76
+ -webkit-box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
77
+ box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
78
+ -webkit-box-sizing: border-box;
79
+ box-sizing: border-box;
80
+ font-size: 14px;
81
+ font-weight: 400;
82
+ list-style-image: none;
83
+ list-style-position: outside;
84
+ list-style-type: none;
85
+ margin: 0;
86
+ min-width: 120px;
87
+ overflow: hidden;
88
+ padding: 4px 0;
89
+ -webkit-user-select: none;
90
+ -moz-user-select: none;
91
+ -ms-user-select: none;
92
+ user-select: none;
93
+ white-space: nowrap;
94
+ }
95
+ .e-dropdown-popup ul .e-item {
96
+ cursor: pointer;
97
+ display: -webkit-box;
98
+ display: -ms-flexbox;
99
+ display: flex;
100
+ height: 32px;
101
+ line-height: 32px;
102
+ padding: 0 12px;
103
+ }
104
+ .e-dropdown-popup ul .e-item.e-separator {
105
+ padding: 0 !important; /* stylelint-disable-line declaration-no-important */
106
+ }
107
+ .e-dropdown-popup ul .e-item.e-url {
108
+ padding: 0;
109
+ }
110
+ .e-dropdown-popup ul .e-item .e-menu-url {
111
+ display: block;
112
+ padding: 0 12px;
113
+ text-decoration: none;
114
+ width: 100%;
115
+ }
116
+ .e-dropdown-popup ul .e-item .e-menu-icon {
117
+ float: left;
118
+ font-size: 14px;
119
+ line-height: 32px;
120
+ margin-right: 11px;
121
+ vertical-align: middle;
122
+ width: 1em;
123
+ }
124
+ .e-dropdown-popup ul .e-item.e-disabled {
125
+ cursor: auto;
126
+ pointer-events: none;
127
+ color: var(--color-sf-flyout-text-color-disabled);
128
+ opacity: 1;
129
+ }
130
+ .e-dropdown-popup ul .e-item.e-disabled .e-menu-icon {
131
+ color: var(--color-sf-flyout-text-color-disabled);
132
+ }
133
+ .e-dropdown-popup ul .e-item.e-separator {
134
+ border-bottom-style: solid;
135
+ border-bottom-width: 1px;
136
+ cursor: auto;
137
+ height: auto;
138
+ line-height: normal;
139
+ margin: 3px 0;
140
+ pointer-events: none;
141
+ }
142
+ .e-dropdown-popup.e-transparent {
143
+ background: transparent;
144
+ -webkit-box-shadow: none;
145
+ box-shadow: none;
146
+ }
147
+ .e-dropdown-popup.e-transparent .e-dropdown-menu {
148
+ border: 0;
149
+ height: 1px;
150
+ min-width: 0;
151
+ padding: 0;
152
+ width: 1px;
153
+ }
154
+ .e-dropdown-popup.e-hidden {
155
+ display: none !important; /* stylelint-disable-line declaration-no-important */
156
+ }
157
+
158
+ .e-rtl.e-dropdown-popup .e-item .e-menu-icon {
159
+ float: right;
160
+ margin-left: 11px;
161
+ margin-right: 0;
162
+ }
163
+
164
+ .e-dropdown-popup-width ul {
165
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
166
+ }
167
+
168
+ .e-dropdown-popup-width ul li {
169
+ overflow: hidden;
170
+ white-space: nowrap;
171
+ text-overflow: ellipsis;
172
+ display: block !important; /* stylelint-disable-line declaration-no-important */
173
+ }
174
+
175
+ .e-dropdown-popup {
176
+ background: var(--color-sf-flyout-bg-color);
177
+ color: var(--color-sf-content-text-color);
178
+ }
179
+ .e-dropdown-popup ul .e-item .e-menu-url {
180
+ color: var(--color-sf-content-text-color);
181
+ }
182
+ .e-dropdown-popup ul .e-item .e-menu-icon {
183
+ color: var(--color-sf-icon-color);
184
+ }
185
+ .e-dropdown-popup ul .e-item.e-focused {
186
+ background: var(--color-sf-flyout-bg-color-hover);
187
+ -webkit-box-shadow: inset 0 0 0 2px var(--color-sf-primary);
188
+ box-shadow: inset 0 0 0 2px var(--color-sf-primary);
189
+ }
190
+ .e-dropdown-popup ul .e-item:hover {
191
+ background: var(--color-sf-flyout-bg-color-hover);
192
+ color: var(--color-sf-content-text-color);
193
+ }
194
+ .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
195
+ background: var(--color-sf-flyout-bg-color-selected);
196
+ color: var(--color-sf-flyout-text-color-selected);
197
+ }
198
+ .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
199
+ color: var(--color-sf-flyout-text-color-selected);
200
+ }
201
+ .e-dropdown-popup ul .e-item:active .e-menu-icon, .e-dropdown-popup ul .e-item.e-selected .e-menu-icon {
202
+ color: var(--color-sf-flyout-text-color-selected);
203
+ }
204
+ .e-dropdown-popup ul .e-item:focus {
205
+ background: var(--color-sf-flyout-bg-color-hover);
206
+ color: var(--color-sf-content-text-color);
207
+ }
208
+ .e-dropdown-popup ul .e-separator {
209
+ border-bottom-color: var(--color-sf-border-light);
210
+ }
211
+
212
+ .e-dropdown-btn.e-inherit,
213
+ .e-dropdown-btn.e-btn.e-inherit {
214
+ background: inherit;
215
+ border-color: transparent;
216
+ -webkit-box-shadow: none;
217
+ box-shadow: none;
218
+ color: inherit;
219
+ }
220
+ .e-dropdown-btn.e-inherit:hover, .e-dropdown-btn.e-inherit:focus, .e-dropdown-btn.e-inherit:active, .e-dropdown-btn.e-inherit.e-active,
221
+ .e-dropdown-btn.e-btn.e-inherit:hover,
222
+ .e-dropdown-btn.e-btn.e-inherit:focus,
223
+ .e-dropdown-btn.e-btn.e-inherit:active,
224
+ .e-dropdown-btn.e-btn.e-inherit.e-active {
225
+ background: rgba(0, 0, 0, 0.056);
226
+ border-color: transparent;
227
+ -webkit-box-shadow: none;
228
+ box-shadow: none;
229
+ color: inherit;
230
+ }
231
+
232
+ .e-bigger .e-dropdown-btn .e-btn-icon,
233
+ .e-bigger.e-dropdown-btn .e-btn-icon {
234
+ font-size: 16px;
235
+ }
236
+ .e-bigger .e-dropdown-btn .e-caret,
237
+ .e-bigger.e-dropdown-btn .e-caret {
238
+ font-size: 16px;
239
+ }
240
+ .e-bigger .e-dropdown-btn.e-vertical,
241
+ .e-bigger.e-dropdown-btn.e-vertical {
242
+ line-height: 1;
243
+ padding: 8px 16px;
244
+ }
245
+ .e-bigger .e-dropdown-btn.e-small.e-vertical,
246
+ .e-bigger.e-dropdown-btn.e-small.e-vertical {
247
+ line-height: 1;
248
+ padding: 8px 16px;
249
+ }
250
+ .e-bigger .e-dropdown-btn.e-small .e-btn-icon,
251
+ .e-bigger.e-dropdown-btn.e-small .e-btn-icon {
252
+ font-size: 16px;
253
+ }
254
+
255
+ .e-bigger .e-small.e-dropdown-popup ul .e-item,
256
+ .e-bigger.e-small.e-dropdown-popup ul .e-item {
257
+ height: 32px;
258
+ font-size: 16px;
259
+ line-height: 32px;
260
+ }
261
+ .e-bigger .e-small.e-dropdown-popup ul .e-item .e-menu-icon,
262
+ .e-bigger.e-small.e-dropdown-popup ul .e-item .e-menu-icon {
263
+ font-size: 16px;
264
+ line-height: 32px;
265
+ }
266
+
267
+ *.e-bigger .e-dropdown-popup ul,
268
+ *.e-bigger.e-dropdown-popup ul {
269
+ -webkit-box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
270
+ box-shadow: 0 0 4px 0 rgba(var(--color-sf-black), 0.1), 0 4px 6px -4px rgba(var(--color-sf-black), 0.1), 0 10px 15px -3px rgba(var(--color-sf-black), 0.1);
271
+ font-size: 16px;
272
+ max-width: 202px;
273
+ min-width: 112px;
274
+ padding: 8px 0;
275
+ }
276
+ *.e-bigger .e-dropdown-popup ul .e-item,
277
+ *.e-bigger.e-dropdown-popup ul .e-item {
278
+ height: 40px;
279
+ line-height: 40px;
280
+ padding: 0 16px;
281
+ }
282
+ *.e-bigger .e-dropdown-popup ul .e-item.e-url,
283
+ *.e-bigger.e-dropdown-popup ul .e-item.e-url {
284
+ padding: 0;
285
+ }
286
+ *.e-bigger .e-dropdown-popup ul .e-item .e-menu-icon,
287
+ *.e-bigger.e-dropdown-popup ul .e-item .e-menu-icon {
288
+ font-size: 16px;
289
+ line-height: 40px;
290
+ }
291
+ *.e-bigger .e-dropdown-popup ul .e-item.e-separator,
292
+ *.e-bigger.e-dropdown-popup ul .e-item.e-separator {
293
+ height: auto;
294
+ line-height: normal;
295
+ }
@@ -0,0 +1,7 @@
1
+ @import 'ej2-base/styles/definition/tailwind3.scss';
2
+ @import 'ej2-buttons/styles/button/tailwind3-definition.scss';
3
+ @import 'ej2-popups/styles/popup/tailwind3-definition.scss';
4
+ @import 'tailwind3-definition.scss';
5
+ @import 'icons/tailwind3.scss';
6
+ @import 'all.scss';
7
+ @import 'bigger.scss';
@@ -144,6 +144,17 @@
144
144
  margin-right: 0;
145
145
  }
146
146
 
147
+ .e-dropdown-popup-width ul {
148
+ min-width: 0 !important; /* stylelint-disable-line declaration-no-important */
149
+ }
150
+
151
+ .e-dropdown-popup-width ul li {
152
+ overflow: hidden;
153
+ white-space: nowrap;
154
+ text-overflow: ellipsis;
155
+ display: block !important; /* stylelint-disable-line declaration-no-important */
156
+ }
157
+
147
158
  .e-dropdown-popup {
148
159
  background: #282727;
149
160
  color: #dadada;