@syncfusion/ej2-react-grids 23.2.6 → 24.1.41

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 (57) hide show
  1. package/CHANGELOG.md +29 -157
  2. package/diConfig.json +1 -0
  3. package/dist/ej2-react-grids.min.js +1 -1
  4. package/dist/ej2-react-grids.umd.min.js +1 -1
  5. package/package.json +9 -9
  6. package/src/grid/grid.component.d.ts +1 -0
  7. package/styles/bootstrap-dark.css +1 -5102
  8. package/styles/bootstrap.css +1 -5103
  9. package/styles/bootstrap4.css +1 -5190
  10. package/styles/bootstrap5-dark.css +1 -5182
  11. package/styles/bootstrap5.css +1 -5182
  12. package/styles/excel-filter/bootstrap-dark.css +1 -528
  13. package/styles/excel-filter/bootstrap.css +1 -528
  14. package/styles/excel-filter/bootstrap4.css +1 -584
  15. package/styles/excel-filter/bootstrap5-dark.css +1 -572
  16. package/styles/excel-filter/bootstrap5.css +1 -572
  17. package/styles/excel-filter/fabric-dark.css +1 -504
  18. package/styles/excel-filter/fabric.css +1 -497
  19. package/styles/excel-filter/fluent-dark.css +1 -552
  20. package/styles/excel-filter/fluent.css +1 -552
  21. package/styles/excel-filter/highcontrast-light.css +1 -501
  22. package/styles/excel-filter/highcontrast.css +1 -501
  23. package/styles/excel-filter/material-dark.css +1 -535
  24. package/styles/excel-filter/material.css +1 -568
  25. package/styles/excel-filter/material3-dark.css +1 -670
  26. package/styles/excel-filter/material3.css +1 -726
  27. package/styles/excel-filter/tailwind-dark.css +1 -520
  28. package/styles/excel-filter/tailwind.css +1 -520
  29. package/styles/fabric-dark.css +1 -5076
  30. package/styles/fabric.css +1 -5069
  31. package/styles/fluent-dark.css +1 -5220
  32. package/styles/fluent.css +1 -5220
  33. package/styles/grid/bootstrap-dark.css +1 -4678
  34. package/styles/grid/bootstrap.css +1 -4679
  35. package/styles/grid/bootstrap4.css +1 -4755
  36. package/styles/grid/bootstrap5-dark.css +1 -4755
  37. package/styles/grid/bootstrap5.css +1 -4755
  38. package/styles/grid/fabric-dark.css +1 -4652
  39. package/styles/grid/fabric.css +1 -4645
  40. package/styles/grid/fluent-dark.css +1 -4793
  41. package/styles/grid/fluent.css +1 -4793
  42. package/styles/grid/highcontrast-light.css +1 -4649
  43. package/styles/grid/highcontrast.css +1 -4649
  44. package/styles/grid/material-dark.css +1 -4692
  45. package/styles/grid/material.css +1 -4726
  46. package/styles/grid/material3-dark.css +1 -4997
  47. package/styles/grid/material3.css +1 -5053
  48. package/styles/grid/tailwind-dark.css +1 -4773
  49. package/styles/grid/tailwind.css +1 -4773
  50. package/styles/highcontrast-light.css +1 -5073
  51. package/styles/highcontrast.css +1 -5073
  52. package/styles/material-dark.css +1 -5122
  53. package/styles/material.css +1 -5164
  54. package/styles/material3-dark.css +1 -5527
  55. package/styles/material3.css +1 -5639
  56. package/styles/tailwind-dark.css +1 -5200
  57. package/styles/tailwind.css +1 -5200
@@ -1,726 +1 @@
1
- :root {
2
- --color-sf-black: 0, 0, 0;
3
- --color-sf-white: 255, 255, 255;
4
- --color-sf-primary: 103, 80, 164;
5
- --color-sf-primary-container: 234, 221, 255;
6
- --color-sf-secondary: 98, 91, 113;
7
- --color-sf-secondary-container: 232, 222, 248;
8
- --color-sf-tertiary: 125, 82, 96;
9
- --color-sf-tertiary-container: 255, 216, 228;
10
- --color-sf-surface: 255, 255, 255;
11
- --color-sf-surface-variant: 231, 224, 236;
12
- --color-sf-background: var(--color-sf-surface);
13
- --color-sf-on-primary: 255, 255, 255;
14
- --color-sf-on-primary-container: 33, 0, 94;
15
- --color-sf-on-secondary: 255, 255, 255;
16
- --color-sf-on-secondary-container: 30, 25, 43;
17
- --color-sf-on-tertiary: 255, 255, 255;
18
- --color-sf-on-tertiary-containe: 55, 11, 30;
19
- --color-sf-on-surface: 28, 27, 31;
20
- --color-sf-on-surface-variant: 73, 69, 78;
21
- --color-sf-on-background: 28, 27, 31;
22
- --color-sf-outline: 121, 116, 126;
23
- --color-sf-outline-variant: 196, 199, 197;
24
- --color-sf-shadow: 0, 0, 0;
25
- --color-sf-surface-tint-color: 103, 80, 164;
26
- --color-sf-inverse-surface: 49, 48, 51;
27
- --color-sf-inverse-on-surface: 244, 239, 244;
28
- --color-sf-inverse-primary: 208, 188, 255;
29
- --color-sf-scrim: 0, 0, 0;
30
- --color-sf-error: 179, 38, 30;
31
- --color-sf-error-container: 249, 222, 220;
32
- --color-sf-on-error: 255, 250, 250;
33
- --color-sf-on-error-container: 65, 14, 11;
34
- --color-sf-success: 32, 81, 7;
35
- --color-sf-success-container: 209, 255, 186;
36
- --color-sf-on-success: 244, 255, 239;
37
- --color-sf-on-success-container: 13, 39, 0;
38
- --color-sf-info: 1, 87, 155;
39
- --color-sf-info-container: 233, 245, 255;
40
- --color-sf-on-info: 250, 253, 255;
41
- --color-sf-on-info-container: 0, 51, 91;
42
- --color-sf-warning: 145, 76, 0;
43
- --color-sf-warning-container: 254, 236, 222;
44
- --color-sf-on-warning: 255, 255, 255;
45
- --color-sf-on-warning-container: 47, 21, 0;
46
- --color-sf-spreadsheet-gridline: var(--color-sf-surface-variant);
47
- --color-sf-shadow-focus-ring1: 0 0 0 1px rgb(255, 255, 255), 0 0 0 3px rgb(0, 0, 0);
48
- --color-sf-diagram-palette-background: --color-sf-white;
49
- --color-sf-success-text: 255, 255, 255;
50
- --color-sf-warning-text: 255, 255, 255;
51
- --color-sf-danger-text: 255, 255, 255;
52
- --color-sf-info-text: 255, 255, 255;
53
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary-container);
54
- --color-sf-secondary-bg-color: var(--color-sf-surface);
55
- }
56
-
57
- .e-dark-mode {
58
- --color-sf-black: 0, 0, 0;
59
- --color-sf-white: 255, 255, 255;
60
- --color-sf-primary: 208, 188, 255;
61
- --color-sf-primary-container: 79, 55, 139;
62
- --color-sf-secondary: 204, 194, 220;
63
- --color-sf-secondary-container: 74, 68, 88;
64
- --color-sf-tertiary: 239, 184, 200;
65
- --color-sf-tertiary-container: 99, 59, 72;
66
- --color-sf-surface: 28, 27, 31;
67
- --color-sf-surface-variant: 28, 27, 31;
68
- --color-sf-background: var(--color-sf-surface);
69
- --color-sf-on-primary: 55, 30, 115;
70
- --color-sf-on-primary-container: 234, 221, 255;
71
- --color-sf-on-secondary: 51, 45, 65;
72
- --color-sf-on-secondary-container: 232, 222, 248;
73
- --color-sf-on-tertiary: 73, 37, 50;
74
- --color-sf-on-tertiary-containe: 255, 216, 228;
75
- --color-sf-on-surface: 230, 225, 229;
76
- --color-sf-on-surface-variant: 202, 196, 208;
77
- --color-sf-on-background: 230, 225, 229;
78
- --color-sf-outline: 147, 143, 153;
79
- --color-sf-outline-variant: 68, 71, 70;
80
- --color-sf-shadow: 0, 0, 0;
81
- --color-sf-surface-tint-color: 208, 188, 255;
82
- --color-sf-inverse-surface: 230, 225, 229;
83
- --color-sf-inverse-on-surface: 49, 48, 51;
84
- --color-sf-inverse-primary: 103, 80, 164;
85
- --color-sf-scrim: 0, 0, 0;
86
- --color-sf-error: 242, 184, 181;
87
- --color-sf-error-container: 140, 29, 24;
88
- --color-sf-on-error: 96, 20, 16;
89
- --color-sf-on-error-container: 249, 222, 220;
90
- --color-sf-success: 83, 202, 23;
91
- --color-sf-success-container: 22, 62, 2;
92
- --color-sf-on-success: 13, 39, 0;
93
- --color-sf-on-success-container: 183, 250, 150;
94
- --color-sf-info: 71, 172, 251;
95
- --color-sf-info-container: 0, 67, 120;
96
- --color-sf-on-info: 0, 51, 91;
97
- --color-sf-on-info-container: 173, 219, 255;
98
- --color-sf-warning: 245, 180, 130;
99
- --color-sf-warning-container: 123, 65, 0;
100
- --color-sf-on-warning: 99, 52, 0;
101
- --color-sf-on-warning-container: 255, 220, 193;
102
- --color-sf-spreadsheet-gridline: 231, 224, 236;
103
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
104
- --color-sf-success-text: 0, 0, 0;
105
- --color-sf-warning-text: 0, 0, 0;
106
- --color-sf-info-text: 0, 0, 0;
107
- --color-sf-danger-text: 0, 0, 0;
108
- --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
109
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
110
- }
111
-
112
- /* stylelint-disable property-no-vendor-prefix */
113
- @keyframes e-input-ripple {
114
- 100% {
115
- opacity: 0;
116
- transform: scale(4);
117
- }
118
- }
119
- @keyframes slideTopUp {
120
- from {
121
- transform: translate3d(0, 0, 0) scale(1);
122
- }
123
- to {
124
- transform: translate3d(0, 0, 0) scale(1);
125
- }
126
- }
127
- .e-ddl.e-control-wrapper .e-ddl-icon::before {
128
- transform: rotate(0deg);
129
- transition: transform 300ms ease;
130
- }
131
-
132
- .e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before {
133
- transform: rotate(180deg);
134
- transition: transform 300ms ease;
135
- }
136
-
137
- .e-dropdownbase .e-list-item.e-active.e-hover {
138
- color: rgba(var(--color-sf-on-surface));
139
- }
140
-
141
- .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:active,
142
- .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:hover,
143
- .e-input-group:not(.e-disabled) .e-back-icon:active,
144
- .e-input-group:not(.e-disabled) .e-back-icon:hover,
145
- .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:active,
146
- .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:hover {
147
- background: rgba(var(--color-sf-on-surface), 0.08);
148
- }
149
-
150
- .e-input-group .e-ddl-icon:not(:active)::after {
151
- animation: none;
152
- }
153
-
154
- .e-ddl.e-popup {
155
- border: 0;
156
- box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
157
- margin-top: 2px;
158
- }
159
-
160
- .e-popup.e-ddl .e-dropdownbase {
161
- min-height: 26px;
162
- border-radius: 4px;
163
- }
164
-
165
- .e-bigger .e-popup.e-ddl-device-filter .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
166
- border-color: rgba(var(--color-sf-primary));
167
- }
168
-
169
- .e-bigger .e-popup.e-ddl-device-filter {
170
- margin-top: 0;
171
- }
172
-
173
- .e-bigger .e-ddl-device .e-input-group,
174
- .e-bigger .e-ddl-device .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
175
- background: rgba(0, 0, 0, 0.0001);
176
- border-width: 0;
177
- box-shadow: none;
178
- margin-bottom: 0;
179
- }
180
-
181
- .e-bigger .e-ddl-device .e-input-group .e-back-icon,
182
- .e-bigger .e-ddl-device .e-input-group input.e-input,
183
- .e-bigger .e-ddl-device .e-input-group .e-clear-icon {
184
- background: rgba(0, 0, 0, 0.0001);
185
- }
186
-
187
- .e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon {
188
- margin: 0 6px;
189
- min-height: 30px;
190
- min-width: 30px;
191
- }
192
-
193
- .e-bigger .e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon,
194
- .e-bigger.e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon {
195
- min-height: 38px;
196
- min-width: 38px;
197
- }
198
-
199
- .e-small .e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon,
200
- .e-small.e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon {
201
- min-height: 22px;
202
- min-width: 22px;
203
- }
204
-
205
- .e-bigger .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-filter,
206
- .e-bigger.e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-filter {
207
- padding: 4px 16px 4px 0;
208
- }
209
-
210
- .e-input-group.e-ddl,
211
- .e-input-group.e-ddl .e-input,
212
- .e-input-group.e-ddl .e-ddl-icon {
213
- background: transparent;
214
- }
215
-
216
- .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group:hover:not(.e-disabled):not(.e-float-icon-left),
217
- .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left) {
218
- border-bottom-width: 0;
219
- }
220
-
221
- .e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-small .e-clear-icon,
222
- .e-small .e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon,
223
- .e-small.e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon,
224
- .e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-input-focus.e-small .e-clear-icon,
225
- .e-small .e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-input-focus .e-clear-icon,
226
- .e-small.e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-input-focus .e-clear-icon {
227
- margin: 4px;
228
- }
229
-
230
- .e-small .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group .e-input-filter,
231
- .e-small.e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group .e-input-filter,
232
- .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-small .e-input-filter,
233
- .e-small .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-input-focus .e-input-filter,
234
- .e-small.e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-input-focus .e-input-filter,
235
- .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-small.e-input-focus .e-input-filter {
236
- padding: 4px 5px 4px 12px;
237
- }
238
-
239
- .e-bigger.e-small .e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon,
240
- .e-bigger.e-small.e-popup.e-ddl:not(.e-ddl-device) .e-input-group .e-clear-icon,
241
- .e-bigger .e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-small .e-clear-icon,
242
- .e-bigger.e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-small .e-clear-icon,
243
- .e-small .e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-bigger .e-clear-icon,
244
- .e-small.e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-bigger .e-clear-icon,
245
- .e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-bigger.e-small .e-clear-icon {
246
- min-height: 34px;
247
- min-width: 34px;
248
- }
249
-
250
- .e-bigger.e-small .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group .e-input-filter,
251
- .e-bigger.e-small.e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group .e-input-filter,
252
- .e-bigger .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-small .e-input-filter,
253
- .e-bigger.e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-small .e-input-filter,
254
- .e-small .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-bigger .e-input-filter,
255
- .e-small.e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-bigger .e-input-filter,
256
- .e-popup.e-ddl:not(.e-ddl-device) .e-filter-parent .e-input-group.e-bigger.e-small .e-input-filter {
257
- padding: 8px 16px;
258
- }
259
-
260
- .e-bigger.e-small .e-popup.e-ddl:not(.e-ddl-device) .e-input-group.e-input-focus .e-clear-icon {
261
- margin: 0 4px;
262
- }
263
-
264
- .e-ddl.e-popup.e-outline .e-filter-parent {
265
- padding: 4px 8px;
266
- }
267
-
268
- /* stylelint-disable property-no-vendor-prefix */
269
- @keyframes material-spinner-rotate {
270
- 0% {
271
- transform: rotate(0deg);
272
- }
273
- 100% {
274
- transform: rotate(360deg);
275
- }
276
- }
277
- @keyframes fabric-spinner-rotate {
278
- 0% {
279
- transform: rotate(0deg);
280
- }
281
- 100% {
282
- transform: rotate(360deg);
283
- }
284
- }
285
- /*! component icons */
286
- .e-icon-check::before {
287
- content: "\e774";
288
- }
289
-
290
- .e-excelfilter .e-icon-filter::before {
291
- content: "\e7f7";
292
- }
293
- .e-excelfilter .e-excl-filter-icon::before {
294
- content: "\e7f7";
295
- }
296
- .e-excelfilter .e-excl-filter-icon.e-filtered::before {
297
- content: "\e72c";
298
- }
299
- .e-excelfilter .e-search-icon::before {
300
- content: "\e754";
301
- }
302
- .e-excelfilter .e-ccsearch-icon::before {
303
- content: "\e754";
304
- }
305
- .e-excelfilter .e-chkcancel-icon::before {
306
- content: "\e7e7";
307
- }
308
- .e-excelfilter .e-sortascending::before {
309
- content: "\e7a3";
310
- }
311
- .e-excelfilter .e-sortdescending::before {
312
- content: "\e7b6";
313
- }
314
-
315
- /*! Excel-Filter layout */
316
- .sf-grid .e-excelfilter .e-dlg-content {
317
- overflow: visible;
318
- padding: 0;
319
- }
320
- .sf-grid .e-excelfilter .e-searchcontainer {
321
- padding: 14px;
322
- padding-top: 4px;
323
- }
324
- .sf-grid .e-excelfilter .e-contextmenu-container.e-sfcontextmenu .e-ul .e-menu-item .e-menu-icon {
325
- height: 26px;
326
- line-height: 26px;
327
- }
328
- .sf-grid .e-excelfilter .e-contextmenu-container.e-sfcontextmenu .e-ul .e-menu-item:not(.e-separator) {
329
- height: 26px;
330
- line-height: 26px;
331
- }
332
- .sf-grid .e-excelfilter .e-searchbox {
333
- padding-left: 0;
334
- }
335
- .sf-grid .e-excelfilter .e-contextmenu-container.e-sfcontextmenu .e-ul .e-separator {
336
- height: auto;
337
- }
338
- .sf-grid .e-excelfilter .e-contextmenu-container.e-sfcontextmenu .e-ul {
339
- position: absolute;
340
- }
341
- .sf-grid .e-excelfilter .e-contextmenu-container.e-sfcontextmenu {
342
- display: inline-block;
343
- position: relative;
344
- width: 100%;
345
- }
346
-
347
- .sf-grid-dlg.e-xlflmenu .e-xlfl-radiodiv {
348
- width: unset;
349
- }
350
-
351
- .e-xlflmenu {
352
- min-height: 318px;
353
- }
354
- .e-xlflmenu .e-xlfl-dlgfields {
355
- font-size: 14px;
356
- padding-top: 12px;
357
- }
358
- .e-xlflmenu .e-xlfl-fieldset {
359
- font-size: 11px;
360
- padding-top: 12px;
361
- }
362
- .e-responsive-dialog .e-xlflmenu table.e-xlfl-table tr.e-xlfl-fields:nth-child(2) td.e-xlfl-optr, .e-responsive-dialog .e-xlflmenu table.e-xlfl-table tr.e-xlfl-fields:nth-child(2) td.e-xlfl-value {
363
- padding-top: 16px;
364
- }
365
- .e-xlflmenu table.e-xlfl-table tr.e-xlfl-fields:nth-child(2) td.e-xlfl-optr,
366
- .e-xlflmenu table.e-xlfl-table tr.e-xlfl-fields:nth-child(2) td.e-xlfl-value {
367
- padding-top: 0;
368
- }
369
- .e-xlflmenu .e-xlfl-optr,
370
- .e-xlflmenu .e-xlfl-value {
371
- padding-top: 26px;
372
- }
373
- .e-xlflmenu .e-xlfl-radio,
374
- .e-xlflmenu .e-xlfl-mtcase {
375
- padding-top: 20px;
376
- }
377
- .e-xlflmenu .e-xlfl-optr:first-child {
378
- padding-right: 11.25px;
379
- }
380
- .e-xlflmenu .e-xlfl-table {
381
- border-spacing: 0;
382
- table-layout: fixed;
383
- width: 100%;
384
- }
385
- .e-xlflmenu .e-radio + label .e-label {
386
- margin-top: 0;
387
- padding-left: 25px;
388
- padding-right: 9px;
389
- }
390
- .e-xlflmenu .e-xlfl-matchcasediv .e-checkbox-wrapper .e-frame + .e-label {
391
- max-width: none;
392
- }
393
- .e-xlflmenu .e-checkbox-wrapper .e-frame + .e-label {
394
- margin-bottom: 1px;
395
- margin-left: 6px;
396
- }
397
- .e-xlflmenu .e-checkbox-wrapper .e-frame {
398
- margin-bottom: 1px;
399
- }
400
- .e-xlflmenu .e-dlg-content {
401
- padding-bottom: 5px;
402
- }
403
- .e-xlflmenu .e-xlfl-radiodiv {
404
- width: 120px;
405
- }
406
- .e-xlflmenu .e-xlfl-matchcasediv {
407
- margin-left: 0;
408
- margin-right: 13px;
409
- }
410
-
411
- .e-xlfl-radio-or,
412
- .e-xlfl-matchcasediv {
413
- margin-left: 2px;
414
- }
415
-
416
- .e-emptyicon {
417
- opacity: 0;
418
- }
419
-
420
- .e-xlflmenu.e-rtl .e-xlfl-optr {
421
- padding-left: 11.25px;
422
- padding-right: 0;
423
- }
424
- .e-xlflmenu.e-rtl .e-radio + label .e-label {
425
- padding-left: 0;
426
- padding-right: 25px;
427
- }
428
- .e-xlflmenu.e-rtl .e-xlfl-radio-or {
429
- margin-left: 0;
430
- margin-right: 13px;
431
- }
432
-
433
- .e-bigger .e-xlflmenu.e-rtl .e-radio + label .e-label {
434
- padding-left: 0;
435
- padding-right: 25px;
436
- }
437
-
438
- .e-bigger.e-responsive-dialog .e-xlflmenu .e-xlfl-dlgfields,
439
- .e-bigger.e-responsive-dialog .e-xlflmenu .e-xlfl-fieldset {
440
- font-weight: 500;
441
- padding-top: 8px;
442
- }
443
- .e-bigger.e-responsive-dialog .e-xlflmenu .e-xlfl-optr:first-child {
444
- width: 70%;
445
- }
446
- .e-bigger.e-responsive-dialog .e-xlflmenu .e-xlfl-radio,
447
- .e-bigger.e-responsive-dialog .e-xlflmenu .e-xlfl-mtcase {
448
- padding-top: 24px;
449
- }
450
- .e-bigger.e-responsive-dialog .e-xlflmenu .e-xlfl-optr,
451
- .e-bigger.e-responsive-dialog .e-xlflmenu .e-xlfl-value {
452
- padding-top: 24px;
453
- }
454
-
455
- .e-bigger .e-xlflmenu {
456
- min-height: 362px;
457
- }
458
- .e-bigger .e-xlflmenu .e-xlfl-table {
459
- border-spacing: 0;
460
- width: 100%;
461
- }
462
- .e-bigger .e-xlflmenu .e-dlg-content {
463
- padding-bottom: 10px;
464
- }
465
- .e-bigger .e-xlflmenu .e-radio + label .e-label {
466
- padding-left: 27px;
467
- padding-right: 6px;
468
- }
469
- .e-bigger .e-xlflmenu .e-checkbox-wrapper .e-frame + .e-label {
470
- margin-left: 8px;
471
- }
472
- .e-bigger .e-xlflmenu .e-xlfl-radiodiv {
473
- width: 141px;
474
- }
475
- .e-bigger .e-xlflmenu .e-xlfl-radio-or,
476
- .e-bigger .e-xlflmenu .e-xlfl-matchcasediv {
477
- margin-left: 18px;
478
- }
479
- .e-bigger .e-xlflmenu .e-xlfl-optr:first-child {
480
- padding-right: 10px;
481
- }
482
- .e-bigger .e-xlflmenu.e-rtl .e-xlfl-optr {
483
- padding-right: 0;
484
- }
485
- .e-bigger .e-xlflmenu .e-xlfl-dlgfields {
486
- font-size: 16px;
487
- }
488
- .e-bigger .e-xlflmenu .e-xlfl-fieldset {
489
- font-size: 12px;
490
- padding-top: 22px;
491
- }
492
- .e-bigger .e-xlflmenu .e-xlfl-optr,
493
- .e-bigger .e-xlflmenu .e-xlfl-value {
494
- padding-top: 32px;
495
- }
496
- .e-bigger .e-xlflmenu .e-xlfl-radio,
497
- .e-bigger .e-xlflmenu .e-xlfl-mtcase {
498
- padding-top: 18px;
499
- }
500
-
501
- .e-bigger .e-excelfilter .e-xlflmenu,
502
- .e-excelfilter.e-bigger .e-xlflmenu {
503
- min-height: 362px;
504
- }
505
- .e-bigger .e-excelfilter .e-ftrchk,
506
- .e-excelfilter.e-bigger .e-ftrchk {
507
- padding-bottom: 9px;
508
- padding-top: 9px;
509
- }
510
- .e-bigger .e-excelfilter .e-contextmenu-wrapper ul li,
511
- .e-bigger .e-excelfilter .e-contextmenu-container ul li,
512
- .e-excelfilter.e-bigger .e-contextmenu-wrapper ul li,
513
- .e-excelfilter.e-bigger .e-contextmenu-container ul li {
514
- height: 40px;
515
- line-height: 40px;
516
- }
517
- .e-bigger .e-excelfilter .e-contextmenu-wrapper ul li .e-menu-icon,
518
- .e-bigger .e-excelfilter .e-contextmenu-container ul li .e-menu-icon,
519
- .e-excelfilter.e-bigger .e-contextmenu-wrapper ul li .e-menu-icon,
520
- .e-excelfilter.e-bigger .e-contextmenu-container ul li .e-menu-icon {
521
- height: 40px;
522
- line-height: 40px;
523
- margin-right: 13px;
524
- }
525
- .e-bigger .e-excelfilter .e-contextmenu-wrapper ul .e-menu-item .e-caret,
526
- .e-excelfilter.e-bigger .e-contextmenu-wrapper ul .e-menu-item .e-caret {
527
- height: 40px;
528
- line-height: 40px;
529
- font-size: 20px;
530
- margin-right: 19px;
531
- }
532
- .e-bigger .e-excelfilter.e-rtl .e-contextmenu-wrapper ul .e-menu-item .e-caret,
533
- .e-excelfilter.e-bigger.e-rtl .e-contextmenu-wrapper ul .e-menu-item .e-caret {
534
- margin-left: 17px;
535
- }
536
- .e-bigger .e-excelfilter.e-dialog .e-dlg-content,
537
- .e-excelfilter.e-bigger.e-dialog .e-dlg-content {
538
- padding-left: 7px;
539
- }
540
- .e-bigger .e-excelfilter .e-ftrchk,
541
- .e-bigger .e-excelfilter .e-searchbox,
542
- .e-excelfilter.e-bigger .e-ftrchk,
543
- .e-excelfilter.e-bigger .e-searchbox {
544
- padding-left: 9px;
545
- }
546
- .e-bigger .e-excelfilter.e-rtl .e-dlg-content,
547
- .e-excelfilter.e-bigger.e-rtl .e-dlg-content {
548
- padding-left: 16px;
549
- padding-right: 7px;
550
- }
551
- .e-bigger .e-excelfilter.e-rtl .e-ftrchk,
552
- .e-bigger .e-excelfilter.e-rtl .e-searchbox,
553
- .e-excelfilter.e-bigger.e-rtl .e-ftrchk,
554
- .e-excelfilter.e-bigger.e-rtl .e-searchbox {
555
- padding-left: 0;
556
- padding-right: 9px;
557
- }
558
-
559
- .e-excelfilter .e-checkboxlist {
560
- height: 200px;
561
- margin-top: 5px;
562
- min-height: 160px;
563
- overflow-y: auto;
564
- }
565
- .e-excelfilter .e-checkboxfiltertext {
566
- width: 150px;
567
- word-break: normal;
568
- }
569
- .e-responsive-dialog .e-excelfilter .e-checkboxfiltertext {
570
- width: 180px;
571
- }
572
- .e-excelfilter .e-chk-hidden {
573
- -moz-appearance: none; /* stylelint-disable-line property-no-vendor-prefix */
574
- height: 1px;
575
- opacity: 0;
576
- width: 1px;
577
- }
578
- .e-excelfilter .e-contextmenu-wrapper,
579
- .e-excelfilter .e-contextmenu-wrapper ul {
580
- display: block;
581
- }
582
- .e-excelfilter .e-contextmenu-wrapper ul {
583
- padding-bottom: 4px;
584
- position: static;
585
- }
586
- .e-excelfilter .e-contextmenu-wrapper ul li,
587
- .e-excelfilter .e-contextmenu-container ul li {
588
- height: 36px;
589
- line-height: 36px;
590
- }
591
- .e-excelfilter .e-contextmenu-wrapper ul li .e-menu-icon,
592
- .e-excelfilter .e-contextmenu-container ul li .e-menu-icon {
593
- height: 36px;
594
- line-height: 36px;
595
- margin-right: 10px;
596
- }
597
- .e-excelfilter.e-rtl .e-contextmenu-wrapper ul li .e-menu-icon {
598
- margin-right: 0;
599
- }
600
- .e-excelfilter .e-contextmenu-wrapper ul .e-menu-item .e-caret {
601
- height: 36px;
602
- line-height: 36px;
603
- }
604
- .e-excelfilter .e-contextmenu-wrapper ul,
605
- .e-excelfilter .e-contextmenu-container ul:not(.e-ul) {
606
- border: 0;
607
- border-radius: 5px 5px 0 0;
608
- box-shadow: none;
609
- max-width: 300px;
610
- padding-bottom: 4px;
611
- position: static;
612
- }
613
- .e-excelfilter .e-footer-content {
614
- border-style: solid;
615
- border-width: 1px 0 0;
616
- }
617
- .e-excelfilter .e-excel-menu {
618
- z-index: 1000;
619
- }
620
- .e-excelfilter .e-dlg-content {
621
- background: linear-gradient(0deg, rgba(var(--color-sf-surface), 1), rgba(var(--color-sf-surface), 1)), rgba(var(--color-sf-surface));
622
- padding-top: 0;
623
- }
624
- .e-excelfilter .e-contextmenu-wrapper,
625
- .e-excelfilter .e-contextmenu-wrapper ul {
626
- display: block;
627
- }
628
- .e-excelfilter .e-contextmenu-wrapper ul {
629
- padding-bottom: 4px;
630
- position: static;
631
- }
632
- .e-excelfilter .e-contextmenu-wrapper ul li .e-contextmenu-container ul li {
633
- height: 36px;
634
- line-height: 36px;
635
- }
636
- .e-excelfilter .e-contextmenu-wrapper ul li .e-menu-icon,
637
- .e-excelfilter .e-contextmenu-container ul li .e-menu-icon {
638
- height: 36px;
639
- line-height: 36px;
640
- margin-right: 10px;
641
- }
642
- .e-excelfilter.e-rtl .e-contextmenu-wrapper ul li .e-menu-icon {
643
- margin-right: 0;
644
- }
645
- .e-excelfilter .e-contextmenu-wrapper ul .e-menu-item .e-caret {
646
- height: 36px;
647
- line-height: 36px;
648
- margin-right: 17px;
649
- }
650
- .e-excelfilter.e-rtl .e-contextmenu-wrapper ul .e-menu-item .e-caret {
651
- margin-left: 14px;
652
- }
653
- .e-excelfilter .e-footer-content {
654
- border-style: solid;
655
- border-width: 1px 0 0;
656
- }
657
- .e-excelfilter .e-excel-menu {
658
- z-index: 1000;
659
- }
660
- .e-excelfilter .e-dlg-content {
661
- padding-top: 12px;
662
- }
663
- .e-excelfilter .e-xlsel {
664
- border: 0 solid;
665
- position: absolute;
666
- -webkit-user-select: none;
667
- -ms-user-select: none;
668
- user-select: none;
669
- }
670
- .e-excelfilter.e-dialog .e-dlg-content {
671
- padding-left: 8px;
672
- padding-right: 16px;
673
- }
674
- .e-excelfilter .e-ftrchk,
675
- .e-excelfilter .e-searchbox {
676
- padding-left: 8px;
677
- }
678
- .e-excelfilter.e-rtl .e-dlg-content {
679
- padding-left: 14px;
680
- padding-right: 8px;
681
- }
682
- .e-excelfilter.e-rtl .e-ftrchk,
683
- .e-excelfilter.e-rtl .e-searchbox {
684
- padding-left: 0;
685
- padding-right: 8px;
686
- }
687
- .e-excelfilter .e-searchbox {
688
- display: block;
689
- }
690
-
691
- .e-ftrchk {
692
- padding-bottom: 8px;
693
- padding-top: 8px;
694
- }
695
-
696
- .e-excel-menu.e-contextmenu.e-menu-parent {
697
- max-height: 298px;
698
- overflow-y: auto;
699
- }
700
-
701
- .e-bigger .e-excel-menu.e-contextmenu.e-menu-parent {
702
- max-height: 355px;
703
- }
704
-
705
- /*! Excel-Filter theme */
706
- .e-excelfilter .e-footer-content {
707
- border-color: rgba(var(--color-sf-on-surface-variant), 0.12);
708
- opacity: 1;
709
- }
710
- .e-excelfilter .e-filtered::before {
711
- color: rgba(var(--color-sf-primary));
712
- }
713
- .e-excelfilter .e-dlg-content {
714
- padding-bottom: 10px;
715
- border-radius: 0;
716
- }
717
-
718
- li.e-separator.e-menu-item.e-excel-separator {
719
- margin-bottom: 0;
720
- margin-top: 0;
721
- }
722
-
723
- .e-xlsel {
724
- background-color: rgba(var(--color-sf-primary));
725
- border-color: rgba(var(--color-sf-primary));
726
- }
1
+ @import '@syncfusion/ej2-grids/styles/excel-filter/material3.css';