@syncfusion/ej2-vue-layouts 21.1.36 → 21.1.42

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 (64) hide show
  1. package/CHANGELOG.md +0 -28
  2. package/dist/ej2-vue-layouts.umd.min.js +2 -2
  3. package/dist/ej2-vue-layouts.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-vue-layouts.es2015.js +2 -2
  5. package/dist/es6/ej2-vue-layouts.es2015.js.map +1 -1
  6. package/dist/es6/ej2-vue-layouts.es5.js +2 -2
  7. package/dist/es6/ej2-vue-layouts.es5.js.map +1 -1
  8. package/dist/global/ej2-vue-layouts.min.js +2 -2
  9. package/package.json +17 -17
  10. package/src/dashboard-layout/dashboardlayout.component.js +1 -1
  11. package/src/splitter/splitter.component.js +1 -1
  12. package/styles/bootstrap-dark.css +0 -2
  13. package/styles/bootstrap.css +0 -2
  14. package/styles/bootstrap4.css +2 -5
  15. package/styles/bootstrap5-dark.css +0 -2
  16. package/styles/bootstrap5.css +0 -2
  17. package/styles/card/bootstrap4.css +2 -3
  18. package/styles/card/fabric.css +1 -1
  19. package/styles/card/highcontrast.css +1 -1
  20. package/styles/fabric-dark.css +0 -2
  21. package/styles/fabric.css +1 -3
  22. package/styles/fluent-dark.css +0 -2
  23. package/styles/fluent.css +0 -2
  24. package/styles/highcontrast-light.css +0 -2
  25. package/styles/highcontrast.css +1 -3
  26. package/styles/material-dark.css +0 -2
  27. package/styles/material.css +0 -2
  28. package/styles/splitter/bootstrap-dark.css +0 -2
  29. package/styles/splitter/bootstrap.css +0 -2
  30. package/styles/splitter/bootstrap4.css +0 -2
  31. package/styles/splitter/bootstrap5-dark.css +0 -2
  32. package/styles/splitter/bootstrap5.css +0 -2
  33. package/styles/splitter/fabric-dark.css +0 -2
  34. package/styles/splitter/fabric.css +0 -2
  35. package/styles/splitter/fluent-dark.css +0 -2
  36. package/styles/splitter/fluent.css +0 -2
  37. package/styles/splitter/highcontrast-light.css +0 -2
  38. package/styles/splitter/highcontrast.css +0 -2
  39. package/styles/splitter/material-dark.css +0 -2
  40. package/styles/splitter/material.css +0 -2
  41. package/styles/splitter/tailwind-dark.css +0 -2
  42. package/styles/splitter/tailwind.css +0 -2
  43. package/styles/tailwind-dark.css +0 -2
  44. package/styles/tailwind.css +0 -2
  45. package/styles/avatar/material3-dark.css +0 -114
  46. package/styles/avatar/material3-dark.scss +0 -2
  47. package/styles/avatar/material3.css +0 -170
  48. package/styles/avatar/material3.scss +0 -2
  49. package/styles/card/material3-dark.css +0 -567
  50. package/styles/card/material3-dark.scss +0 -2
  51. package/styles/card/material3.css +0 -623
  52. package/styles/card/material3.scss +0 -2
  53. package/styles/dashboard-layout/material3-dark.css +0 -357
  54. package/styles/dashboard-layout/material3-dark.scss +0 -2
  55. package/styles/dashboard-layout/material3.css +0 -413
  56. package/styles/dashboard-layout/material3.scss +0 -2
  57. package/styles/material3-dark.css +0 -1585
  58. package/styles/material3-dark.scss +0 -5
  59. package/styles/material3.css +0 -1806
  60. package/styles/material3.scss +0 -5
  61. package/styles/splitter/material3-dark.css +0 -545
  62. package/styles/splitter/material3-dark.scss +0 -2
  63. package/styles/splitter/material3.css +0 -601
  64. package/styles/splitter/material3.scss +0 -2
@@ -1,601 +0,0 @@
1
- @import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,900&display=swap");
2
- :root {
3
- --color-sf-black: 0, 0, 0;
4
- --color-sf-white: 255, 255, 255;
5
- --color-sf-primary: 103, 80, 164;
6
- --color-sf-primary-container: 234, 221, 255;
7
- --color-sf-secondary: 98, 91, 113;
8
- --color-sf-secondary-container: 232, 222, 248;
9
- --color-sf-tertiary: 125, 82, 96;
10
- --color-sf-tertiary-container: 255, 216, 228;
11
- --color-sf-surface: 255, 255, 255;
12
- --color-sf-surface-variant: 231, 224, 236;
13
- --color-sf-background: var(--color-sf-surface);
14
- --color-sf-on-primary: 255, 255, 255;
15
- --color-sf-on-primary-container: 33, 0, 94;
16
- --color-sf-on-secondary: 255, 255, 255;
17
- --color-sf-on-secondary-container: 30, 25, 43;
18
- --color-sf-on-tertiary: 255, 255, 255;
19
- --color-sf-on-tertiary-containe: 55, 11, 30;
20
- --color-sf-on-surface: 28, 27, 31;
21
- --color-sf-on-surface-variant: 73, 69, 78;
22
- --color-sf-on-background: 28, 27, 31;
23
- --color-sf-outline: 121, 116, 126;
24
- --color-sf-outline-variant: 196, 199, 197;
25
- --color-sf-shadow: 0, 0, 0;
26
- --color-sf-surface-tint-color: 103, 80, 164;
27
- --color-sf-inverse-surface: 49, 48, 51;
28
- --color-sf-inverse-on-surface: 244, 239, 244;
29
- --color-sf-inverse-primary: 208, 188, 255;
30
- --color-sf-scrim: 0, 0, 0;
31
- --color-sf-error: 179, 38, 30;
32
- --color-sf-error-container: 249, 222, 220;
33
- --color-sf-on-error: 255, 250, 250;
34
- --color-sf-on-error-container: 65, 14, 11;
35
- --color-sf-success: 32, 81, 7;
36
- --color-sf-success-container: 209, 255, 186;
37
- --color-sf-on-success: 244, 255, 239;
38
- --color-sf-on-success-container: 13, 39, 0;
39
- --color-sf-info: 1, 87, 155;
40
- --color-sf-info-container: 233, 245, 255;
41
- --color-sf-on-info: 250, 253, 255;
42
- --color-sf-on-info-container: 0, 51, 91;
43
- --color-sf-warning: 145, 76, 0;
44
- --color-sf-warning-container: 254, 236, 222;
45
- --color-sf-on-warning: 255, 255, 255;
46
- --color-sf-on-warning-container: 47, 21, 0;
47
- --color-sf-spreadsheet-gridline: var(--color-sf-surface-variant);
48
- --color-sf-shadow-focus-ring1: 0 0 0 1px rgb(255, 255, 255), 0 0 0 3px rgb(0, 0, 0);
49
- --color-sf-diagram-palette-background: --color-sf-white;
50
- --color-sf-success-text: 255, 255, 255;
51
- --color-sf-warning-text: 255, 255, 255;
52
- --color-sf-danger-text: 255, 255, 255;
53
- --color-sf-info-text: 255, 255, 255;
54
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary-container);
55
- --color-sf-secondary-bg-color: var(--color-sf-surface);
56
- }
57
-
58
- .e-dark-mode {
59
- --color-sf-black: 0, 0, 0;
60
- --color-sf-white: 255, 255, 255;
61
- --color-sf-primary: 208, 188, 255;
62
- --color-sf-primary-container: 79, 55, 139;
63
- --color-sf-secondary: 204, 194, 220;
64
- --color-sf-secondary-container: 74, 68, 88;
65
- --color-sf-tertiary: 239, 184, 200;
66
- --color-sf-tertiary-container: 99, 59, 72;
67
- --color-sf-surface: 28, 27, 31;
68
- --color-sf-surface-variant: 28, 27, 31;
69
- --color-sf-background: var(--color-sf-surface);
70
- --color-sf-on-primary: 55, 30, 115;
71
- --color-sf-on-primary-container: 234, 221, 255;
72
- --color-sf-on-secondary: 51, 45, 65;
73
- --color-sf-on-secondary-container: 232, 222, 248;
74
- --color-sf-on-tertiary: 73, 37, 50;
75
- --color-sf-on-tertiary-containe: 255, 216, 228;
76
- --color-sf-on-surface: 230, 225, 229;
77
- --color-sf-on-surface-variant: 202, 196, 208;
78
- --color-sf-on-background: 230, 225, 229;
79
- --color-sf-outline: 147, 143, 153;
80
- --color-sf-outline-variant: 68, 71, 70;
81
- --color-sf-shadow: 0, 0, 0;
82
- --color-sf-surface-tint-color: 208, 188, 255;
83
- --color-sf-inverse-surface: 230, 225, 229;
84
- --color-sf-inverse-on-surface: 49, 48, 51;
85
- --color-sf-inverse-primary: 103, 80, 164;
86
- --color-sf-scrim: 0, 0, 0;
87
- --color-sf-error: 242, 184, 181;
88
- --color-sf-error-container: 140, 29, 24;
89
- --color-sf-on-error: 96, 20, 16;
90
- --color-sf-on-error-container: 249, 222, 220;
91
- --color-sf-success: 83, 202, 23;
92
- --color-sf-success-container: 22, 62, 2;
93
- --color-sf-on-success: 13, 39, 0;
94
- --color-sf-on-success-container: 183, 250, 150;
95
- --color-sf-info: 71, 172, 251;
96
- --color-sf-info-container: 0, 67, 120;
97
- --color-sf-on-info: 0, 51, 91;
98
- --color-sf-on-info-container: 173, 219, 255;
99
- --color-sf-warning: 245, 180, 130;
100
- --color-sf-warning-container: 123, 65, 0;
101
- --color-sf-on-warning: 99, 52, 0;
102
- --color-sf-on-warning-container: 255, 220, 193;
103
- --color-sf-spreadsheet-gridline: 231, 224, 236;
104
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
105
- --color-sf-success-text: 0, 0, 0;
106
- --color-sf-warning-text: 0, 0, 0;
107
- --color-sf-info-text: 0, 0, 0;
108
- --color-sf-danger-text: 0, 0, 0;
109
- --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
110
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
111
- }
112
-
113
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler::before {
114
- content: "\e7e3";
115
- font-family: "e-icons";
116
- font-size: 14px;
117
- }
118
- .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler::before {
119
- content: "\e7fd";
120
- font-family: "e-icons";
121
- font-size: 14px;
122
- }
123
-
124
- .e-bigger .e-splitter .e-split-bar .e-resize-handler::before {
125
- font-size: 16px;
126
- }
127
- .e-bigger.e-splitter .e-split-bar .e-resize-handler::before {
128
- font-size: 16px;
129
- }
130
-
131
- .e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-vertical {
132
- border-width: 1px;
133
- display: -ms-flexbox;
134
- display: flex;
135
- overflow: hidden;
136
- position: relative;
137
- -ms-touch-action: none;
138
- touch-action: none;
139
- width: 100%;
140
- }
141
- .e-splitter.e-splitter-horizontal .e-pane, .e-splitter.e-splitter-vertical .e-pane {
142
- -ms-flex: 1 1 auto;
143
- flex: 1 1 auto;
144
- font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
145
- font-size: 14px;
146
- font-weight: 400;
147
- }
148
- .e-splitter.e-splitter-horizontal .e-pane.e-scrollable, .e-splitter.e-splitter-vertical .e-pane.e-scrollable {
149
- overflow: auto;
150
- }
151
- .e-splitter.e-splitter-horizontal .e-pane.e-static-pane, .e-splitter.e-splitter-vertical .e-pane.e-static-pane {
152
- -ms-flex-positive: 0;
153
- flex-grow: 0;
154
- -ms-flex-negative: 0;
155
- flex-shrink: 0;
156
- }
157
- .e-splitter.e-splitter-horizontal .e-pane.e-pane-horizontal, .e-splitter.e-splitter-vertical .e-pane.e-pane-horizontal {
158
- overflow: auto;
159
- }
160
- .e-splitter.e-splitter-horizontal .e-pane.e-pane-horizontal.e-pane-hidden, .e-splitter.e-splitter-vertical .e-pane.e-pane-horizontal.e-pane-hidden {
161
- -ms-flex-preferred-size: 0 !important;
162
- flex-basis: 0 !important; /* stylelint-disable-line declaration-no-important */
163
- overflow: hidden !important; /* stylelint-disable-line declaration-no-important */
164
- }
165
- .e-splitter.e-splitter-horizontal {
166
- -ms-flex-direction: row;
167
- flex-direction: row;
168
- }
169
- .e-splitter.e-splitter-horizontal.e-pane.e-scrollable {
170
- overflow: hidden;
171
- }
172
- .e-splitter.e-splitter-horizontal.e-rtl {
173
- -ms-flex-direction: row-reverse;
174
- flex-direction: row-reverse;
175
- }
176
- .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal {
177
- -ms-flex-direction: row-reverse;
178
- flex-direction: row-reverse;
179
- }
180
- .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::before,
181
- .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::after {
182
- right: auto;
183
- }
184
- .e-splitter.e-splitter-vertical {
185
- -ms-flex-direction: column;
186
- flex-direction: column;
187
- }
188
- .e-splitter.e-splitter-vertical.e-pane.e-scrollable {
189
- overflow: hidden;
190
- }
191
- .e-splitter.e-splitter-vertical .e-pane-vertical {
192
- overflow: auto;
193
- }
194
- .e-splitter.e-splitter-vertical .e-pane-vertical.e-pane-hidden {
195
- -ms-flex-preferred-size: 0 !important;
196
- flex-basis: 0 !important; /* stylelint-disable-line declaration-no-important */
197
- overflow: hidden !important; /* stylelint-disable-line declaration-no-important */
198
- }
199
- .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::before,
200
- .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::after {
201
- right: auto;
202
- }
203
- .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
204
- border-radius: 50%;
205
- bottom: 20px;
206
- right: 22px;
207
- }
208
- .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down {
209
- border-radius: 50%;
210
- left: 22px;
211
- right: auto;
212
- top: 20px;
213
- }
214
- .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
215
- right: auto;
216
- }
217
- .e-splitter .e-split-bar.e-split-bar-horizontal {
218
- -ms-flex-align: center;
219
- align-items: center;
220
- display: -ms-flexbox;
221
- display: flex;
222
- -ms-flex: 0 0 auto;
223
- flex: 0 0 auto;
224
- -ms-flex-pack: center;
225
- justify-content: center;
226
- min-width: 1px;
227
- z-index: 15;
228
- }
229
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-icon-hidden {
230
- visibility: hidden;
231
- }
232
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-resizable-split-bar {
233
- cursor: col-resize;
234
- }
235
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-resizable-split-bar::after {
236
- content: "";
237
- cursor: col-resize;
238
- display: block;
239
- height: 100%;
240
- position: absolute;
241
- width: 16px;
242
- z-index: 10;
243
- }
244
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler {
245
- -ms-flex-align: center;
246
- align-items: center;
247
- display: -ms-flexbox;
248
- display: flex;
249
- height: 18px;
250
- -ms-flex-pack: center;
251
- justify-content: center;
252
- position: relative;
253
- width: 1px;
254
- }
255
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler.e-hide-handler {
256
- visibility: hidden;
257
- }
258
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::before,
259
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::after {
260
- left: 8px;
261
- right: 3px;
262
- }
263
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow {
264
- border-image: none;
265
- border-width: 1px;
266
- cursor: pointer;
267
- display: -ms-flexbox;
268
- display: flex;
269
- height: 26px;
270
- padding: 1px 12px;
271
- position: relative;
272
- }
273
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::before, .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::after {
274
- border-radius: 16px;
275
- content: "";
276
- height: 8px;
277
- position: absolute;
278
- transform: rotate(0deg);
279
- width: 2px;
280
- }
281
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::before {
282
- top: 5px;
283
- transform-origin: 1px 7px 0;
284
- }
285
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::after {
286
- top: 11px;
287
- transform-origin: 1px 1px 0;
288
- }
289
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right) {
290
- border-radius: 50%;
291
- right: 5px;
292
- }
293
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow.e-arrow-right {
294
- border-radius: 50%;
295
- left: 5px;
296
- }
297
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow.e-arrow-right::before, .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow.e-arrow-right::after {
298
- right: 8px;
299
- }
300
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-last-bar:not(.e-resizable-split-bar) {
301
- margin: 0 3px;
302
- }
303
- .e-splitter .e-split-bar.e-split-bar-horizontal:not(.e-resizable-split-bar) {
304
- margin: 0 0 0 3px;
305
- }
306
- .e-splitter .e-split-bar.e-split-bar-vertical {
307
- -ms-flex-align: center;
308
- align-items: center;
309
- border-left: none;
310
- border-right: none;
311
- display: -ms-flexbox;
312
- display: flex;
313
- -ms-flex: 0 0 auto;
314
- flex: 0 0 auto;
315
- -ms-flex-pack: center;
316
- justify-content: center;
317
- min-height: 1px;
318
- }
319
- .e-splitter .e-split-bar.e-split-bar-vertical .e-icon-hidden {
320
- visibility: hidden;
321
- }
322
- .e-splitter .e-split-bar.e-split-bar-vertical.e-resizable-split-bar {
323
- cursor: row-resize;
324
- }
325
- .e-splitter .e-split-bar.e-split-bar-vertical.e-resizable-split-bar::after {
326
- content: "";
327
- cursor: row-resize;
328
- display: block;
329
- height: 16px;
330
- position: absolute;
331
- width: 100%;
332
- z-index: 12;
333
- }
334
- .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler {
335
- -ms-flex-align: center;
336
- align-items: center;
337
- display: -ms-flexbox;
338
- display: flex;
339
- height: 1px;
340
- -ms-flex-pack: center;
341
- justify-content: center;
342
- width: 18px;
343
- }
344
- .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler.e-hide-handler {
345
- visibility: hidden;
346
- }
347
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::before,
348
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::after {
349
- left: 10px;
350
- }
351
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow {
352
- border-image: none;
353
- border-width: 0;
354
- cursor: pointer;
355
- display: -ms-flexbox;
356
- display: flex;
357
- height: 26px;
358
- padding: 10px 3px 10px 18px;
359
- position: relative;
360
- width: 26px;
361
- }
362
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow::before, .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow::after {
363
- border-radius: 16px;
364
- content: "";
365
- height: 8px;
366
- position: absolute;
367
- transform: rotate(90deg);
368
- width: 2px;
369
- }
370
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::before {
371
- top: 3px;
372
- transform-origin: 2px 7px 0;
373
- }
374
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::after {
375
- left: 11px;
376
- top: 8px;
377
- transform-origin: 1px 1px 0;
378
- }
379
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before {
380
- left: 12px;
381
- top: 8px;
382
- transform-origin: 1px 6px 0;
383
- }
384
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
385
- left: 10px;
386
- top: 12px;
387
- transform-origin: 1px 2px 0;
388
- }
389
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
390
- border-radius: 50%;
391
- bottom: 20px;
392
- left: 22px;
393
- }
394
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down {
395
- border-radius: 50%;
396
- right: 22px;
397
- top: 20px;
398
- }
399
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before, .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
400
- right: 10px;
401
- }
402
- .e-splitter .e-split-bar.e-split-bar-vertical.e-last-bar:not(.e-resizable-split-bar) {
403
- margin: 3px 0;
404
- }
405
- .e-splitter .e-split-bar.e-split-bar-vertical:not(.e-resizable-split-bar) {
406
- margin: 3px 0 0;
407
- }
408
-
409
- .e-bigger.e-splitter .e-pane {
410
- font-size: 16px;
411
- }
412
- .e-bigger.e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler {
413
- height: 20px;
414
- }
415
- .e-bigger.e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler {
416
- width: 20px;
417
- }
418
- .e-bigger.e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::before,
419
- .e-bigger.e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::after {
420
- margin-top: -2px;
421
- }
422
- .e-bigger.e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
423
- margin-top: 2px;
424
- }
425
-
426
- .e-rtl .e-splitter.e-splitter-horizontal {
427
- -ms-flex-direction: row-reverse;
428
- flex-direction: row-reverse;
429
- }
430
-
431
- .e-bigger .e-splitter .e-pane {
432
- font-size: 16px;
433
- }
434
- .e-bigger .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler {
435
- height: 20px;
436
- }
437
- .e-bigger .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler {
438
- width: 20px;
439
- }
440
-
441
- .e-content-placeholder.e-splitter.e-placeholder-splitter {
442
- background-size: 100px 110px;
443
- min-height: 110px;
444
- }
445
-
446
- .e-bigger .e-content-placeholder.e-splitter.e-placeholder-splitter,
447
- .e-bigger.e-content-placeholder.e-splitter.e-placeholder-splitter {
448
- background-size: 100px 110px;
449
- min-height: 110px;
450
- }
451
-
452
- .e-splitter.e-ie .e-navigate-arrow.e-arrow-left {
453
- margin-left: -26px;
454
- }
455
-
456
- .e-splitter.e-ie .e-split-bar-horizontal .e-resize-handler {
457
- -ms-flex-direction: column;
458
- flex-direction: column;
459
- }
460
-
461
- .e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-vertical {
462
- border: solid 1px rgba(var(--color-sf-outline-variant));
463
- }
464
- .e-splitter.e-splitter-horizontal .e-pane, .e-splitter.e-splitter-vertical .e-pane {
465
- color: rgba(var(--color-sf-on-surface));
466
- }
467
- .e-splitter.e-splitter-horizontal .e-pane.e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-horizontal .e-pane.e-splitter.e-splitter-vertical, .e-splitter.e-splitter-vertical .e-pane.e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-vertical .e-pane.e-splitter.e-splitter-vertical {
468
- border: transparent;
469
- }
470
- .e-splitter .e-split-bar.e-split-bar-horizontal {
471
- background: rgba(var(--color-sf-outline-variant));
472
- border-left: none;
473
- border-right: none;
474
- }
475
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler {
476
- background: rgba(var(--color-sf-surface));
477
- color: rgba(var(--color-sf-on-surface-variant));
478
- z-index: 10;
479
- }
480
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-icon-hidden) {
481
- background-color: transparent;
482
- border-color: transparent;
483
- color: transparent;
484
- transition: background-color 500ms ease-out;
485
- }
486
- .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-icon-hidden)::before, .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-icon-hidden)::after {
487
- background-color: rgba(var(--color-sf-primary));
488
- opacity: 0;
489
- transition-duration: 0.3s;
490
- transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
491
- }
492
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active {
493
- background: rgba(var(--color-sf-primary));
494
- border-left: none;
495
- border-right: none;
496
- }
497
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-resize-handler, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-resize-handler {
498
- background: rgba(var(--color-sf-surface));
499
- color: rgba(var(--color-sf-primary));
500
- }
501
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-right, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-right {
502
- background-color: transparent;
503
- border-color: rgba(var(--color-sf-primary));
504
- border-width: 1px;
505
- opacity: 0.9;
506
- }
507
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover.e-split-bar-hover .e-navigate-arrow::before, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover.e-split-bar-active .e-navigate-arrow::before, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active.e-split-bar-hover .e-navigate-arrow::before, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active.e-split-bar-active .e-navigate-arrow::before {
508
- background-color: rgba(var(--color-sf-primary));
509
- opacity: 1;
510
- transform: rotate(40deg);
511
- }
512
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover.e-split-bar-hover .e-navigate-arrow::after, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover.e-split-bar-active .e-navigate-arrow::after, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active.e-split-bar-hover .e-navigate-arrow::after, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active.e-split-bar-active .e-navigate-arrow::after {
513
- background-color: rgba(var(--color-sf-primary));
514
- opacity: 1;
515
- transform: rotate(-40deg);
516
- }
517
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-right::before, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-right::before {
518
- background-color: rgba(var(--color-sf-primary));
519
- opacity: 1;
520
- transform: rotate(-40deg);
521
- }
522
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-right::after, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-right::after {
523
- background-color: rgba(var(--color-sf-primary));
524
- opacity: 1;
525
- transform: rotate(40deg);
526
- }
527
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active {
528
- background: rgba(var(--color-sf-primary));
529
- }
530
- .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-resize-handler {
531
- background: rgba(var(--color-sf-surface));
532
- color: rgba(var(--color-sf-primary));
533
- }
534
- .e-splitter .e-split-bar.e-split-bar-vertical {
535
- background: rgba(var(--color-sf-outline-variant));
536
- }
537
- .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler {
538
- background: rgba(var(--color-sf-surface));
539
- color: rgba(var(--color-sf-on-surface-variant));
540
- z-index: 12;
541
- }
542
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active {
543
- background: rgba(var(--color-sf-primary));
544
- border-left: none;
545
- border-right: none;
546
- }
547
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-down, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-down {
548
- background-color: transparent;
549
- border-color: rgba(var(--color-sf-primary));
550
- border-width: 1px;
551
- opacity: 0.9;
552
- }
553
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-resize-handler, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-resize-handler {
554
- background: rgba(var(--color-sf-surface));
555
- color: rgba(var(--color-sf-primary));
556
- }
557
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-up::before, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-up::before {
558
- background-color: rgba(var(--color-sf-primary));
559
- opacity: 1;
560
- transform: rotate(125deg);
561
- }
562
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-up::after, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-up::after {
563
- background-color: rgba(var(--color-sf-primary));
564
- opacity: 1;
565
- transform: rotate(50deg);
566
- }
567
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-down::before, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-down::before {
568
- background-color: rgba(var(--color-sf-primary));
569
- opacity: 1;
570
- transform: rotate(55deg);
571
- }
572
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-down::after, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-down::after {
573
- background-color: rgba(var(--color-sf-primary));
574
- opacity: 1;
575
- transform: rotate(125deg);
576
- }
577
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow {
578
- background-color: transparent;
579
- border-color: transparent;
580
- color: transparent;
581
- transition: background-color 300ms ease-out;
582
- }
583
- .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow::before, .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow::after {
584
- background-color: rgba(var(--color-sf-primary));
585
- opacity: 0;
586
- transition-duration: 0.3s;
587
- transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
588
- }
589
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active {
590
- background: rgba(var(--color-sf-primary));
591
- }
592
- .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-resize-handler {
593
- background: rgba(var(--color-sf-surface));
594
- color: rgba(var(--color-sf-primary));
595
- }
596
- .e-splitter.e-disabled {
597
- opacity: 0.4;
598
- pointer-events: none;
599
- }
600
-
601
- /* stylelint-disable-line no-empty-source */
@@ -1,2 +0,0 @@
1
- @import 'ej2-base/styles/material3-definition.scss';
2
- @import 'ej2-layouts/styles/splitter/material3.scss';