@syncfusion/ej2-layouts 25.1.37 → 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 (177) hide show
  1. package/.eslintrc.json +3 -2
  2. package/dist/ej2-layouts.min.js +2 -2
  3. package/dist/ej2-layouts.umd.min.js +2 -2
  4. package/dist/ej2-layouts.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-layouts.es2015.js +215 -140
  6. package/dist/es6/ej2-layouts.es2015.js.map +1 -1
  7. package/dist/es6/ej2-layouts.es5.js +243 -167
  8. package/dist/es6/ej2-layouts.es5.js.map +1 -1
  9. package/dist/global/ej2-layouts.min.js +2 -2
  10. package/dist/global/ej2-layouts.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +7 -7
  13. package/src/dashboard-layout/dashboard-layout.d.ts +1 -1
  14. package/src/dashboard-layout/dashboard-layout.js +55 -76
  15. package/src/splitter/splitter.js +81 -41
  16. package/src/timeline/timeline-model.d.ts +5 -5
  17. package/src/timeline/timeline.d.ts +6 -3
  18. package/src/timeline/timeline.js +107 -33
  19. package/styles/avatar/_bootstrap5.3-definition.scss +26 -0
  20. package/styles/avatar/_fluent2-definition.scss +29 -0
  21. package/styles/avatar/_layout.scss +16 -18
  22. package/styles/avatar/_material3-definition.scss +0 -7
  23. package/styles/avatar/bootstrap-dark.css +7 -4
  24. package/styles/avatar/bootstrap.css +7 -4
  25. package/styles/avatar/bootstrap4.css +7 -4
  26. package/styles/avatar/bootstrap5-dark.css +13 -10
  27. package/styles/avatar/bootstrap5.css +13 -10
  28. package/styles/avatar/fabric-dark.css +7 -4
  29. package/styles/avatar/fabric.css +7 -4
  30. package/styles/avatar/fluent-dark.css +11 -8
  31. package/styles/avatar/fluent.css +11 -8
  32. package/styles/avatar/fluent2.css +1094 -0
  33. package/styles/avatar/fluent2.scss +3 -0
  34. package/styles/avatar/highcontrast-light.css +7 -4
  35. package/styles/avatar/highcontrast.css +7 -4
  36. package/styles/avatar/material-dark.css +7 -4
  37. package/styles/avatar/material.css +7 -4
  38. package/styles/avatar/material3-dark.css +12 -9
  39. package/styles/avatar/material3.css +12 -9
  40. package/styles/avatar/tailwind-dark.css +11 -8
  41. package/styles/avatar/tailwind.css +11 -8
  42. package/styles/bootstrap-dark.css +359 -197
  43. package/styles/bootstrap-dark.scss +14 -5
  44. package/styles/bootstrap.css +359 -197
  45. package/styles/bootstrap.scss +14 -5
  46. package/styles/bootstrap4.css +357 -196
  47. package/styles/bootstrap4.scss +14 -5
  48. package/styles/bootstrap5-dark.css +370 -207
  49. package/styles/bootstrap5-dark.scss +14 -5
  50. package/styles/bootstrap5.css +370 -207
  51. package/styles/bootstrap5.scss +14 -5
  52. package/styles/card/_bootstrap5.3-definition.scss +125 -0
  53. package/styles/card/_fluent2-definition.scss +123 -0
  54. package/styles/card/_layout.scss +0 -3
  55. package/styles/card/_material3-definition.scss +0 -13
  56. package/styles/card/_theme.scss +4 -16
  57. package/styles/card/bootstrap-dark.css +95 -52
  58. package/styles/card/bootstrap.css +95 -52
  59. package/styles/card/bootstrap4.css +95 -52
  60. package/styles/card/bootstrap5-dark.css +95 -52
  61. package/styles/card/bootstrap5.css +95 -52
  62. package/styles/card/fabric-dark.css +95 -52
  63. package/styles/card/fabric.css +95 -52
  64. package/styles/card/fluent-dark.css +99 -54
  65. package/styles/card/fluent.css +99 -54
  66. package/styles/card/fluent2.css +1588 -0
  67. package/styles/card/fluent2.scss +3 -0
  68. package/styles/card/highcontrast-light.css +95 -52
  69. package/styles/card/highcontrast.css +95 -52
  70. package/styles/card/material-dark.css +95 -52
  71. package/styles/card/material.css +97 -53
  72. package/styles/card/material3-dark.css +99 -53
  73. package/styles/card/material3.css +99 -53
  74. package/styles/card/tailwind-dark.css +95 -52
  75. package/styles/card/tailwind.css +95 -52
  76. package/styles/dashboard-layout/_bootstrap5.3-definition.scss +108 -0
  77. package/styles/dashboard-layout/_fluent2-definition.scss +111 -0
  78. package/styles/dashboard-layout/_highcontrast-definition.scss +1 -1
  79. package/styles/dashboard-layout/_layout.scss +62 -60
  80. package/styles/dashboard-layout/_material3-definition.scss +0 -47
  81. package/styles/dashboard-layout/_theme.scss +19 -32
  82. package/styles/dashboard-layout/bootstrap-dark.css +41 -42
  83. package/styles/dashboard-layout/bootstrap.css +41 -42
  84. package/styles/dashboard-layout/bootstrap4.css +41 -42
  85. package/styles/dashboard-layout/bootstrap5-dark.css +48 -47
  86. package/styles/dashboard-layout/bootstrap5.css +48 -47
  87. package/styles/dashboard-layout/fabric-dark.css +41 -42
  88. package/styles/dashboard-layout/fabric.css +41 -42
  89. package/styles/dashboard-layout/fluent-dark.css +46 -46
  90. package/styles/dashboard-layout/fluent.css +46 -46
  91. package/styles/dashboard-layout/fluent2.css +1336 -0
  92. package/styles/dashboard-layout/fluent2.scss +4 -0
  93. package/styles/dashboard-layout/highcontrast-light.css +39 -41
  94. package/styles/dashboard-layout/highcontrast.css +43 -42
  95. package/styles/dashboard-layout/icons/_bootstrap5.3.scss +80 -0
  96. package/styles/dashboard-layout/icons/_fluent2.scss +80 -0
  97. package/styles/dashboard-layout/material-dark.css +41 -42
  98. package/styles/dashboard-layout/material.css +41 -42
  99. package/styles/dashboard-layout/material3-dark.css +48 -47
  100. package/styles/dashboard-layout/material3.css +48 -47
  101. package/styles/dashboard-layout/tailwind-dark.css +57 -55
  102. package/styles/dashboard-layout/tailwind.css +57 -55
  103. package/styles/fabric-dark.css +359 -197
  104. package/styles/fabric-dark.scss +14 -5
  105. package/styles/fabric.css +359 -197
  106. package/styles/fabric.scss +14 -5
  107. package/styles/fluent-dark.css +370 -206
  108. package/styles/fluent-dark.scss +14 -5
  109. package/styles/fluent.css +370 -206
  110. package/styles/fluent.scss +14 -5
  111. package/styles/fluent2.css +2795 -0
  112. package/styles/fluent2.scss +14 -0
  113. package/styles/highcontrast-light.css +357 -196
  114. package/styles/highcontrast-light.scss +13 -5
  115. package/styles/highcontrast.css +361 -197
  116. package/styles/highcontrast.scss +14 -5
  117. package/styles/material-dark.css +357 -196
  118. package/styles/material-dark.scss +14 -5
  119. package/styles/material.css +359 -197
  120. package/styles/material.scss +14 -5
  121. package/styles/material3-dark.css +370 -204
  122. package/styles/material3-dark.scss +14 -5
  123. package/styles/material3.css +370 -204
  124. package/styles/material3.scss +14 -5
  125. package/styles/splitter/_bootstrap5.3-definition.scss +31 -0
  126. package/styles/splitter/_fluent2-definition.scss +31 -0
  127. package/styles/splitter/_layout.scss +0 -4
  128. package/styles/splitter/_material3-definition.scss +0 -7
  129. package/styles/splitter/_theme.scss +0 -4
  130. package/styles/splitter/bootstrap-dark.css +115 -59
  131. package/styles/splitter/bootstrap.css +115 -59
  132. package/styles/splitter/bootstrap4.css +113 -58
  133. package/styles/splitter/bootstrap5-dark.css +113 -58
  134. package/styles/splitter/bootstrap5.css +113 -58
  135. package/styles/splitter/fabric-dark.css +115 -59
  136. package/styles/splitter/fabric.css +115 -59
  137. package/styles/splitter/fluent-dark.css +113 -58
  138. package/styles/splitter/fluent.css +113 -58
  139. package/styles/splitter/fluent2.css +1578 -0
  140. package/styles/splitter/fluent2.scss +4 -0
  141. package/styles/splitter/highcontrast-light.css +115 -59
  142. package/styles/splitter/highcontrast.css +115 -59
  143. package/styles/splitter/icons/_bootstrap5.3.scss +39 -0
  144. package/styles/splitter/icons/_fluent2.scss +39 -0
  145. package/styles/splitter/material-dark.css +113 -58
  146. package/styles/splitter/material.css +113 -58
  147. package/styles/splitter/material3-dark.css +114 -59
  148. package/styles/splitter/material3.css +114 -59
  149. package/styles/splitter/tailwind-dark.css +113 -58
  150. package/styles/splitter/tailwind.css +113 -58
  151. package/styles/tailwind-dark.css +377 -213
  152. package/styles/tailwind-dark.scss +14 -5
  153. package/styles/tailwind.css +377 -213
  154. package/styles/tailwind.scss +14 -5
  155. package/styles/timeline/_bootstrap5.3-definition.scss +18 -0
  156. package/styles/timeline/_fluent2-definition.scss +18 -0
  157. package/styles/timeline/_layout.scss +46 -7
  158. package/styles/timeline/bootstrap-dark.css +99 -39
  159. package/styles/timeline/bootstrap.css +99 -39
  160. package/styles/timeline/bootstrap4.css +99 -39
  161. package/styles/timeline/bootstrap5-dark.css +99 -39
  162. package/styles/timeline/bootstrap5.css +99 -39
  163. package/styles/timeline/fabric-dark.css +99 -39
  164. package/styles/timeline/fabric.css +99 -39
  165. package/styles/timeline/fluent-dark.css +99 -39
  166. package/styles/timeline/fluent.css +99 -39
  167. package/styles/timeline/fluent2.css +1332 -0
  168. package/styles/timeline/fluent2.scss +3 -0
  169. package/styles/timeline/highcontrast-light.css +99 -39
  170. package/styles/timeline/highcontrast.css +99 -39
  171. package/styles/timeline/material-dark.css +99 -39
  172. package/styles/timeline/material.css +99 -39
  173. package/styles/timeline/material3-dark.css +100 -40
  174. package/styles/timeline/material3.css +100 -40
  175. package/styles/timeline/tailwind-dark.css +99 -39
  176. package/styles/timeline/tailwind.css +99 -39
  177. package/CHANGELOG.md +0 -599
@@ -44,7 +44,7 @@
44
44
  --color-sf-on-warning: 99, 52, 0;
45
45
  --color-sf-on-warning-container: 255, 220, 193;
46
46
  --color-sf-spreadsheet-gridline: 231, 224, 236;
47
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
47
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
48
48
  --color-sf-success-text: 0, 0, 0;
49
49
  --color-sf-warning-text: 0, 0, 0;
50
50
  --color-sf-info-text: 0, 0, 0;
@@ -73,6 +73,7 @@
73
73
 
74
74
  .e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-vertical {
75
75
  border-width: 1px;
76
+ display: -webkit-box;
76
77
  display: -ms-flexbox;
77
78
  display: flex;
78
79
  overflow: hidden;
@@ -82,8 +83,9 @@
82
83
  width: 100%;
83
84
  }
84
85
  .e-splitter.e-splitter-horizontal .e-pane, .e-splitter.e-splitter-vertical .e-pane {
85
- -ms-flex: 1 1 auto;
86
- flex: 1 1 auto;
86
+ -webkit-box-flex: 1;
87
+ -ms-flex: 1 1 auto;
88
+ flex: 1 1 auto;
87
89
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
88
90
  font-size: 14px;
89
91
  font-weight: 400;
@@ -92,8 +94,9 @@
92
94
  overflow: auto;
93
95
  }
94
96
  .e-splitter.e-splitter-horizontal .e-pane.e-static-pane, .e-splitter.e-splitter-vertical .e-pane.e-static-pane {
95
- -ms-flex-positive: 0;
96
- flex-grow: 0;
97
+ -webkit-box-flex: 0;
98
+ -ms-flex-positive: 0;
99
+ flex-grow: 0;
97
100
  -ms-flex-negative: 0;
98
101
  flex-shrink: 0;
99
102
  }
@@ -106,27 +109,35 @@
106
109
  overflow: hidden !important; /* stylelint-disable-line declaration-no-important */
107
110
  }
108
111
  .e-splitter.e-splitter-horizontal {
109
- -ms-flex-direction: row;
110
- flex-direction: row;
112
+ -webkit-box-orient: horizontal;
113
+ -webkit-box-direction: normal;
114
+ -ms-flex-direction: row;
115
+ flex-direction: row;
111
116
  }
112
117
  .e-splitter.e-splitter-horizontal.e-pane.e-scrollable {
113
118
  overflow: hidden;
114
119
  }
115
120
  .e-splitter.e-splitter-horizontal.e-rtl {
116
- -ms-flex-direction: row-reverse;
117
- flex-direction: row-reverse;
121
+ -webkit-box-orient: horizontal;
122
+ -webkit-box-direction: reverse;
123
+ -ms-flex-direction: row-reverse;
124
+ flex-direction: row-reverse;
118
125
  }
119
126
  .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal {
120
- -ms-flex-direction: row-reverse;
121
- flex-direction: row-reverse;
127
+ -webkit-box-orient: horizontal;
128
+ -webkit-box-direction: reverse;
129
+ -ms-flex-direction: row-reverse;
130
+ flex-direction: row-reverse;
122
131
  }
123
132
  .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::before,
124
133
  .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::after {
125
134
  right: auto;
126
135
  }
127
136
  .e-splitter.e-splitter-vertical {
128
- -ms-flex-direction: column;
129
- flex-direction: column;
137
+ -webkit-box-orient: vertical;
138
+ -webkit-box-direction: normal;
139
+ -ms-flex-direction: column;
140
+ flex-direction: column;
130
141
  }
131
142
  .e-splitter.e-splitter-vertical.e-pane.e-scrollable {
132
143
  overflow: hidden;
@@ -158,14 +169,18 @@
158
169
  right: auto;
159
170
  }
160
171
  .e-splitter .e-split-bar.e-split-bar-horizontal {
161
- -ms-flex-align: center;
162
- align-items: center;
172
+ -webkit-box-align: center;
173
+ -ms-flex-align: center;
174
+ align-items: center;
175
+ display: -webkit-box;
163
176
  display: -ms-flexbox;
164
177
  display: flex;
165
- -ms-flex: 0 0 auto;
166
- flex: 0 0 auto;
167
- -ms-flex-pack: center;
168
- justify-content: center;
178
+ -webkit-box-flex: 0;
179
+ -ms-flex: 0 0 auto;
180
+ flex: 0 0 auto;
181
+ -webkit-box-pack: center;
182
+ -ms-flex-pack: center;
183
+ justify-content: center;
169
184
  min-width: 1px;
170
185
  z-index: 15;
171
186
  }
@@ -185,13 +200,16 @@
185
200
  z-index: 10;
186
201
  }
187
202
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler {
188
- -ms-flex-align: center;
189
- align-items: center;
203
+ -webkit-box-align: center;
204
+ -ms-flex-align: center;
205
+ align-items: center;
206
+ display: -webkit-box;
190
207
  display: -ms-flexbox;
191
208
  display: flex;
192
209
  height: 18px;
193
- -ms-flex-pack: center;
194
- justify-content: center;
210
+ -webkit-box-pack: center;
211
+ -ms-flex-pack: center;
212
+ justify-content: center;
195
213
  position: relative;
196
214
  width: 1px;
197
215
  }
@@ -204,9 +222,11 @@
204
222
  right: 3px;
205
223
  }
206
224
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow {
207
- border-image: none;
225
+ -o-border-image: none;
226
+ border-image: none;
208
227
  border-width: 1px;
209
228
  cursor: pointer;
229
+ display: -webkit-box;
210
230
  display: -ms-flexbox;
211
231
  display: flex;
212
232
  height: 26px;
@@ -218,16 +238,19 @@
218
238
  content: "";
219
239
  height: 8px;
220
240
  position: absolute;
221
- transform: rotate(0deg);
241
+ -webkit-transform: rotate(0deg);
242
+ transform: rotate(0deg);
222
243
  width: 2px;
223
244
  }
224
245
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::before {
225
246
  top: 5px;
226
- transform-origin: 1px 7px 0;
247
+ -webkit-transform-origin: 1px 7px 0;
248
+ transform-origin: 1px 7px 0;
227
249
  }
228
250
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::after {
229
251
  top: 11px;
230
- transform-origin: 1px 1px 0;
252
+ -webkit-transform-origin: 1px 1px 0;
253
+ transform-origin: 1px 1px 0;
231
254
  }
232
255
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right) {
233
256
  border-radius: 50%;
@@ -247,16 +270,20 @@
247
270
  margin: 0 0 0 3px;
248
271
  }
249
272
  .e-splitter .e-split-bar.e-split-bar-vertical {
250
- -ms-flex-align: center;
251
- align-items: center;
273
+ -webkit-box-align: center;
274
+ -ms-flex-align: center;
275
+ align-items: center;
252
276
  border-left: none;
253
277
  border-right: none;
278
+ display: -webkit-box;
254
279
  display: -ms-flexbox;
255
280
  display: flex;
256
- -ms-flex: 0 0 auto;
257
- flex: 0 0 auto;
258
- -ms-flex-pack: center;
259
- justify-content: center;
281
+ -webkit-box-flex: 0;
282
+ -ms-flex: 0 0 auto;
283
+ flex: 0 0 auto;
284
+ -webkit-box-pack: center;
285
+ -ms-flex-pack: center;
286
+ justify-content: center;
260
287
  min-height: 1px;
261
288
  }
262
289
  .e-splitter .e-split-bar.e-split-bar-vertical .e-icon-hidden {
@@ -275,13 +302,16 @@
275
302
  z-index: 12;
276
303
  }
277
304
  .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler {
278
- -ms-flex-align: center;
279
- align-items: center;
305
+ -webkit-box-align: center;
306
+ -ms-flex-align: center;
307
+ align-items: center;
308
+ display: -webkit-box;
280
309
  display: -ms-flexbox;
281
310
  display: flex;
282
311
  height: 1px;
283
- -ms-flex-pack: center;
284
- justify-content: center;
312
+ -webkit-box-pack: center;
313
+ -ms-flex-pack: center;
314
+ justify-content: center;
285
315
  width: 18px;
286
316
  }
287
317
  .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler.e-hide-handler {
@@ -292,9 +322,11 @@
292
322
  left: 10px;
293
323
  }
294
324
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow {
295
- border-image: none;
325
+ -o-border-image: none;
326
+ border-image: none;
296
327
  border-width: 0;
297
328
  cursor: pointer;
329
+ display: -webkit-box;
298
330
  display: -ms-flexbox;
299
331
  display: flex;
300
332
  height: 26px;
@@ -307,27 +339,32 @@
307
339
  content: "";
308
340
  height: 8px;
309
341
  position: absolute;
310
- transform: rotate(90deg);
342
+ -webkit-transform: rotate(90deg);
343
+ transform: rotate(90deg);
311
344
  width: 2px;
312
345
  }
313
346
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::before {
314
347
  top: 3px;
315
- transform-origin: 2px 7px 0;
348
+ -webkit-transform-origin: 2px 7px 0;
349
+ transform-origin: 2px 7px 0;
316
350
  }
317
351
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::after {
318
352
  left: 11px;
319
353
  top: 8px;
320
- transform-origin: 1px 1px 0;
354
+ -webkit-transform-origin: 1px 1px 0;
355
+ transform-origin: 1px 1px 0;
321
356
  }
322
357
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before {
323
358
  left: 12px;
324
359
  top: 8px;
325
- transform-origin: 1px 6px 0;
360
+ -webkit-transform-origin: 1px 6px 0;
361
+ transform-origin: 1px 6px 0;
326
362
  }
327
363
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
328
364
  left: 10px;
329
365
  top: 12px;
330
- transform-origin: 1px 2px 0;
366
+ -webkit-transform-origin: 1px 2px 0;
367
+ transform-origin: 1px 2px 0;
331
368
  }
332
369
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
333
370
  border-radius: 50%;
@@ -367,8 +404,10 @@
367
404
  }
368
405
 
369
406
  .e-rtl .e-splitter.e-splitter-horizontal {
370
- -ms-flex-direction: row-reverse;
371
- flex-direction: row-reverse;
407
+ -webkit-box-orient: horizontal;
408
+ -webkit-box-direction: reverse;
409
+ -ms-flex-direction: row-reverse;
410
+ flex-direction: row-reverse;
372
411
  }
373
412
 
374
413
  .e-bigger .e-splitter .e-pane {
@@ -397,8 +436,10 @@
397
436
  }
398
437
 
399
438
  .e-splitter.e-ie .e-split-bar-horizontal .e-resize-handler {
400
- -ms-flex-direction: column;
401
- flex-direction: column;
439
+ -webkit-box-orient: vertical;
440
+ -webkit-box-direction: normal;
441
+ -ms-flex-direction: column;
442
+ flex-direction: column;
402
443
  }
403
444
 
404
445
  .e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-vertical {
@@ -424,13 +465,16 @@
424
465
  background-color: transparent;
425
466
  border-color: transparent;
426
467
  color: transparent;
468
+ -webkit-transition: background-color 500ms ease-out;
427
469
  transition: background-color 500ms ease-out;
428
470
  }
429
471
  .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 {
430
472
  background-color: rgba(var(--color-sf-primary));
431
473
  opacity: 0;
432
- transition-duration: 0.3s;
433
- transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
474
+ -webkit-transition-duration: 0.3s;
475
+ transition-duration: 0.3s;
476
+ -webkit-transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
477
+ transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
434
478
  }
435
479
  .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 {
436
480
  background: rgba(var(--color-sf-primary));
@@ -450,22 +494,26 @@
450
494
  .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 {
451
495
  background-color: rgba(var(--color-sf-primary));
452
496
  opacity: 1;
453
- transform: rotate(40deg);
497
+ -webkit-transform: rotate(40deg);
498
+ transform: rotate(40deg);
454
499
  }
455
500
  .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 {
456
501
  background-color: rgba(var(--color-sf-primary));
457
502
  opacity: 1;
458
- transform: rotate(-40deg);
503
+ -webkit-transform: rotate(-40deg);
504
+ transform: rotate(-40deg);
459
505
  }
460
506
  .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 {
461
507
  background-color: rgba(var(--color-sf-primary));
462
508
  opacity: 1;
463
- transform: rotate(-40deg);
509
+ -webkit-transform: rotate(-40deg);
510
+ transform: rotate(-40deg);
464
511
  }
465
512
  .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 {
466
513
  background-color: rgba(var(--color-sf-primary));
467
514
  opacity: 1;
468
- transform: rotate(40deg);
515
+ -webkit-transform: rotate(40deg);
516
+ transform: rotate(40deg);
469
517
  }
470
518
  .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active {
471
519
  background: rgba(var(--color-sf-primary));
@@ -500,34 +548,41 @@
500
548
  .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 {
501
549
  background-color: rgba(var(--color-sf-primary));
502
550
  opacity: 1;
503
- transform: rotate(125deg);
551
+ -webkit-transform: rotate(125deg);
552
+ transform: rotate(125deg);
504
553
  }
505
554
  .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 {
506
555
  background-color: rgba(var(--color-sf-primary));
507
556
  opacity: 1;
508
- transform: rotate(50deg);
557
+ -webkit-transform: rotate(50deg);
558
+ transform: rotate(50deg);
509
559
  }
510
560
  .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 {
511
561
  background-color: rgba(var(--color-sf-primary));
512
562
  opacity: 1;
513
- transform: rotate(55deg);
563
+ -webkit-transform: rotate(55deg);
564
+ transform: rotate(55deg);
514
565
  }
515
566
  .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 {
516
567
  background-color: rgba(var(--color-sf-primary));
517
568
  opacity: 1;
518
- transform: rotate(125deg);
569
+ -webkit-transform: rotate(125deg);
570
+ transform: rotate(125deg);
519
571
  }
520
572
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow {
521
573
  background-color: transparent;
522
574
  border-color: transparent;
523
575
  color: transparent;
576
+ -webkit-transition: background-color 300ms ease-out;
524
577
  transition: background-color 300ms ease-out;
525
578
  }
526
579
  .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 {
527
580
  background-color: rgba(var(--color-sf-primary));
528
581
  opacity: 0;
529
- transition-duration: 0.3s;
530
- transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
582
+ -webkit-transition-duration: 0.3s;
583
+ transition-duration: 0.3s;
584
+ -webkit-transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
585
+ transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
531
586
  }
532
587
  .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active {
533
588
  background: rgba(var(--color-sf-primary));