@syncfusion/ej2-react-splitbuttons 25.2.4 → 26.1.35

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 (102) hide show
  1. package/dist/ej2-react-splitbuttons.min.js +2 -2
  2. package/dist/ej2-react-splitbuttons.umd.min.js +2 -2
  3. package/dist/ej2-react-splitbuttons.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-react-splitbuttons.es2015.js +5 -5
  5. package/dist/es6/ej2-react-splitbuttons.es2015.js.map +1 -1
  6. package/package.json +9 -9
  7. package/styles/bootstrap-dark.css +1966 -1
  8. package/styles/bootstrap.css +2016 -1
  9. package/styles/bootstrap4.css +2004 -1
  10. package/styles/bootstrap5-dark.css +1946 -1
  11. package/styles/bootstrap5.css +1946 -1
  12. package/styles/button-group/bootstrap-dark.css +813 -1
  13. package/styles/button-group/bootstrap.css +787 -1
  14. package/styles/button-group/bootstrap4.css +786 -1
  15. package/styles/button-group/bootstrap5-dark.css +801 -1
  16. package/styles/button-group/bootstrap5.css +801 -1
  17. package/styles/button-group/fabric-dark.css +813 -1
  18. package/styles/button-group/fabric.css +819 -1
  19. package/styles/button-group/fluent-dark.css +825 -1
  20. package/styles/button-group/fluent.css +825 -1
  21. package/styles/button-group/fluent2.css +1849 -0
  22. package/styles/button-group/fluent2.scss +1 -0
  23. package/styles/button-group/highcontrast-light.css +813 -1
  24. package/styles/button-group/highcontrast.css +864 -1
  25. package/styles/button-group/material-dark.css +820 -1
  26. package/styles/button-group/material.css +825 -1
  27. package/styles/button-group/material3-dark.css +1055 -1
  28. package/styles/button-group/material3.css +1167 -1
  29. package/styles/button-group/tailwind-dark.css +799 -1
  30. package/styles/button-group/tailwind.css +799 -1
  31. package/styles/drop-down-button/bootstrap-dark.css +244 -1
  32. package/styles/drop-down-button/bootstrap.css +244 -1
  33. package/styles/drop-down-button/bootstrap4.css +237 -1
  34. package/styles/drop-down-button/bootstrap5-dark.css +247 -1
  35. package/styles/drop-down-button/bootstrap5.css +247 -1
  36. package/styles/drop-down-button/fabric-dark.css +244 -1
  37. package/styles/drop-down-button/fabric.css +244 -1
  38. package/styles/drop-down-button/fluent-dark.css +245 -1
  39. package/styles/drop-down-button/fluent.css +245 -1
  40. package/styles/drop-down-button/fluent2.css +1308 -0
  41. package/styles/drop-down-button/fluent2.scss +1 -0
  42. package/styles/drop-down-button/highcontrast-light.css +244 -1
  43. package/styles/drop-down-button/highcontrast.css +245 -1
  44. package/styles/drop-down-button/material-dark.css +244 -1
  45. package/styles/drop-down-button/material.css +244 -1
  46. package/styles/drop-down-button/material3-dark.css +363 -1
  47. package/styles/drop-down-button/material3.css +475 -1
  48. package/styles/drop-down-button/tailwind-dark.css +254 -1
  49. package/styles/drop-down-button/tailwind.css +254 -1
  50. package/styles/fabric-dark.css +1966 -1
  51. package/styles/fabric.css +2046 -1
  52. package/styles/fluent-dark.css +2061 -1
  53. package/styles/fluent.css +2061 -1
  54. package/styles/fluent2.css +6175 -0
  55. package/styles/fluent2.scss +4 -0
  56. package/styles/highcontrast-light.css +1966 -1
  57. package/styles/highcontrast.css +2018 -1
  58. package/styles/material-dark.css +1973 -1
  59. package/styles/material.css +2052 -1
  60. package/styles/material3-dark.css +2647 -1
  61. package/styles/material3.css +3087 -1
  62. package/styles/progress-button/bootstrap-dark.css +564 -1
  63. package/styles/progress-button/bootstrap.css +641 -1
  64. package/styles/progress-button/bootstrap4.css +644 -1
  65. package/styles/progress-button/bootstrap5-dark.css +564 -1
  66. package/styles/progress-button/bootstrap5.css +564 -1
  67. package/styles/progress-button/fabric-dark.css +564 -1
  68. package/styles/progress-button/fabric.css +641 -1
  69. package/styles/progress-button/fluent-dark.css +657 -1
  70. package/styles/progress-button/fluent.css +657 -1
  71. package/styles/progress-button/fluent2.css +1636 -0
  72. package/styles/progress-button/fluent2.scss +1 -0
  73. package/styles/progress-button/highcontrast-light.css +564 -1
  74. package/styles/progress-button/highcontrast.css +564 -1
  75. package/styles/progress-button/material-dark.css +564 -1
  76. package/styles/progress-button/material.css +641 -1
  77. package/styles/progress-button/material3-dark.css +730 -1
  78. package/styles/progress-button/material3.css +842 -1
  79. package/styles/progress-button/tailwind-dark.css +661 -1
  80. package/styles/progress-button/tailwind.css +661 -1
  81. package/styles/split-button/bootstrap-dark.css +342 -1
  82. package/styles/split-button/bootstrap.css +342 -1
  83. package/styles/split-button/bootstrap4.css +334 -1
  84. package/styles/split-button/bootstrap5-dark.css +331 -1
  85. package/styles/split-button/bootstrap5.css +331 -1
  86. package/styles/split-button/fabric-dark.css +342 -1
  87. package/styles/split-button/fabric.css +339 -1
  88. package/styles/split-button/fluent-dark.css +331 -1
  89. package/styles/split-button/fluent.css +331 -1
  90. package/styles/split-button/fluent2.css +1379 -0
  91. package/styles/split-button/fluent2.scss +1 -0
  92. package/styles/split-button/highcontrast-light.css +342 -1
  93. package/styles/split-button/highcontrast.css +342 -1
  94. package/styles/split-button/material-dark.css +342 -1
  95. package/styles/split-button/material.css +339 -1
  96. package/styles/split-button/material3-dark.css +496 -1
  97. package/styles/split-button/material3.css +600 -1
  98. package/styles/split-button/tailwind-dark.css +356 -1
  99. package/styles/split-button/tailwind.css +356 -1
  100. package/styles/tailwind-dark.css +2072 -1
  101. package/styles/tailwind.css +2072 -1
  102. package/CHANGELOG.md +0 -328
@@ -1 +1,496 @@
1
- @import '@syncfusion/ej2-splitbuttons/styles/split-button/material3-dark.css';
1
+ :root {
2
+ --color-sf-black: 0, 0, 0;
3
+ --color-sf-white: 255, 255, 255;
4
+ --color-sf-primary: 208, 188, 255;
5
+ --color-sf-primary-container: 79, 55, 139;
6
+ --color-sf-secondary: 204, 194, 220;
7
+ --color-sf-secondary-container: 74, 68, 88;
8
+ --color-sf-tertiary: 239, 184, 200;
9
+ --color-sf-tertiary-container: 99, 59, 72;
10
+ --color-sf-surface: 28, 27, 31;
11
+ --color-sf-surface-variant: 73, 69, 79;
12
+ --color-sf-background: var(--color-sf-surface);
13
+ --color-sf-on-primary: 55, 30, 115;
14
+ --color-sf-on-primary-container: 234, 221, 255;
15
+ --color-sf-on-secondary: 51, 45, 65;
16
+ --color-sf-on-secondary-container: 232, 222, 248;
17
+ --color-sf-on-tertiary: 73, 37, 50;
18
+ --color-sf-on-tertiary-containe: 255, 216, 228;
19
+ --color-sf-on-surface: 230, 225, 229;
20
+ --color-sf-on-surface-variant: 202, 196, 208;
21
+ --color-sf-on-background: 230, 225, 229;
22
+ --color-sf-outline: 147, 143, 153;
23
+ --color-sf-outline-variant: 68, 71, 70;
24
+ --color-sf-shadow: 0, 0, 0;
25
+ --color-sf-surface-tint-color: 208, 188, 255;
26
+ --color-sf-inverse-surface: 230, 225, 229;
27
+ --color-sf-inverse-on-surface: 49, 48, 51;
28
+ --color-sf-inverse-primary: 103, 80, 164;
29
+ --color-sf-scrim: 0, 0, 0;
30
+ --color-sf-error: 242, 184, 181;
31
+ --color-sf-error-container: 140, 29, 24;
32
+ --color-sf-on-error: 96, 20, 16;
33
+ --color-sf-on-error-container: 249, 222, 220;
34
+ --color-sf-success: 83, 202, 23;
35
+ --color-sf-success-container: 22, 62, 2;
36
+ --color-sf-on-success: 13, 39, 0;
37
+ --color-sf-on-success-container: 183, 250, 150;
38
+ --color-sf-info: 71, 172, 251;
39
+ --color-sf-info-container: 0, 67, 120;
40
+ --color-sf-on-info: 0, 51, 91;
41
+ --color-sf-on-info-container: 173, 219, 255;
42
+ --color-sf-warning: 245, 180, 130;
43
+ --color-sf-warning-container: 123, 65, 0;
44
+ --color-sf-on-warning: 99, 52, 0;
45
+ --color-sf-on-warning-container: 255, 220, 193;
46
+ --color-sf-spreadsheet-gridline: 231, 224, 236;
47
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
48
+ --color-sf-success-text: 0, 0, 0;
49
+ --color-sf-warning-text: 0, 0, 0;
50
+ --color-sf-info-text: 0, 0, 0;
51
+ --color-sf-danger-text: 0, 0, 0;
52
+ --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
53
+ --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
54
+ }
55
+
56
+ :root {
57
+ --color-sf-black: 0, 0, 0;
58
+ --color-sf-white: 255, 255, 255;
59
+ --color-sf-primary: 208, 188, 255;
60
+ --color-sf-primary-container: 79, 55, 139;
61
+ --color-sf-secondary: 204, 194, 220;
62
+ --color-sf-secondary-container: 74, 68, 88;
63
+ --color-sf-tertiary: 239, 184, 200;
64
+ --color-sf-tertiary-container: 99, 59, 72;
65
+ --color-sf-surface: 28, 27, 31;
66
+ --color-sf-surface-variant: 73, 69, 79;
67
+ --color-sf-background: var(--color-sf-surface);
68
+ --color-sf-on-primary: 55, 30, 115;
69
+ --color-sf-on-primary-container: 234, 221, 255;
70
+ --color-sf-on-secondary: 51, 45, 65;
71
+ --color-sf-on-secondary-container: 232, 222, 248;
72
+ --color-sf-on-tertiary: 73, 37, 50;
73
+ --color-sf-on-tertiary-containe: 255, 216, 228;
74
+ --color-sf-on-surface: 230, 225, 229;
75
+ --color-sf-on-surface-variant: 202, 196, 208;
76
+ --color-sf-on-background: 230, 225, 229;
77
+ --color-sf-outline: 147, 143, 153;
78
+ --color-sf-outline-variant: 68, 71, 70;
79
+ --color-sf-shadow: 0, 0, 0;
80
+ --color-sf-surface-tint-color: 208, 188, 255;
81
+ --color-sf-inverse-surface: 230, 225, 229;
82
+ --color-sf-inverse-on-surface: 49, 48, 51;
83
+ --color-sf-inverse-primary: 103, 80, 164;
84
+ --color-sf-scrim: 0, 0, 0;
85
+ --color-sf-error: 242, 184, 181;
86
+ --color-sf-error-container: 140, 29, 24;
87
+ --color-sf-on-error: 96, 20, 16;
88
+ --color-sf-on-error-container: 249, 222, 220;
89
+ --color-sf-success: 83, 202, 23;
90
+ --color-sf-success-container: 22, 62, 2;
91
+ --color-sf-on-success: 13, 39, 0;
92
+ --color-sf-on-success-container: 183, 250, 150;
93
+ --color-sf-info: 71, 172, 251;
94
+ --color-sf-info-container: 0, 67, 120;
95
+ --color-sf-on-info: 0, 51, 91;
96
+ --color-sf-on-info-container: 173, 219, 255;
97
+ --color-sf-warning: 245, 180, 130;
98
+ --color-sf-warning-container: 123, 65, 0;
99
+ --color-sf-on-warning: 99, 52, 0;
100
+ --color-sf-on-warning-container: 255, 220, 193;
101
+ --color-sf-spreadsheet-gridline: 231, 224, 236;
102
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
103
+ --color-sf-success-text: 0, 0, 0;
104
+ --color-sf-warning-text: 0, 0, 0;
105
+ --color-sf-info-text: 0, 0, 0;
106
+ --color-sf-danger-text: 0, 0, 0;
107
+ --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
108
+ --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
109
+ }
110
+
111
+ /* stylelint-disable-line no-empty-source */
112
+ .e-split-btn-wrapper {
113
+ display: -webkit-inline-box;
114
+ display: -ms-inline-flexbox;
115
+ display: inline-flex;
116
+ white-space: nowrap;
117
+ width: -webkit-min-content;
118
+ width: -moz-min-content;
119
+ width: min-content;
120
+ border-radius: 4px;
121
+ -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
122
+ box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
123
+ }
124
+ .e-split-btn-wrapper .e-split-btn {
125
+ border-bottom-right-radius: 0;
126
+ border-top-right-radius: 0;
127
+ text-transform: none;
128
+ z-index: 1;
129
+ -webkit-box-shadow: none;
130
+ box-shadow: none;
131
+ }
132
+ .e-split-btn-wrapper .e-split-btn:focus {
133
+ outline-offset: 0;
134
+ }
135
+ .e-split-btn-wrapper .e-split-btn:hover {
136
+ -webkit-box-shadow: none;
137
+ box-shadow: none;
138
+ }
139
+ .e-split-btn-wrapper .e-split-btn:focus {
140
+ -webkit-box-shadow: none;
141
+ box-shadow: none;
142
+ }
143
+ .e-split-btn-wrapper .e-split-btn:focus-visible {
144
+ -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
145
+ box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
146
+ }
147
+ .e-split-btn-wrapper .e-split-btn:active {
148
+ -webkit-box-shadow: none;
149
+ box-shadow: none;
150
+ z-index: 2;
151
+ }
152
+ .e-split-btn-wrapper .e-split-btn.e-top-icon-btn {
153
+ padding-bottom: 10px;
154
+ padding-top: 10px;
155
+ }
156
+ .e-split-btn-wrapper .e-split-btn .e-btn-icon {
157
+ font-size: 16px;
158
+ margin-left: 0;
159
+ padding-right: 8px;
160
+ width: auto;
161
+ border-radius: 4px;
162
+ }
163
+ .e-split-btn-wrapper .e-split-btn .e-icon-top {
164
+ padding-bottom: 4px;
165
+ padding-right: 0;
166
+ }
167
+ .e-split-btn-wrapper .e-split-btn.e-icon-btn {
168
+ padding-left: 10px;
169
+ padding-right: 10px;
170
+ }
171
+ .e-split-btn-wrapper .e-split-btn.e-icon-btn .e-btn-icon {
172
+ padding-right: 0;
173
+ }
174
+ .e-split-btn-wrapper .e-dropdown-btn {
175
+ border-bottom-left-radius: 0;
176
+ border-top-left-radius: 0;
177
+ margin-left: -1px;
178
+ -webkit-box-shadow: none;
179
+ box-shadow: none;
180
+ padding-left: 4px;
181
+ padding-right: 4px;
182
+ }
183
+ .e-split-btn-wrapper .e-dropdown-btn:focus, .e-split-btn-wrapper .e-dropdown-btn:hover {
184
+ -webkit-box-shadow: none;
185
+ box-shadow: none;
186
+ }
187
+ .e-split-btn-wrapper .e-dropdown-btn:active {
188
+ -webkit-box-shadow: none;
189
+ box-shadow: none;
190
+ z-index: 2;
191
+ }
192
+ .e-split-btn-wrapper .e-dropdown-btn:disabled:focus, .e-split-btn-wrapper .e-dropdown-btn:disabled:hover, .e-split-btn-wrapper .e-dropdown-btn:disabled:active {
193
+ z-index: 0;
194
+ }
195
+ .e-split-btn-wrapper .e-dropdown-btn:focus {
196
+ outline-offset: 0;
197
+ }
198
+ .e-split-btn-wrapper .e-btn {
199
+ -webkit-box-shadow: none;
200
+ box-shadow: none;
201
+ }
202
+ .e-split-btn-wrapper .e-btn:hover {
203
+ -webkit-box-shadow: none;
204
+ box-shadow: none;
205
+ }
206
+ .e-split-btn-wrapper .e-btn:focus {
207
+ -webkit-box-shadow: none;
208
+ box-shadow: none;
209
+ }
210
+ .e-split-btn-wrapper .e-btn:focus-visible {
211
+ -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
212
+ box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
213
+ }
214
+ .e-split-btn-wrapper .e-btn:active {
215
+ -webkit-box-shadow: none;
216
+ box-shadow: none;
217
+ }
218
+ .e-split-btn-wrapper .e-btn:disabled {
219
+ -webkit-box-shadow: none;
220
+ box-shadow: none;
221
+ }
222
+ .e-split-btn-wrapper .e-btn.e-inherit:focus, .e-split-btn-wrapper .e-btn.e-inherit:active {
223
+ -webkit-box-shadow: none;
224
+ box-shadow: none;
225
+ }
226
+ .e-split-btn-wrapper.e-rtl .e-split-btn {
227
+ border-bottom-left-radius: 0;
228
+ border-bottom-right-radius: 100px;
229
+ border-top-left-radius: 0;
230
+ border-top-right-radius: 100px;
231
+ margin-left: -1px;
232
+ border-radius: 4px;
233
+ }
234
+ .e-split-btn-wrapper.e-rtl .e-split-btn .e-btn-icon {
235
+ margin-right: 0;
236
+ padding-left: 8px;
237
+ padding-right: 0;
238
+ border-radius: 4px;
239
+ }
240
+ .e-split-btn-wrapper.e-rtl .e-split-btn .e-icon-top {
241
+ padding-left: 0;
242
+ }
243
+ .e-split-btn-wrapper.e-rtl .e-split-btn.e-icon-btn {
244
+ padding-left: 10px;
245
+ padding-right: 10px;
246
+ }
247
+ .e-split-btn-wrapper.e-rtl .e-split-btn.e-icon-btn .e-btn-icon {
248
+ padding-left: 0;
249
+ }
250
+ .e-split-btn-wrapper.e-rtl .e-dropdown-btn {
251
+ border-bottom-left-radius: 100px;
252
+ border-bottom-right-radius: 0;
253
+ border-top-left-radius: 100px;
254
+ border-top-right-radius: 0;
255
+ margin-left: 0;
256
+ border-radius: 4px;
257
+ -webkit-box-shadow: none;
258
+ box-shadow: none;
259
+ }
260
+ .e-split-btn-wrapper.e-vertical {
261
+ display: inline-block;
262
+ }
263
+ .e-split-btn-wrapper.e-vertical .e-split-btn,
264
+ .e-split-btn-wrapper.e-vertical .e-dropdown-btn {
265
+ display: block;
266
+ width: 100%;
267
+ }
268
+ .e-split-btn-wrapper.e-vertical .e-split-btn {
269
+ border-bottom-left-radius: 0;
270
+ border-top-right-radius: 100px;
271
+ line-height: 1;
272
+ border-radius: 4px;
273
+ -webkit-box-shadow: none;
274
+ box-shadow: none;
275
+ }
276
+ .e-split-btn-wrapper.e-vertical .e-split-btn .e-icon-top {
277
+ padding-bottom: 4px;
278
+ }
279
+ .e-split-btn-wrapper.e-vertical .e-dropdown-btn {
280
+ border-bottom-left-radius: 100px;
281
+ border-top-right-radius: 0;
282
+ line-height: 0.334em;
283
+ margin-left: 0;
284
+ margin-top: -1px;
285
+ border-radius: 4px;
286
+ -webkit-box-shadow: none;
287
+ box-shadow: none;
288
+ }
289
+ .e-split-btn-wrapper.e-vertical .e-dropdown-btn .e-icon-bottom {
290
+ padding-top: 0;
291
+ }
292
+ .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn {
293
+ border-bottom-right-radius: 0;
294
+ border-top-left-radius: 100px;
295
+ margin-left: 0;
296
+ }
297
+ .e-split-btn-wrapper.e-vertical.e-rtl .e-dropdown-btn {
298
+ border-bottom-right-radius: 100px;
299
+ border-top-left-radius: 0;
300
+ }
301
+
302
+ .e-bigger .e-split-btn-wrapper,
303
+ .e-bigger.e-split-btn-wrapper {
304
+ border-radius: 4px;
305
+ -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
306
+ box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
307
+ }
308
+ .e-bigger .e-split-btn-wrapper .e-split-btn,
309
+ .e-bigger.e-split-btn-wrapper .e-split-btn {
310
+ border-radius: 4px;
311
+ -webkit-box-shadow: none;
312
+ box-shadow: none;
313
+ padding-left: 12px;
314
+ padding-right: 6px;
315
+ }
316
+ .e-bigger .e-split-btn-wrapper .e-split-btn.e-top-icon-btn,
317
+ .e-bigger.e-split-btn-wrapper .e-split-btn.e-top-icon-btn {
318
+ padding-bottom: 12px;
319
+ padding-top: 12px;
320
+ }
321
+ .e-bigger .e-split-btn-wrapper .e-split-btn .e-btn-icon,
322
+ .e-bigger.e-split-btn-wrapper .e-split-btn .e-btn-icon {
323
+ font-size: 18px;
324
+ margin-left: 0;
325
+ padding-right: 10px;
326
+ width: auto;
327
+ border-radius: 4px;
328
+ }
329
+ .e-bigger .e-split-btn-wrapper .e-split-btn .e-icon-top,
330
+ .e-bigger.e-split-btn-wrapper .e-split-btn .e-icon-top {
331
+ padding-bottom: 6px;
332
+ padding-right: 0;
333
+ }
334
+ .e-bigger .e-split-btn-wrapper .e-split-btn.e-icon-btn,
335
+ .e-bigger.e-split-btn-wrapper .e-split-btn.e-icon-btn {
336
+ padding-left: 12px;
337
+ padding-right: 12px;
338
+ }
339
+ .e-bigger .e-split-btn-wrapper .e-split-btn.e-icon-btn .e-btn-icon,
340
+ .e-bigger.e-split-btn-wrapper .e-split-btn.e-icon-btn .e-btn-icon {
341
+ padding-right: 0;
342
+ }
343
+ .e-bigger .e-split-btn-wrapper .e-dropdown-btn,
344
+ .e-bigger.e-split-btn-wrapper .e-dropdown-btn {
345
+ padding-left: 4px;
346
+ padding-right: 4px;
347
+ }
348
+ .e-bigger .e-split-btn-wrapper.e-rtl .e-split-btn,
349
+ .e-bigger.e-split-btn-wrapper.e-rtl .e-split-btn {
350
+ padding-left: 6px;
351
+ padding-right: 12px;
352
+ }
353
+ .e-bigger .e-split-btn-wrapper.e-rtl .e-split-btn .e-btn-icon,
354
+ .e-bigger.e-split-btn-wrapper.e-rtl .e-split-btn .e-btn-icon {
355
+ padding-left: 10px;
356
+ padding-right: 0;
357
+ border-radius: 4px;
358
+ }
359
+ .e-bigger .e-split-btn-wrapper.e-rtl .e-split-btn .e-icon-top,
360
+ .e-bigger.e-split-btn-wrapper.e-rtl .e-split-btn .e-icon-top {
361
+ padding-left: 0;
362
+ }
363
+ .e-bigger .e-split-btn-wrapper.e-rtl .e-split-btn.e-icon-btn,
364
+ .e-bigger.e-split-btn-wrapper.e-rtl .e-split-btn.e-icon-btn {
365
+ padding-left: 12px;
366
+ padding-right: 12px;
367
+ }
368
+ .e-bigger .e-split-btn-wrapper.e-rtl .e-split-btn.e-icon-btn .e-btn-icon,
369
+ .e-bigger.e-split-btn-wrapper.e-rtl .e-split-btn.e-icon-btn .e-btn-icon {
370
+ padding-left: 0;
371
+ }
372
+ .e-bigger .e-split-btn-wrapper.e-vertical .e-split-btn,
373
+ .e-bigger.e-split-btn-wrapper.e-vertical .e-split-btn {
374
+ padding-bottom: 6px;
375
+ padding-right: 12px;
376
+ }
377
+ .e-bigger .e-split-btn-wrapper.e-vertical .e-dropdown-btn,
378
+ .e-bigger.e-split-btn-wrapper.e-vertical .e-dropdown-btn {
379
+ padding-bottom: 4px;
380
+ padding-top: 4px;
381
+ }
382
+ .e-bigger .e-split-btn-wrapper.e-vertical .e-dropdown-btn .e-icon-bottom,
383
+ .e-bigger.e-split-btn-wrapper.e-vertical .e-dropdown-btn .e-icon-bottom {
384
+ padding-top: 0;
385
+ }
386
+
387
+ .e-split-btn-wrapper .e-split-btn {
388
+ -o-border-image: linear-gradient(to right, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
389
+ border-image: -webkit-gradient(linear, left top, right top, color-stop(25%, rgba(var(--color-sf-surface), 1)), color-stop(75%, rgba(var(--color-sf-outline-variant), 1))) 1;
390
+ border-image: linear-gradient(to right, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
391
+ border-width: 0 1px 0 0;
392
+ }
393
+ .e-split-btn-wrapper .e-split-btn:focus {
394
+ border-right-color: rgba(var(--color-sf-outline-variant));
395
+ }
396
+ .e-split-btn-wrapper .e-split-btn:active {
397
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12)), rgba(var(--color-sf-surface));
398
+ }
399
+ .e-split-btn-wrapper .e-split-btn:disabled {
400
+ border-right-color: rgba(var(--color-sf-secondary), 0.12);
401
+ }
402
+ .e-split-btn-wrapper .e-split-btn.e-inherit {
403
+ border-color: transparent;
404
+ }
405
+ .e-split-btn-wrapper.e-splitbtn-disabled {
406
+ -webkit-box-shadow: none;
407
+ box-shadow: none;
408
+ }
409
+ .e-split-btn-wrapper:hover :not(e-active) .e-split-btn {
410
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
411
+ }
412
+ .e-split-btn-wrapper:hover :not(e-active) .e-split-btn:disabled {
413
+ border-right-color: rgba(var(--color-sf-secondary), 0);
414
+ }
415
+ .e-split-btn-wrapper.e-rtl .e-split-btn {
416
+ -o-border-image: linear-gradient(to left, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
417
+ border-image: -webkit-gradient(linear, right top, left top, color-stop(25%, rgba(var(--color-sf-surface), 1)), color-stop(75%, rgba(var(--color-sf-outline-variant), 1))) 1;
418
+ border-image: linear-gradient(to left, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
419
+ border-width: 0 0 0 1px;
420
+ }
421
+ .e-split-btn-wrapper.e-rtl .e-split-btn:focus {
422
+ border-left-color: rgba(var(--color-sf-outline-variant));
423
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
424
+ }
425
+ .e-split-btn-wrapper.e-rtl .e-split-btn:active {
426
+ border-left-color: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12)), rgba(var(--color-sf-surface));
427
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12)), rgba(var(--color-sf-surface));
428
+ }
429
+ .e-split-btn-wrapper.e-rtl .e-split-btn:disabled {
430
+ border-left-color: rgba(var(--color-sf-secondary), 0);
431
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
432
+ }
433
+ .e-split-btn-wrapper.e-rtl .e-split-btn.e-inherit {
434
+ border-color: transparent;
435
+ }
436
+ .e-split-btn-wrapper.e-rtl:hover .e-split-btn :not(e-active) {
437
+ border-left-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
438
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
439
+ }
440
+ .e-split-btn-wrapper.e-rtl:hover .e-split-btn :not(e-active):disabled {
441
+ border-left-color: rgba(var(--color-sf-secondary), 0);
442
+ }
443
+ .e-split-btn-wrapper.e-vertical .e-split-btn {
444
+ -o-border-image: linear-gradient(to bottom, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
445
+ border-image: -webkit-gradient(linear, left top, left bottom, color-stop(25%, rgba(var(--color-sf-surface), 1)), color-stop(75%, rgba(var(--color-sf-outline-variant), 1))) 1;
446
+ border-image: linear-gradient(to bottom, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
447
+ border-width: 0 0 2px;
448
+ border-bottom-color: rgba(var(--color-sf-outline-variant));
449
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
450
+ }
451
+ .e-split-btn-wrapper.e-vertical .e-split-btn.e-inherit, .e-split-btn-wrapper.e-vertical .e-split-btn.e-inherit:focus, .e-split-btn-wrapper.e-vertical .e-split-btn.e-inherit:active, .e-split-btn-wrapper.e-vertical .e-split-btn.e-inherit:disabled {
452
+ border-color: transparent;
453
+ }
454
+ .e-split-btn-wrapper.e-vertical .e-split-btn:focus {
455
+ border-bottom-color: rgba(var(--color-sf-outline-variant));
456
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
457
+ }
458
+ .e-split-btn-wrapper.e-vertical .e-split-btn:active {
459
+ border-bottom-color: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12)), rgba(var(--color-sf-surface));
460
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12)), rgba(var(--color-sf-surface));
461
+ }
462
+ .e-split-btn-wrapper.e-vertical .e-split-btn:disabled {
463
+ border-bottom-color: rgba(var(--color-sf-secondary), 0);
464
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
465
+ }
466
+ .e-split-btn-wrapper.e-vertical:hover .e-split-btn {
467
+ border-bottom-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
468
+ border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
469
+ }
470
+ .e-split-btn-wrapper.e-vertical:hover .e-split-btn.e-inherit, .e-split-btn-wrapper.e-vertical:hover .e-split-btn.e-inherit:disabled {
471
+ border-color: transparent;
472
+ }
473
+ .e-split-btn-wrapper.e-vertical:hover .e-split-btn:disabled {
474
+ border-bottom-color: rgba(var(--color-sf-secondary), 0);
475
+ }
476
+ .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn {
477
+ border-left-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
478
+ }
479
+ .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn.e-inherit, .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn.e-inherit:focus, .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn.e-inherit:active, .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn.e-inherit:disabled {
480
+ border-color: transparent;
481
+ }
482
+ .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn:focus {
483
+ border-left-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
484
+ }
485
+ .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn:active {
486
+ border-left-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
487
+ }
488
+ .e-split-btn-wrapper.e-vertical.e-rtl .e-split-btn:disabled {
489
+ border-left-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
490
+ }
491
+ .e-split-btn-wrapper.e-vertical.e-rtl:hover .e-split-btn {
492
+ border-left-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
493
+ }
494
+ .e-split-btn-wrapper.e-vertical.e-rtl:hover .e-split-btn.e-inherit {
495
+ border-color: transparent;
496
+ }