@syncfusion/ej2-layouts 25.2.3 → 26.1.38

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 +2 -2
  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 +28 -0
  21. package/styles/avatar/_layout.scss +22 -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 +1097 -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 +13 -4
  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 +1593 -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 +2803 -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 -601
@@ -100,7 +100,7 @@
100
100
  --color-sf-on-warning: 99, 52, 0;
101
101
  --color-sf-on-warning-container: 255, 220, 193;
102
102
  --color-sf-spreadsheet-gridline: 231, 224, 236;
103
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
103
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
104
104
  --color-sf-success-text: 0, 0, 0;
105
105
  --color-sf-warning-text: 0, 0, 0;
106
106
  --color-sf-info-text: 0, 0, 0;
@@ -112,22 +112,25 @@
112
112
  .e-avatar {
113
113
  -ms-flex-line-pack: center;
114
114
  align-content: center;
115
- -ms-flex-align: center;
116
- align-items: center;
115
+ -webkit-box-align: center;
116
+ -ms-flex-align: center;
117
+ align-items: center;
117
118
  background-color: rgba(var(--color-sf-primary-container));
118
119
  background-position: center;
119
120
  background-repeat: no-repeat;
120
121
  background-size: cover;
121
122
  border-radius: 4px;
122
123
  color: rgba(var(--color-sf-on-primary-container));
124
+ display: -webkit-inline-box;
123
125
  display: -ms-inline-flexbox;
124
126
  display: inline-flex;
125
127
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
126
128
  font-size: 20px;
127
129
  font-weight: 500;
128
130
  height: 40px;
129
- -ms-flex-pack: center;
130
- justify-content: center;
131
+ -webkit-box-pack: center;
132
+ -ms-flex-pack: center;
133
+ justify-content: center;
131
134
  overflow: hidden;
132
135
  position: relative;
133
136
  width: 40px;
@@ -146,29 +149,28 @@
146
149
  .e-avatar.e-avatar-xsmall {
147
150
  font-size: 14px;
148
151
  height: 24px;
149
- line-height: 14px;
150
152
  width: 24px;
153
+ line-height: 14px;
151
154
  }
152
155
  .e-avatar.e-avatar-small {
153
156
  font-size: 18px;
154
157
  height: 32px;
155
- line-height: 18px;
156
158
  width: 32px;
159
+ line-height: 18px;
157
160
  }
158
161
  .e-avatar.e-avatar-large {
159
162
  font-size: 26px;
160
163
  height: 48px;
161
- line-height: 26px;
162
164
  width: 48px;
165
+ line-height: 26px;
163
166
  }
164
167
  .e-avatar.e-avatar-xlarge {
165
168
  font-size: 30px;
166
169
  height: 56px;
167
- line-height: 30px;
168
170
  width: 56px;
171
+ line-height: 30px;
169
172
  }
170
173
 
171
- /*! card layout */
172
174
  .e-bigger .e-card,
173
175
  .e-bigger.e-card {
174
176
  line-height: 48px;
@@ -306,15 +308,20 @@
306
308
 
307
309
  .e-card {
308
310
  border-radius: 12px;
309
- box-sizing: border-box;
311
+ -webkit-box-sizing: border-box;
312
+ box-sizing: border-box;
313
+ display: -webkit-box;
310
314
  display: -ms-flexbox;
311
315
  display: flex;
312
- -ms-flex-direction: column;
313
- flex-direction: column;
316
+ -webkit-box-orient: vertical;
317
+ -webkit-box-direction: normal;
318
+ -ms-flex-direction: column;
319
+ flex-direction: column;
314
320
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
315
321
  font-size: 15px;
316
- -ms-flex-pack: center;
317
- justify-content: center;
322
+ -webkit-box-pack: center;
323
+ -ms-flex-pack: center;
324
+ justify-content: center;
318
325
  line-height: 36px;
319
326
  min-height: 36px;
320
327
  overflow: hidden;
@@ -324,11 +331,13 @@
324
331
  width: 100%;
325
332
  }
326
333
  .e-card > * {
327
- -ms-flex-pack: center;
328
- justify-content: center;
334
+ -webkit-box-pack: center;
335
+ -ms-flex-pack: center;
336
+ justify-content: center;
329
337
  }
330
338
  .e-card > .e-card-header-title {
331
- box-sizing: border-box;
339
+ -webkit-box-sizing: border-box;
340
+ box-sizing: border-box;
332
341
  font-size: 14px;
333
342
  line-height: 1.375;
334
343
  padding: 12px;
@@ -361,22 +370,30 @@
361
370
  font-size: 12px;
362
371
  }
363
372
  .e-card .e-card-stacked {
373
+ display: -webkit-box;
364
374
  display: -ms-flexbox;
365
375
  display: flex;
366
- -ms-flex-direction: column;
367
- flex-direction: column;
368
- -ms-flex-pack: center;
369
- justify-content: center;
376
+ -webkit-box-orient: vertical;
377
+ -webkit-box-direction: normal;
378
+ -ms-flex-direction: column;
379
+ flex-direction: column;
380
+ -webkit-box-pack: center;
381
+ -ms-flex-pack: center;
382
+ justify-content: center;
370
383
  overflow: hidden;
371
384
  }
372
385
  .e-card.e-card-horizontal,
373
386
  .e-card .e-card-horizontal {
387
+ display: -webkit-box;
374
388
  display: -ms-flexbox;
375
389
  display: flex;
376
- -ms-flex-direction: row;
377
- flex-direction: row;
378
- -ms-flex-pack: center;
379
- justify-content: center;
390
+ -webkit-box-orient: horizontal;
391
+ -webkit-box-direction: normal;
392
+ -ms-flex-direction: row;
393
+ flex-direction: row;
394
+ -webkit-box-pack: center;
395
+ -ms-flex-pack: center;
396
+ justify-content: center;
380
397
  }
381
398
  .e-card.e-card-horizontal .e-card-image,
382
399
  .e-card.e-card-horizontal img,
@@ -389,21 +406,27 @@
389
406
  padding: 2px;
390
407
  }
391
408
  .e-card.e-card-horizontal > * {
392
- -ms-flex: 1;
393
- flex: 1;
409
+ -webkit-box-flex: 1;
410
+ -ms-flex: 1;
411
+ flex: 1;
394
412
  }
395
413
  .e-card.e-card-horizontal .e-card-stacked {
414
+ display: -webkit-box;
396
415
  display: -ms-flexbox;
397
416
  display: flex;
398
- -ms-flex: 1;
399
- flex: 1;
400
- -ms-flex-direction: column;
401
- flex-direction: column;
417
+ -webkit-box-flex: 1;
418
+ -ms-flex: 1;
419
+ flex: 1;
420
+ -webkit-box-orient: vertical;
421
+ -webkit-box-direction: normal;
422
+ -ms-flex-direction: column;
423
+ flex-direction: column;
402
424
  overflow: hidden;
403
425
  }
404
426
  .e-card.e-card-horizontal .e-card-stacked > :first-child {
405
- -ms-flex-positive: 1;
406
- flex-grow: 1;
427
+ -webkit-box-flex: 1;
428
+ -ms-flex-positive: 1;
429
+ flex-grow: 1;
407
430
  }
408
431
  .e-card .e-card-separator {
409
432
  display: block;
@@ -412,13 +435,18 @@
412
435
  border-radius: 50%;
413
436
  }
414
437
  .e-card .e-card-header {
415
- box-sizing: border-box;
438
+ -webkit-box-sizing: border-box;
439
+ box-sizing: border-box;
440
+ display: -webkit-box;
416
441
  display: -ms-flexbox;
417
442
  display: flex;
418
- -ms-flex-direction: row;
419
- flex-direction: row;
420
- -ms-flex-pack: center;
421
- justify-content: center;
443
+ -webkit-box-orient: horizontal;
444
+ -webkit-box-direction: normal;
445
+ -ms-flex-direction: row;
446
+ flex-direction: row;
447
+ -webkit-box-pack: center;
448
+ -ms-flex-pack: center;
449
+ justify-content: center;
422
450
  line-height: normal;
423
451
  min-height: 22.5px;
424
452
  padding: 12px;
@@ -429,24 +457,30 @@
429
457
  padding-right: 0;
430
458
  }
431
459
  .e-card .e-card-header .e-card-actions {
432
- -ms-flex-pack: start;
433
- justify-content: flex-start;
460
+ -webkit-box-pack: start;
461
+ -ms-flex-pack: start;
462
+ justify-content: flex-start;
434
463
  }
435
464
  .e-card .e-card-header .e-card-header-image {
436
465
  -ms-flex-item-align: center;
437
466
  align-self: center;
467
+ display: -webkit-box;
438
468
  display: -ms-flexbox;
439
469
  display: flex;
440
470
  }
441
471
  .e-card .e-card-header .e-card-header-caption {
442
472
  -ms-flex-item-align: center;
443
473
  align-self: center;
474
+ display: -webkit-box;
444
475
  display: -ms-flexbox;
445
476
  display: flex;
446
- -ms-flex: 1;
447
- flex: 1;
448
- -ms-flex-direction: column;
449
- flex-direction: column;
477
+ -webkit-box-flex: 1;
478
+ -ms-flex: 1;
479
+ flex: 1;
480
+ -webkit-box-orient: vertical;
481
+ -webkit-box-direction: normal;
482
+ -ms-flex-direction: column;
483
+ flex-direction: column;
450
484
  overflow: hidden;
451
485
  padding: 0 0 0 12px;
452
486
  }
@@ -488,7 +522,8 @@
488
522
  }
489
523
  .e-card .e-card-image .e-card-title {
490
524
  bottom: 0;
491
- box-sizing: border-box;
525
+ -webkit-box-sizing: border-box;
526
+ box-sizing: border-box;
492
527
  font-size: 14px;
493
528
  line-height: 30px;
494
529
  min-height: 30px;
@@ -509,28 +544,34 @@
509
544
  text-align: right;
510
545
  }
511
546
  .e-card .e-card-actions {
512
- box-sizing: border-box;
547
+ -webkit-box-sizing: border-box;
548
+ box-sizing: border-box;
513
549
  display: inline-block;
514
- -ms-flex-pack: start;
515
- justify-content: flex-start;
550
+ -webkit-box-pack: start;
551
+ -ms-flex-pack: start;
552
+ justify-content: flex-start;
516
553
  padding: 12px;
517
554
  }
518
555
  .e-card .e-card-actions.e-card-vertical {
556
+ display: -webkit-box;
519
557
  display: -ms-flexbox;
520
558
  display: flex;
521
- -ms-flex-direction: column;
522
- flex-direction: column;
559
+ -webkit-box-orient: vertical;
560
+ -webkit-box-direction: normal;
561
+ -ms-flex-direction: column;
562
+ flex-direction: column;
523
563
  padding: 12px;
524
564
  }
525
565
  .e-card .e-card-actions.e-card-vertical .e-card-btn,
526
566
  .e-card .e-card-actions.e-card-vertical a {
527
567
  -ms-flex-item-align: initial;
528
- -ms-grid-row-align: initial;
529
568
  align-self: initial;
530
- box-sizing: border-box;
569
+ -webkit-box-sizing: border-box;
570
+ box-sizing: border-box;
531
571
  display: inline-block;
532
- -ms-flex-pack: center;
533
- justify-content: center;
572
+ -webkit-box-pack: center;
573
+ -ms-flex-pack: center;
574
+ justify-content: center;
534
575
  margin: 0 0 0 8px;
535
576
  text-align: center;
536
577
  width: 100%;
@@ -541,11 +582,13 @@
541
582
  }
542
583
  .e-card .e-card-actions button,
543
584
  .e-card .e-card-actions a {
544
- -ms-flex-align: center;
545
- align-items: center;
585
+ -webkit-box-align: center;
586
+ -ms-flex-align: center;
587
+ align-items: center;
546
588
  -ms-flex-item-align: center;
547
589
  align-self: center;
548
590
  cursor: pointer;
591
+ display: -webkit-inline-box;
549
592
  display: -ms-inline-flexbox;
550
593
  display: inline-flex;
551
594
  overflow: hidden;
@@ -554,6 +597,7 @@
554
597
  }
555
598
  .e-card .e-card-actions .e-card-btn span,
556
599
  .e-card .e-card-actions .e-card-btn span.e-icons {
600
+ display: -webkit-box;
557
601
  display: -ms-flexbox;
558
602
  display: flex;
559
603
  font-size: 12px;
@@ -564,10 +608,12 @@
564
608
  .e-card .e-card-actions .e-card-btn span.e-icons::before {
565
609
  -ms-flex-item-align: center;
566
610
  align-self: center;
611
+ display: -webkit-box;
567
612
  display: -ms-flexbox;
568
613
  display: flex;
569
- -ms-flex-pack: center;
570
- justify-content: center;
614
+ -webkit-box-pack: center;
615
+ -ms-flex-pack: center;
616
+ justify-content: center;
571
617
  width: inherit;
572
618
  }
573
619
  .e-card .e-card-actions .e-card-btn > * {
@@ -612,13 +658,14 @@
612
658
  text-overflow: ellipsis;
613
659
  }
614
660
 
615
- /*! card theme */
616
661
  /* stylelint-disable property-no-vendor-prefix */
617
662
  .e-card {
618
663
  -webkit-tap-highlight-color: rgba(var(--color-sf-primary));
664
+ background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.05)), to(rgba(var(--color-sf-primary), 0.05))), rgba(var(--color-sf-surface));
619
665
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface));
620
666
  border: none none none;
621
- box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
667
+ -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
668
+ box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
622
669
  color: rgba(var(--color-sf-on-surface));
623
670
  outline: none;
624
671
  }
@@ -666,12 +713,14 @@
666
713
  }
667
714
  .e-card .e-card-actions .e-card-btn:focus,
668
715
  .e-card .e-card-actions a:focus {
716
+ background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-surface), 0.08)), to(rgba(var(--color-sf-on-surface), 0.08))), rgba(var(--color-sf-surface));
669
717
  background: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08)), rgba(var(--color-sf-surface));
670
718
  border: 1px solid;
671
719
  color: var(--color-sf-on-surface);
672
720
  }
673
721
  .e-card .e-card-actions .e-card-btn:active,
674
722
  .e-card .e-card-actions a:active {
723
+ background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-surface), 0.12)), to(rgba(var(--color-sf-on-surface), 0.12))), rgba(var(--color-sf-surface));
675
724
  background: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12)), rgba(var(--color-sf-surface));
676
725
  border: 1px solid linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12));
677
726
  color: rgba(var(--color-sf-on-surface));
@@ -700,6 +749,7 @@
700
749
 
701
750
  .e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-vertical {
702
751
  border-width: 1px;
752
+ display: -webkit-box;
703
753
  display: -ms-flexbox;
704
754
  display: flex;
705
755
  overflow: hidden;
@@ -709,8 +759,9 @@
709
759
  width: 100%;
710
760
  }
711
761
  .e-splitter.e-splitter-horizontal .e-pane, .e-splitter.e-splitter-vertical .e-pane {
712
- -ms-flex: 1 1 auto;
713
- flex: 1 1 auto;
762
+ -webkit-box-flex: 1;
763
+ -ms-flex: 1 1 auto;
764
+ flex: 1 1 auto;
714
765
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
715
766
  font-size: 14px;
716
767
  font-weight: 400;
@@ -719,8 +770,9 @@
719
770
  overflow: auto;
720
771
  }
721
772
  .e-splitter.e-splitter-horizontal .e-pane.e-static-pane, .e-splitter.e-splitter-vertical .e-pane.e-static-pane {
722
- -ms-flex-positive: 0;
723
- flex-grow: 0;
773
+ -webkit-box-flex: 0;
774
+ -ms-flex-positive: 0;
775
+ flex-grow: 0;
724
776
  -ms-flex-negative: 0;
725
777
  flex-shrink: 0;
726
778
  }
@@ -733,27 +785,35 @@
733
785
  overflow: hidden !important; /* stylelint-disable-line declaration-no-important */
734
786
  }
735
787
  .e-splitter.e-splitter-horizontal {
736
- -ms-flex-direction: row;
737
- flex-direction: row;
788
+ -webkit-box-orient: horizontal;
789
+ -webkit-box-direction: normal;
790
+ -ms-flex-direction: row;
791
+ flex-direction: row;
738
792
  }
739
793
  .e-splitter.e-splitter-horizontal.e-pane.e-scrollable {
740
794
  overflow: hidden;
741
795
  }
742
796
  .e-splitter.e-splitter-horizontal.e-rtl {
743
- -ms-flex-direction: row-reverse;
744
- flex-direction: row-reverse;
797
+ -webkit-box-orient: horizontal;
798
+ -webkit-box-direction: reverse;
799
+ -ms-flex-direction: row-reverse;
800
+ flex-direction: row-reverse;
745
801
  }
746
802
  .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal {
747
- -ms-flex-direction: row-reverse;
748
- flex-direction: row-reverse;
803
+ -webkit-box-orient: horizontal;
804
+ -webkit-box-direction: reverse;
805
+ -ms-flex-direction: row-reverse;
806
+ flex-direction: row-reverse;
749
807
  }
750
808
  .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::before,
751
809
  .e-splitter.e-splitter-horizontal.e-rtl .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right)::after {
752
810
  right: auto;
753
811
  }
754
812
  .e-splitter.e-splitter-vertical {
755
- -ms-flex-direction: column;
756
- flex-direction: column;
813
+ -webkit-box-orient: vertical;
814
+ -webkit-box-direction: normal;
815
+ -ms-flex-direction: column;
816
+ flex-direction: column;
757
817
  }
758
818
  .e-splitter.e-splitter-vertical.e-pane.e-scrollable {
759
819
  overflow: hidden;
@@ -785,14 +845,18 @@
785
845
  right: auto;
786
846
  }
787
847
  .e-splitter .e-split-bar.e-split-bar-horizontal {
788
- -ms-flex-align: center;
789
- align-items: center;
848
+ -webkit-box-align: center;
849
+ -ms-flex-align: center;
850
+ align-items: center;
851
+ display: -webkit-box;
790
852
  display: -ms-flexbox;
791
853
  display: flex;
792
- -ms-flex: 0 0 auto;
793
- flex: 0 0 auto;
794
- -ms-flex-pack: center;
795
- justify-content: center;
854
+ -webkit-box-flex: 0;
855
+ -ms-flex: 0 0 auto;
856
+ flex: 0 0 auto;
857
+ -webkit-box-pack: center;
858
+ -ms-flex-pack: center;
859
+ justify-content: center;
796
860
  min-width: 1px;
797
861
  z-index: 15;
798
862
  }
@@ -812,13 +876,16 @@
812
876
  z-index: 10;
813
877
  }
814
878
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler {
815
- -ms-flex-align: center;
816
- align-items: center;
879
+ -webkit-box-align: center;
880
+ -ms-flex-align: center;
881
+ align-items: center;
882
+ display: -webkit-box;
817
883
  display: -ms-flexbox;
818
884
  display: flex;
819
885
  height: 18px;
820
- -ms-flex-pack: center;
821
- justify-content: center;
886
+ -webkit-box-pack: center;
887
+ -ms-flex-pack: center;
888
+ justify-content: center;
822
889
  position: relative;
823
890
  width: 1px;
824
891
  }
@@ -831,9 +898,11 @@
831
898
  right: 3px;
832
899
  }
833
900
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow {
834
- border-image: none;
901
+ -o-border-image: none;
902
+ border-image: none;
835
903
  border-width: 1px;
836
904
  cursor: pointer;
905
+ display: -webkit-box;
837
906
  display: -ms-flexbox;
838
907
  display: flex;
839
908
  height: 26px;
@@ -845,16 +914,19 @@
845
914
  content: "";
846
915
  height: 8px;
847
916
  position: absolute;
848
- transform: rotate(0deg);
917
+ -webkit-transform: rotate(0deg);
918
+ transform: rotate(0deg);
849
919
  width: 2px;
850
920
  }
851
921
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::before {
852
922
  top: 5px;
853
- transform-origin: 1px 7px 0;
923
+ -webkit-transform-origin: 1px 7px 0;
924
+ transform-origin: 1px 7px 0;
854
925
  }
855
926
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow::after {
856
927
  top: 11px;
857
- transform-origin: 1px 1px 0;
928
+ -webkit-transform-origin: 1px 1px 0;
929
+ transform-origin: 1px 1px 0;
858
930
  }
859
931
  .e-splitter .e-split-bar.e-split-bar-horizontal .e-navigate-arrow:not(.e-arrow-right) {
860
932
  border-radius: 50%;
@@ -874,16 +946,20 @@
874
946
  margin: 0 0 0 3px;
875
947
  }
876
948
  .e-splitter .e-split-bar.e-split-bar-vertical {
877
- -ms-flex-align: center;
878
- align-items: center;
949
+ -webkit-box-align: center;
950
+ -ms-flex-align: center;
951
+ align-items: center;
879
952
  border-left: none;
880
953
  border-right: none;
954
+ display: -webkit-box;
881
955
  display: -ms-flexbox;
882
956
  display: flex;
883
- -ms-flex: 0 0 auto;
884
- flex: 0 0 auto;
885
- -ms-flex-pack: center;
886
- justify-content: center;
957
+ -webkit-box-flex: 0;
958
+ -ms-flex: 0 0 auto;
959
+ flex: 0 0 auto;
960
+ -webkit-box-pack: center;
961
+ -ms-flex-pack: center;
962
+ justify-content: center;
887
963
  min-height: 1px;
888
964
  }
889
965
  .e-splitter .e-split-bar.e-split-bar-vertical .e-icon-hidden {
@@ -902,13 +978,16 @@
902
978
  z-index: 12;
903
979
  }
904
980
  .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler {
905
- -ms-flex-align: center;
906
- align-items: center;
981
+ -webkit-box-align: center;
982
+ -ms-flex-align: center;
983
+ align-items: center;
984
+ display: -webkit-box;
907
985
  display: -ms-flexbox;
908
986
  display: flex;
909
987
  height: 1px;
910
- -ms-flex-pack: center;
911
- justify-content: center;
988
+ -webkit-box-pack: center;
989
+ -ms-flex-pack: center;
990
+ justify-content: center;
912
991
  width: 18px;
913
992
  }
914
993
  .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler.e-hide-handler {
@@ -919,9 +998,11 @@
919
998
  left: 10px;
920
999
  }
921
1000
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow {
922
- border-image: none;
1001
+ -o-border-image: none;
1002
+ border-image: none;
923
1003
  border-width: 0;
924
1004
  cursor: pointer;
1005
+ display: -webkit-box;
925
1006
  display: -ms-flexbox;
926
1007
  display: flex;
927
1008
  height: 26px;
@@ -934,27 +1015,32 @@
934
1015
  content: "";
935
1016
  height: 8px;
936
1017
  position: absolute;
937
- transform: rotate(90deg);
1018
+ -webkit-transform: rotate(90deg);
1019
+ transform: rotate(90deg);
938
1020
  width: 2px;
939
1021
  }
940
1022
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::before {
941
1023
  top: 3px;
942
- transform-origin: 2px 7px 0;
1024
+ -webkit-transform-origin: 2px 7px 0;
1025
+ transform-origin: 2px 7px 0;
943
1026
  }
944
1027
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down)::after {
945
1028
  left: 11px;
946
1029
  top: 8px;
947
- transform-origin: 1px 1px 0;
1030
+ -webkit-transform-origin: 1px 1px 0;
1031
+ transform-origin: 1px 1px 0;
948
1032
  }
949
1033
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before {
950
1034
  left: 12px;
951
1035
  top: 8px;
952
- transform-origin: 1px 6px 0;
1036
+ -webkit-transform-origin: 1px 6px 0;
1037
+ transform-origin: 1px 6px 0;
953
1038
  }
954
1039
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
955
1040
  left: 10px;
956
1041
  top: 12px;
957
- transform-origin: 1px 2px 0;
1042
+ -webkit-transform-origin: 1px 2px 0;
1043
+ transform-origin: 1px 2px 0;
958
1044
  }
959
1045
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
960
1046
  border-radius: 50%;
@@ -994,8 +1080,10 @@
994
1080
  }
995
1081
 
996
1082
  .e-rtl .e-splitter.e-splitter-horizontal {
997
- -ms-flex-direction: row-reverse;
998
- flex-direction: row-reverse;
1083
+ -webkit-box-orient: horizontal;
1084
+ -webkit-box-direction: reverse;
1085
+ -ms-flex-direction: row-reverse;
1086
+ flex-direction: row-reverse;
999
1087
  }
1000
1088
 
1001
1089
  .e-bigger .e-splitter .e-pane {
@@ -1024,8 +1112,10 @@
1024
1112
  }
1025
1113
 
1026
1114
  .e-splitter.e-ie .e-split-bar-horizontal .e-resize-handler {
1027
- -ms-flex-direction: column;
1028
- flex-direction: column;
1115
+ -webkit-box-orient: vertical;
1116
+ -webkit-box-direction: normal;
1117
+ -ms-flex-direction: column;
1118
+ flex-direction: column;
1029
1119
  }
1030
1120
 
1031
1121
  .e-splitter.e-splitter-horizontal, .e-splitter.e-splitter-vertical {
@@ -1051,13 +1141,16 @@
1051
1141
  background-color: transparent;
1052
1142
  border-color: transparent;
1053
1143
  color: transparent;
1144
+ -webkit-transition: background-color 500ms ease-out;
1054
1145
  transition: background-color 500ms ease-out;
1055
1146
  }
1056
1147
  .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 {
1057
1148
  background-color: rgba(var(--color-sf-primary));
1058
1149
  opacity: 0;
1059
- transition-duration: 0.3s;
1060
- transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
1150
+ -webkit-transition-duration: 0.3s;
1151
+ transition-duration: 0.3s;
1152
+ -webkit-transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
1153
+ transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
1061
1154
  }
1062
1155
  .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 {
1063
1156
  background: rgba(var(--color-sf-primary));
@@ -1077,22 +1170,26 @@
1077
1170
  .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 {
1078
1171
  background-color: rgba(var(--color-sf-primary));
1079
1172
  opacity: 1;
1080
- transform: rotate(40deg);
1173
+ -webkit-transform: rotate(40deg);
1174
+ transform: rotate(40deg);
1081
1175
  }
1082
1176
  .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 {
1083
1177
  background-color: rgba(var(--color-sf-primary));
1084
1178
  opacity: 1;
1085
- transform: rotate(-40deg);
1179
+ -webkit-transform: rotate(-40deg);
1180
+ transform: rotate(-40deg);
1086
1181
  }
1087
1182
  .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 {
1088
1183
  background-color: rgba(var(--color-sf-primary));
1089
1184
  opacity: 1;
1090
- transform: rotate(-40deg);
1185
+ -webkit-transform: rotate(-40deg);
1186
+ transform: rotate(-40deg);
1091
1187
  }
1092
1188
  .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 {
1093
1189
  background-color: rgba(var(--color-sf-primary));
1094
1190
  opacity: 1;
1095
- transform: rotate(40deg);
1191
+ -webkit-transform: rotate(40deg);
1192
+ transform: rotate(40deg);
1096
1193
  }
1097
1194
  .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active {
1098
1195
  background: rgba(var(--color-sf-primary));
@@ -1127,34 +1224,41 @@
1127
1224
  .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 {
1128
1225
  background-color: rgba(var(--color-sf-primary));
1129
1226
  opacity: 1;
1130
- transform: rotate(125deg);
1227
+ -webkit-transform: rotate(125deg);
1228
+ transform: rotate(125deg);
1131
1229
  }
1132
1230
  .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 {
1133
1231
  background-color: rgba(var(--color-sf-primary));
1134
1232
  opacity: 1;
1135
- transform: rotate(50deg);
1233
+ -webkit-transform: rotate(50deg);
1234
+ transform: rotate(50deg);
1136
1235
  }
1137
1236
  .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 {
1138
1237
  background-color: rgba(var(--color-sf-primary));
1139
1238
  opacity: 1;
1140
- transform: rotate(55deg);
1239
+ -webkit-transform: rotate(55deg);
1240
+ transform: rotate(55deg);
1141
1241
  }
1142
1242
  .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 {
1143
1243
  background-color: rgba(var(--color-sf-primary));
1144
1244
  opacity: 1;
1145
- transform: rotate(125deg);
1245
+ -webkit-transform: rotate(125deg);
1246
+ transform: rotate(125deg);
1146
1247
  }
1147
1248
  .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow {
1148
1249
  background-color: transparent;
1149
1250
  border-color: transparent;
1150
1251
  color: transparent;
1252
+ -webkit-transition: background-color 300ms ease-out;
1151
1253
  transition: background-color 300ms ease-out;
1152
1254
  }
1153
1255
  .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 {
1154
1256
  background-color: rgba(var(--color-sf-primary));
1155
1257
  opacity: 0;
1156
- transition-duration: 0.3s;
1157
- transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
1258
+ -webkit-transition-duration: 0.3s;
1259
+ transition-duration: 0.3s;
1260
+ -webkit-transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
1261
+ transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
1158
1262
  }
1159
1263
  .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active {
1160
1264
  background: rgba(var(--color-sf-primary));
@@ -1168,8 +1272,7 @@
1168
1272
  pointer-events: none;
1169
1273
  }
1170
1274
 
1171
- /* stylelint-disable-line no-empty-source */ /*! component's theme wise override material 3 definitions and variables */
1172
- /* stylelint-disable */
1275
+ /* stylelint-disable-line no-empty-source */
1173
1276
  .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east {
1174
1277
  height: 100%;
1175
1278
  padding: 20px 0;
@@ -1229,16 +1332,18 @@
1229
1332
  font-size: 12px;
1230
1333
  left: 4px;
1231
1334
  position: absolute;
1232
- transform: rotateY(180deg);
1335
+ -webkit-transform: rotateY(180deg);
1336
+ transform: rotateY(180deg);
1233
1337
  }
1234
1338
 
1235
1339
  .e-dashboardlayout.e-control .e-dashboard-gridline-table {
1340
+ background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.05)), to(rgba(var(--color-sf-primary), 0.05))), rgba(var(--color-sf-surface));
1236
1341
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface));
1237
1342
  border-collapse: collapse;
1238
1343
  height: 100%;
1239
1344
  width: 100%;
1240
1345
  }
1241
- .e-dashboardlayout.e-control .e-dashboard-gridline-table tbody tr td.e-dashboard-gridline {
1346
+ .e-dashboardlayout.e-control .e-dashboard-gridline-table td.e-dashboard-gridline {
1242
1347
  border: 1px dashed rgba(var(--color-sf-primary));
1243
1348
  position: absolute;
1244
1349
  }
@@ -1247,15 +1352,27 @@
1247
1352
  }
1248
1353
  .e-dashboardlayout.e-control.e-prevent {
1249
1354
  -webkit-user-select: none;
1355
+ -moz-user-select: none;
1250
1356
  -ms-user-select: none;
1251
1357
  user-select: none;
1252
1358
  }
1359
+ .e-dashboardlayout.e-control .e-panel.e-ssr {
1360
+ position: relative;
1361
+ }
1253
1362
  .e-dashboardlayout.e-control .e-panel {
1363
+ border: 1px solid rgba(var(--color-sf-outline-variant));
1364
+ height: 100%;
1365
+ -webkit-user-select: none;
1366
+ -moz-user-select: none;
1367
+ -ms-user-select: none;
1368
+ user-select: none;
1369
+ width: 100%;
1254
1370
  border-radius: 8px;
1255
1371
  }
1256
1372
  .e-dashboardlayout.e-control .e-panel:hover {
1257
1373
  border: 1px solid rgba(var(--color-sf-outline-variant));
1258
- box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
1374
+ -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
1375
+ box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
1259
1376
  }
1260
1377
  .e-dashboardlayout.e-control .e-panel:hover .e-panel-container .e-resize.e-dl-icon {
1261
1378
  display: block;
@@ -1263,10 +1380,19 @@
1263
1380
  .e-dashboardlayout.e-control .e-panel:active {
1264
1381
  border: 1px solid rgba(var(--color-sf-primary));
1265
1382
  }
1383
+ .e-dashboardlayout.e-control .e-panel .e-panel-container {
1384
+ height: 100%;
1385
+ width: 100%;
1386
+ }
1387
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-content .e-blazor-template {
1388
+ height: inherit;
1389
+ width: inherit;
1390
+ }
1266
1391
  .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-dl-icon {
1267
1392
  display: none;
1268
1393
  }
1269
1394
  .e-dashboardlayout.e-control .e-panel.e-panel-transition {
1395
+ -webkit-transition: top 0.5s, left 0.5s;
1270
1396
  transition: top 0.5s, left 0.5s;
1271
1397
  }
1272
1398
  .e-dashboardlayout.e-control .e-panel .e-panel-header {
@@ -1291,22 +1417,6 @@
1291
1417
  .e-dashboardlayout.e-control .e-panel .e-panel-header .e-header-template {
1292
1418
  float: right;
1293
1419
  }
1294
- .e-dashboardlayout.e-control .e-panel .e-panel-container {
1295
- height: 100%;
1296
- width: 100%;
1297
- }
1298
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-content .e-blazor-template {
1299
- height: inherit;
1300
- width: inherit;
1301
- }
1302
- .e-dashboardlayout.e-control .e-panel {
1303
- border: 1px solid rgba(var(--color-sf-outline-variant));
1304
- height: 100%;
1305
- -webkit-user-select: none;
1306
- -ms-user-select: none;
1307
- user-select: none;
1308
- width: 100%;
1309
- }
1310
1420
  .e-dashboardlayout.e-control .e-panel .e-resize.e-single, .e-dashboardlayout.e-control .e-panel .e-resize.e-double {
1311
1421
  position: absolute;
1312
1422
  -ms-touch-action: none;
@@ -1343,13 +1453,6 @@
1343
1453
  font-family: "e-icons";
1344
1454
  position: absolute;
1345
1455
  }
1346
- .e-dashboardlayout.e-control .e-drag:hover {
1347
- cursor: move;
1348
- }
1349
- .e-dashboardlayout.e-control .e-drag-restrict.e-drag:hover,
1350
- .e-dashboardlayout.e-control .e-drag-restrict .e-drag:hover {
1351
- cursor: default;
1352
- }
1353
1456
  .e-dashboardlayout.e-control .e-panel.e-dragging, .e-dashboardlayout.e-control .e-panel.e-item-moving {
1354
1457
  cursor: move;
1355
1458
  z-index: 1111 !important;
@@ -1357,6 +1460,19 @@
1357
1460
  .e-dashboardlayout.e-control .e-panel.e-rtl .e-panel-header .e-header-template {
1358
1461
  float: left;
1359
1462
  }
1463
+ .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
1464
+ font-size: 16px;
1465
+ font-weight: 600;
1466
+ height: 48px;
1467
+ padding: 14px 16px;
1468
+ }
1469
+ .e-dashboardlayout.e-control .e-drag:hover {
1470
+ cursor: move;
1471
+ }
1472
+ .e-dashboardlayout.e-control .e-drag-restrict.e-drag:hover,
1473
+ .e-dashboardlayout.e-control .e-drag-restrict .e-drag:hover {
1474
+ cursor: default;
1475
+ }
1360
1476
  .e-dashboardlayout.e-control .e-holder {
1361
1477
  background: rgba(var(--color-sf-primary-container));
1362
1478
  border: 1px rgba(var(--color-sf-primary)) dashed;
@@ -1365,14 +1481,9 @@
1365
1481
  border-radius: 8px;
1366
1482
  }
1367
1483
  .e-dashboardlayout.e-control .e-holder.e-holder-transition {
1484
+ -webkit-transition: top 0.3s, left 0.3s;
1368
1485
  transition: top 0.3s, left 0.3s;
1369
1486
  }
1370
- .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
1371
- font-size: 16px;
1372
- font-weight: 600;
1373
- height: 48px;
1374
- padding: 14px 16px;
1375
- }
1376
1487
 
1377
1488
  .e-bigger .e-dashboardlayout.e-control .e-panel .e-panel-header {
1378
1489
  font-size: 16px;
@@ -1391,23 +1502,18 @@
1391
1502
  }
1392
1503
  .e-dashboardlayout.e-control .e-panel {
1393
1504
  background: rgba(var(--color-sf-surface));
1394
- box-shadow: none;
1395
- box-sizing: border-box;
1505
+ -webkit-box-shadow: none;
1506
+ box-shadow: none;
1507
+ -webkit-box-sizing: border-box;
1508
+ box-sizing: border-box;
1396
1509
  position: absolute;
1397
1510
  }
1398
1511
  .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
1399
1512
  color: rgba(var(--color-sf-on-surface));
1513
+ background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.05)), to(rgba(var(--color-sf-primary), 0.05))), rgba(var(--color-sf-surface));
1400
1514
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface));
1401
- box-sizing: border-box;
1402
- }
1403
- .e-dashboardlayout.e-control .e-panel {
1404
- background: rgba(var(--color-sf-surface));
1405
- box-shadow: none;
1406
- box-sizing: border-box;
1407
- position: absolute;
1408
- }
1409
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
1410
- color: rgba(var(--color-sf-on-surface));
1515
+ -webkit-box-sizing: border-box;
1516
+ box-sizing: border-box;
1411
1517
  }
1412
1518
  .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-single {
1413
1519
  background: none;
@@ -1482,12 +1588,15 @@
1482
1588
  .e-timeline [class^="e-dot "]::before,
1483
1589
  .e-timeline .e-dot-item,
1484
1590
  .e-timeline .e-dot {
1591
+ display: -webkit-box;
1485
1592
  display: -ms-flexbox;
1486
1593
  display: flex;
1487
- -ms-flex-align: center;
1488
- align-items: center;
1489
- -ms-flex-pack: center;
1490
- justify-content: center;
1594
+ -webkit-box-align: center;
1595
+ -ms-flex-align: center;
1596
+ align-items: center;
1597
+ -webkit-box-pack: center;
1598
+ -ms-flex-pack: center;
1599
+ justify-content: center;
1491
1600
  }
1492
1601
  .e-timeline [class^="e-dot "]::before {
1493
1602
  min-width: 32px;
@@ -1495,10 +1604,13 @@
1495
1604
  border-radius: var(--dot-radius);
1496
1605
  }
1497
1606
  .e-timeline .e-timeline-items {
1607
+ display: -webkit-inline-box;
1498
1608
  display: -ms-inline-flexbox;
1499
1609
  display: inline-flex;
1500
- -ms-flex-direction: column;
1501
- flex-direction: column;
1610
+ -webkit-box-orient: vertical;
1611
+ -webkit-box-direction: normal;
1612
+ -ms-flex-direction: column;
1613
+ flex-direction: column;
1502
1614
  list-style: none;
1503
1615
  -ms-flex-wrap: nowrap;
1504
1616
  flex-wrap: nowrap;
@@ -1507,13 +1619,17 @@
1507
1619
  height: inherit;
1508
1620
  }
1509
1621
  .e-timeline .e-timeline-item {
1622
+ display: -webkit-box;
1510
1623
  display: -ms-flexbox;
1511
1624
  display: flex;
1512
- -ms-flex-direction: row;
1513
- flex-direction: row;
1625
+ -webkit-box-orient: horizontal;
1626
+ -webkit-box-direction: normal;
1627
+ -ms-flex-direction: row;
1628
+ flex-direction: row;
1514
1629
  position: relative;
1515
- -ms-flex-align: start;
1516
- align-items: flex-start;
1630
+ -webkit-box-align: start;
1631
+ -ms-flex-align: start;
1632
+ align-items: flex-start;
1517
1633
  width: inherit;
1518
1634
  height: inherit;
1519
1635
  }
@@ -1533,8 +1649,9 @@
1533
1649
  }
1534
1650
  .e-timeline .e-dot-item {
1535
1651
  position: relative;
1536
- -ms-flex: 0 1 calc(var(--dot-size) * 3);
1537
- flex: 0 1 calc(var(--dot-size) * 3);
1652
+ -webkit-box-flex: 0;
1653
+ -ms-flex: 0 1 calc(var(--dot-size) * 3);
1654
+ flex: 0 1 calc(var(--dot-size) * 3);
1538
1655
  z-index: 1000;
1539
1656
  }
1540
1657
  .e-timeline .e-dot {
@@ -1550,12 +1667,12 @@
1550
1667
  }
1551
1668
  .e-timeline .e-opposite-content,
1552
1669
  .e-timeline .e-content {
1553
- -ms-flex: 1 1 50%;
1554
- flex: 1 1 50%;
1670
+ -webkit-box-flex: 1;
1671
+ -ms-flex: 1 1 50%;
1672
+ flex: 1 1 50%;
1555
1673
  }
1556
1674
  .e-timeline .e-opposite-content {
1557
1675
  font-size: 12px;
1558
- text-align: right;
1559
1676
  }
1560
1677
  .e-timeline .e-content {
1561
1678
  text-align: left;
@@ -1569,12 +1686,16 @@
1569
1686
  bottom: calc(var(--dot-size) * 2);
1570
1687
  }
1571
1688
  .e-timeline.e-vertical.e-align-before .e-timeline-item, .e-timeline.e-vertical.e-align-alternate .e-timeline-item:nth-of-type(even), .e-timeline.e-vertical.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) {
1572
- -ms-flex-direction: row-reverse;
1573
- flex-direction: row-reverse;
1689
+ -webkit-box-orient: horizontal;
1690
+ -webkit-box-direction: reverse;
1691
+ -ms-flex-direction: row-reverse;
1692
+ flex-direction: row-reverse;
1574
1693
  }
1575
1694
  .e-timeline.e-vertical.e-timeline-reverse .e-timeline-items {
1576
- -ms-flex-direction: column-reverse;
1577
- flex-direction: column-reverse;
1695
+ -webkit-box-orient: vertical;
1696
+ -webkit-box-direction: reverse;
1697
+ -ms-flex-direction: column-reverse;
1698
+ flex-direction: column-reverse;
1578
1699
  }
1579
1700
  .e-timeline.e-vertical.e-align-before .e-timeline-items .e-opposite-content, .e-timeline.e-vertical.e-align-after .e-timeline-items .e-content {
1580
1701
  text-align: left;
@@ -1582,6 +1703,19 @@
1582
1703
  .e-timeline.e-vertical .e-timeline-item.e-connector:last-child::after {
1583
1704
  content: unset;
1584
1705
  }
1706
+ .e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-rtl.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-before.e-rtl.e-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-content-only .e-connector::after {
1707
+ left: calc(var(--dot-size) * 3 / 2 - var(--connector-size));
1708
+ right: auto;
1709
+ }
1710
+ .e-timeline.e-vertical.e-align-before.e-content-only .e-connector::after, .e-timeline.e-vertical.e-align-before.e-rtl.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-rtl.e-content-only .e-connector::after {
1711
+ right: calc(var(--dot-size) * 3 / 2 - var(--connector-size));
1712
+ left: auto;
1713
+ }
1714
+ .e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-content, .e-timeline.e-vertical.e-align-after.e-content-only .e-opposite-content, .e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-content, .e-timeline.e-vertical.e-align-before.e-content-only .e-opposite-content {
1715
+ -webkit-box-flex: 0;
1716
+ -ms-flex: 0;
1717
+ flex: 0;
1718
+ }
1585
1719
  .e-timeline.e-vertical.e-timeline-reverse .e-timeline-item.e-connector:first-child::after {
1586
1720
  content: unset;
1587
1721
  }
@@ -1599,13 +1733,27 @@
1599
1733
  width: calc(var(--dot-size) * 2);
1600
1734
  }
1601
1735
  .e-timeline.e-horizontal .e-timeline-items {
1736
+ display: -webkit-inline-box;
1602
1737
  display: -ms-inline-flexbox;
1603
1738
  display: inline-flex;
1604
- -ms-flex-direction: row;
1605
- flex-direction: row;
1739
+ -webkit-box-orient: horizontal;
1740
+ -webkit-box-direction: normal;
1741
+ -ms-flex-direction: row;
1742
+ flex-direction: row;
1606
1743
  }
1607
1744
  .e-timeline.e-horizontal .e-timeline-item {
1608
1745
  height: auto;
1746
+ -webkit-box-orient: vertical;
1747
+ -webkit-box-direction: normal;
1748
+ -ms-flex-direction: column;
1749
+ flex-direction: column;
1750
+ -webkit-box-align: center;
1751
+ -ms-flex-align: center;
1752
+ align-items: center;
1753
+ }
1754
+ .e-timeline.e-horizontal.e-timeline-reverse.e-rtl .e-timeline-item.e-connector::after {
1755
+ left: calc(50% - var(--connector-size));
1756
+ right: auto;
1609
1757
  }
1610
1758
  .e-timeline.e-horizontal.e-rtl .e-timeline-item.e-connector::after, .e-timeline.e-horizontal.e-timeline-reverse .e-timeline-item.e-connector::after {
1611
1759
  right: calc(50% - var(--connector-size));
@@ -1614,32 +1762,33 @@
1614
1762
  .e-timeline.e-horizontal .e-dot-item {
1615
1763
  margin: calc(var(--dot-size) * 2 / 2) 0;
1616
1764
  }
1617
- .e-timeline.e-horizontal .e-timeline-item {
1618
- -ms-flex-direction: column;
1619
- flex-direction: column;
1620
- -ms-flex-align: center;
1621
- align-items: center;
1622
- }
1623
1765
  .e-timeline.e-horizontal .e-opposite-content,
1624
1766
  .e-timeline.e-horizontal .e-content {
1767
+ display: -webkit-box;
1625
1768
  display: -ms-flexbox;
1626
1769
  display: flex;
1627
1770
  }
1628
1771
  .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(odd) .e-opposite-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(even) .e-opposite-content, .e-timeline.e-horizontal.e-align-before .e-content {
1629
- -ms-flex-align: end;
1630
- align-items: flex-end;
1772
+ -webkit-box-align: end;
1773
+ -ms-flex-align: end;
1774
+ align-items: flex-end;
1631
1775
  }
1632
1776
  .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(even) .e-opposite-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-opposite-content, .e-timeline.e-horizontal.e-align-before .e-opposite-content {
1633
- -ms-flex-align: start;
1634
- align-items: flex-start;
1777
+ -webkit-box-align: start;
1778
+ -ms-flex-align: start;
1779
+ align-items: flex-start;
1635
1780
  }
1636
1781
  .e-timeline.e-horizontal.e-align-before .e-timeline-item, .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(even), .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) {
1637
- -ms-flex-direction: column-reverse;
1638
- flex-direction: column-reverse;
1782
+ -webkit-box-orient: vertical;
1783
+ -webkit-box-direction: reverse;
1784
+ -ms-flex-direction: column-reverse;
1785
+ flex-direction: column-reverse;
1639
1786
  }
1640
1787
  .e-timeline.e-horizontal.e-timeline-reverse .e-timeline-items {
1641
- -ms-flex-direction: row-reverse;
1642
- flex-direction: row-reverse;
1788
+ -webkit-box-orient: horizontal;
1789
+ -webkit-box-direction: reverse;
1790
+ -ms-flex-direction: row-reverse;
1791
+ flex-direction: row-reverse;
1643
1792
  }
1644
1793
  .e-timeline.e-horizontal .e-timeline-item::after {
1645
1794
  width: 100%;
@@ -1647,10 +1796,12 @@
1647
1796
  top: calc(50% - var(--connector-size));
1648
1797
  }
1649
1798
  .e-timeline.e-horizontal .e-opposite-content {
1799
+ display: -webkit-box;
1650
1800
  display: -ms-flexbox;
1651
1801
  display: flex;
1652
- -ms-flex-align: end;
1653
- align-items: flex-end;
1802
+ -webkit-box-align: end;
1803
+ -ms-flex-align: end;
1804
+ align-items: flex-end;
1654
1805
  text-align: left;
1655
1806
  padding: 0;
1656
1807
  }
@@ -1669,8 +1820,23 @@
1669
1820
  }
1670
1821
  .e-bigger.e-timeline .e-dot-item,
1671
1822
  .e-bigger .e-timeline .e-dot-item {
1672
- -ms-flex: 0 1 calc(var(--dot-size) * 4);
1673
- flex: 0 1 calc(var(--dot-size) * 4);
1823
+ -webkit-box-flex: 0;
1824
+ -ms-flex: 0 1 calc(var(--dot-size) * 4);
1825
+ flex: 0 1 calc(var(--dot-size) * 4);
1826
+ }
1827
+ .e-bigger.e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-rtl.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-before.e-rtl.e-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-content-only .e-connector::after,
1828
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-connector::after,
1829
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-rtl.e-opposite-content-only .e-connector::after,
1830
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-rtl.e-content-only .e-connector::after,
1831
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-content-only .e-connector::after {
1832
+ left: calc(var(--dot-size) * 4 / 2 - var(--connector-size));
1833
+ }
1834
+ .e-bigger.e-timeline.e-vertical.e-align-before.e-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-before.e-rtl.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-rtl.e-content-only .e-connector::after,
1835
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-content-only .e-connector::after,
1836
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-rtl.e-opposite-content-only .e-connector::after,
1837
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-connector::after,
1838
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-rtl.e-content-only .e-connector::after {
1839
+ right: calc(var(--dot-size) * 4 / 2 - var(--connector-size));
1674
1840
  }
1675
1841
  .e-bigger.e-timeline .e-dot,
1676
1842
  .e-bigger .e-timeline .e-dot {