@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
@@ -1,4 +1,3 @@
1
- /*! card layout */
2
1
  .e-bigger .e-card,
3
2
  .e-bigger.e-card {
4
3
  line-height: 48px;
@@ -136,15 +135,20 @@
136
135
 
137
136
  .e-card {
138
137
  border-radius: 6px;
139
- box-sizing: border-box;
138
+ -webkit-box-sizing: border-box;
139
+ box-sizing: border-box;
140
+ display: -webkit-box;
140
141
  display: -ms-flexbox;
141
142
  display: flex;
142
- -ms-flex-direction: column;
143
- flex-direction: column;
143
+ -webkit-box-orient: vertical;
144
+ -webkit-box-direction: normal;
145
+ -ms-flex-direction: column;
146
+ flex-direction: column;
144
147
  font-family: "Inter";
145
148
  font-size: 15px;
146
- -ms-flex-pack: center;
147
- justify-content: center;
149
+ -webkit-box-pack: center;
150
+ -ms-flex-pack: center;
151
+ justify-content: center;
148
152
  line-height: 24px;
149
153
  min-height: 36px;
150
154
  overflow: hidden;
@@ -154,11 +158,13 @@
154
158
  width: 100%;
155
159
  }
156
160
  .e-card > * {
157
- -ms-flex-pack: center;
158
- justify-content: center;
161
+ -webkit-box-pack: center;
162
+ -ms-flex-pack: center;
163
+ justify-content: center;
159
164
  }
160
165
  .e-card > .e-card-header-title {
161
- box-sizing: border-box;
166
+ -webkit-box-sizing: border-box;
167
+ box-sizing: border-box;
162
168
  font-size: 14px;
163
169
  line-height: 1.25;
164
170
  padding: 18px;
@@ -191,22 +197,30 @@
191
197
  font-size: 14px;
192
198
  }
193
199
  .e-card .e-card-stacked {
200
+ display: -webkit-box;
194
201
  display: -ms-flexbox;
195
202
  display: flex;
196
- -ms-flex-direction: column;
197
- flex-direction: column;
198
- -ms-flex-pack: center;
199
- justify-content: center;
203
+ -webkit-box-orient: vertical;
204
+ -webkit-box-direction: normal;
205
+ -ms-flex-direction: column;
206
+ flex-direction: column;
207
+ -webkit-box-pack: center;
208
+ -ms-flex-pack: center;
209
+ justify-content: center;
200
210
  overflow: hidden;
201
211
  }
202
212
  .e-card.e-card-horizontal,
203
213
  .e-card .e-card-horizontal {
214
+ display: -webkit-box;
204
215
  display: -ms-flexbox;
205
216
  display: flex;
206
- -ms-flex-direction: row;
207
- flex-direction: row;
208
- -ms-flex-pack: center;
209
- justify-content: center;
217
+ -webkit-box-orient: horizontal;
218
+ -webkit-box-direction: normal;
219
+ -ms-flex-direction: row;
220
+ flex-direction: row;
221
+ -webkit-box-pack: center;
222
+ -ms-flex-pack: center;
223
+ justify-content: center;
210
224
  }
211
225
  .e-card.e-card-horizontal .e-card-image,
212
226
  .e-card.e-card-horizontal img,
@@ -219,21 +233,27 @@
219
233
  padding: 2px;
220
234
  }
221
235
  .e-card.e-card-horizontal > * {
222
- -ms-flex: 1;
223
- flex: 1;
236
+ -webkit-box-flex: 1;
237
+ -ms-flex: 1;
238
+ flex: 1;
224
239
  }
225
240
  .e-card.e-card-horizontal .e-card-stacked {
241
+ display: -webkit-box;
226
242
  display: -ms-flexbox;
227
243
  display: flex;
228
- -ms-flex: 1;
229
- flex: 1;
230
- -ms-flex-direction: column;
231
- flex-direction: column;
244
+ -webkit-box-flex: 1;
245
+ -ms-flex: 1;
246
+ flex: 1;
247
+ -webkit-box-orient: vertical;
248
+ -webkit-box-direction: normal;
249
+ -ms-flex-direction: column;
250
+ flex-direction: column;
232
251
  overflow: hidden;
233
252
  }
234
253
  .e-card.e-card-horizontal .e-card-stacked > :first-child {
235
- -ms-flex-positive: 1;
236
- flex-grow: 1;
254
+ -webkit-box-flex: 1;
255
+ -ms-flex-positive: 1;
256
+ flex-grow: 1;
237
257
  }
238
258
  .e-card .e-card-separator {
239
259
  display: block;
@@ -242,13 +262,18 @@
242
262
  border-radius: 50%;
243
263
  }
244
264
  .e-card .e-card-header {
245
- box-sizing: border-box;
265
+ -webkit-box-sizing: border-box;
266
+ box-sizing: border-box;
267
+ display: -webkit-box;
246
268
  display: -ms-flexbox;
247
269
  display: flex;
248
- -ms-flex-direction: row;
249
- flex-direction: row;
250
- -ms-flex-pack: center;
251
- justify-content: center;
270
+ -webkit-box-orient: horizontal;
271
+ -webkit-box-direction: normal;
272
+ -ms-flex-direction: row;
273
+ flex-direction: row;
274
+ -webkit-box-pack: center;
275
+ -ms-flex-pack: center;
276
+ justify-content: center;
252
277
  line-height: normal;
253
278
  min-height: 22.5px;
254
279
  padding: 18px 18px 12px 18px;
@@ -259,24 +284,30 @@
259
284
  padding-right: 0;
260
285
  }
261
286
  .e-card .e-card-header .e-card-actions {
262
- -ms-flex-pack: start;
263
- justify-content: flex-start;
287
+ -webkit-box-pack: start;
288
+ -ms-flex-pack: start;
289
+ justify-content: flex-start;
264
290
  }
265
291
  .e-card .e-card-header .e-card-header-image {
266
292
  -ms-flex-item-align: center;
267
293
  align-self: center;
294
+ display: -webkit-box;
268
295
  display: -ms-flexbox;
269
296
  display: flex;
270
297
  }
271
298
  .e-card .e-card-header .e-card-header-caption {
272
299
  -ms-flex-item-align: center;
273
300
  align-self: center;
301
+ display: -webkit-box;
274
302
  display: -ms-flexbox;
275
303
  display: flex;
276
- -ms-flex: 1;
277
- flex: 1;
278
- -ms-flex-direction: column;
279
- flex-direction: column;
304
+ -webkit-box-flex: 1;
305
+ -ms-flex: 1;
306
+ flex: 1;
307
+ -webkit-box-orient: vertical;
308
+ -webkit-box-direction: normal;
309
+ -ms-flex-direction: column;
310
+ flex-direction: column;
280
311
  overflow: hidden;
281
312
  padding: 0 0 0 18px;
282
313
  }
@@ -318,7 +349,8 @@
318
349
  }
319
350
  .e-card .e-card-image .e-card-title {
320
351
  bottom: 0;
321
- box-sizing: border-box;
352
+ -webkit-box-sizing: border-box;
353
+ box-sizing: border-box;
322
354
  font-size: 16px;
323
355
  line-height: 30px;
324
356
  min-height: 30px;
@@ -339,28 +371,34 @@
339
371
  text-align: right;
340
372
  }
341
373
  .e-card .e-card-actions {
342
- box-sizing: border-box;
374
+ -webkit-box-sizing: border-box;
375
+ box-sizing: border-box;
343
376
  display: inline-block;
344
- -ms-flex-pack: start;
345
- justify-content: flex-start;
377
+ -webkit-box-pack: start;
378
+ -ms-flex-pack: start;
379
+ justify-content: flex-start;
346
380
  padding: 18px 18px;
347
381
  }
348
382
  .e-card .e-card-actions.e-card-vertical {
383
+ display: -webkit-box;
349
384
  display: -ms-flexbox;
350
385
  display: flex;
351
- -ms-flex-direction: column;
352
- flex-direction: column;
386
+ -webkit-box-orient: vertical;
387
+ -webkit-box-direction: normal;
388
+ -ms-flex-direction: column;
389
+ flex-direction: column;
353
390
  padding: 18px 18px;
354
391
  }
355
392
  .e-card .e-card-actions.e-card-vertical .e-card-btn,
356
393
  .e-card .e-card-actions.e-card-vertical a {
357
394
  -ms-flex-item-align: initial;
358
- -ms-grid-row-align: initial;
359
395
  align-self: initial;
360
- box-sizing: border-box;
396
+ -webkit-box-sizing: border-box;
397
+ box-sizing: border-box;
361
398
  display: inline-block;
362
- -ms-flex-pack: center;
363
- justify-content: center;
399
+ -webkit-box-pack: center;
400
+ -ms-flex-pack: center;
401
+ justify-content: center;
364
402
  margin: 0 0 6px 0;
365
403
  text-align: center;
366
404
  width: 100%;
@@ -371,11 +409,13 @@
371
409
  }
372
410
  .e-card .e-card-actions button,
373
411
  .e-card .e-card-actions a {
374
- -ms-flex-align: center;
375
- align-items: center;
412
+ -webkit-box-align: center;
413
+ -ms-flex-align: center;
414
+ align-items: center;
376
415
  -ms-flex-item-align: center;
377
416
  align-self: center;
378
417
  cursor: pointer;
418
+ display: -webkit-inline-box;
379
419
  display: -ms-inline-flexbox;
380
420
  display: inline-flex;
381
421
  overflow: hidden;
@@ -384,6 +424,7 @@
384
424
  }
385
425
  .e-card .e-card-actions .e-card-btn span,
386
426
  .e-card .e-card-actions .e-card-btn span.e-icons {
427
+ display: -webkit-box;
387
428
  display: -ms-flexbox;
388
429
  display: flex;
389
430
  font-size: 14px;
@@ -394,10 +435,12 @@
394
435
  .e-card .e-card-actions .e-card-btn span.e-icons::before {
395
436
  -ms-flex-item-align: center;
396
437
  align-self: center;
438
+ display: -webkit-box;
397
439
  display: -ms-flexbox;
398
440
  display: flex;
399
- -ms-flex-pack: center;
400
- justify-content: center;
441
+ -webkit-box-pack: center;
442
+ -ms-flex-pack: center;
443
+ justify-content: center;
401
444
  width: inherit;
402
445
  }
403
446
  .e-card .e-card-actions .e-card-btn > * {
@@ -445,13 +488,13 @@
445
488
  text-overflow: ellipsis;
446
489
  }
447
490
 
448
- /*! card theme */
449
491
  /* stylelint-disable property-no-vendor-prefix */
450
492
  .e-card {
451
493
  -webkit-tap-highlight-color: #22d3ee;
452
494
  background: #1f2937;
453
495
  border: 1px solid #4b5563;
454
- box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
496
+ -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
497
+ box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
455
498
  color: #fff;
456
499
  outline: none;
457
500
  }
@@ -1,4 +1,3 @@
1
- /*! card layout */
2
1
  .e-bigger .e-card,
3
2
  .e-bigger.e-card {
4
3
  line-height: 48px;
@@ -136,15 +135,20 @@
136
135
 
137
136
  .e-card {
138
137
  border-radius: 6px;
139
- box-sizing: border-box;
138
+ -webkit-box-sizing: border-box;
139
+ box-sizing: border-box;
140
+ display: -webkit-box;
140
141
  display: -ms-flexbox;
141
142
  display: flex;
142
- -ms-flex-direction: column;
143
- flex-direction: column;
143
+ -webkit-box-orient: vertical;
144
+ -webkit-box-direction: normal;
145
+ -ms-flex-direction: column;
146
+ flex-direction: column;
144
147
  font-family: "Inter";
145
148
  font-size: 15px;
146
- -ms-flex-pack: center;
147
- justify-content: center;
149
+ -webkit-box-pack: center;
150
+ -ms-flex-pack: center;
151
+ justify-content: center;
148
152
  line-height: 24px;
149
153
  min-height: 36px;
150
154
  overflow: hidden;
@@ -154,11 +158,13 @@
154
158
  width: 100%;
155
159
  }
156
160
  .e-card > * {
157
- -ms-flex-pack: center;
158
- justify-content: center;
161
+ -webkit-box-pack: center;
162
+ -ms-flex-pack: center;
163
+ justify-content: center;
159
164
  }
160
165
  .e-card > .e-card-header-title {
161
- box-sizing: border-box;
166
+ -webkit-box-sizing: border-box;
167
+ box-sizing: border-box;
162
168
  font-size: 14px;
163
169
  line-height: 1.25;
164
170
  padding: 18px;
@@ -191,22 +197,30 @@
191
197
  font-size: 14px;
192
198
  }
193
199
  .e-card .e-card-stacked {
200
+ display: -webkit-box;
194
201
  display: -ms-flexbox;
195
202
  display: flex;
196
- -ms-flex-direction: column;
197
- flex-direction: column;
198
- -ms-flex-pack: center;
199
- justify-content: center;
203
+ -webkit-box-orient: vertical;
204
+ -webkit-box-direction: normal;
205
+ -ms-flex-direction: column;
206
+ flex-direction: column;
207
+ -webkit-box-pack: center;
208
+ -ms-flex-pack: center;
209
+ justify-content: center;
200
210
  overflow: hidden;
201
211
  }
202
212
  .e-card.e-card-horizontal,
203
213
  .e-card .e-card-horizontal {
214
+ display: -webkit-box;
204
215
  display: -ms-flexbox;
205
216
  display: flex;
206
- -ms-flex-direction: row;
207
- flex-direction: row;
208
- -ms-flex-pack: center;
209
- justify-content: center;
217
+ -webkit-box-orient: horizontal;
218
+ -webkit-box-direction: normal;
219
+ -ms-flex-direction: row;
220
+ flex-direction: row;
221
+ -webkit-box-pack: center;
222
+ -ms-flex-pack: center;
223
+ justify-content: center;
210
224
  }
211
225
  .e-card.e-card-horizontal .e-card-image,
212
226
  .e-card.e-card-horizontal img,
@@ -219,21 +233,27 @@
219
233
  padding: 2px;
220
234
  }
221
235
  .e-card.e-card-horizontal > * {
222
- -ms-flex: 1;
223
- flex: 1;
236
+ -webkit-box-flex: 1;
237
+ -ms-flex: 1;
238
+ flex: 1;
224
239
  }
225
240
  .e-card.e-card-horizontal .e-card-stacked {
241
+ display: -webkit-box;
226
242
  display: -ms-flexbox;
227
243
  display: flex;
228
- -ms-flex: 1;
229
- flex: 1;
230
- -ms-flex-direction: column;
231
- flex-direction: column;
244
+ -webkit-box-flex: 1;
245
+ -ms-flex: 1;
246
+ flex: 1;
247
+ -webkit-box-orient: vertical;
248
+ -webkit-box-direction: normal;
249
+ -ms-flex-direction: column;
250
+ flex-direction: column;
232
251
  overflow: hidden;
233
252
  }
234
253
  .e-card.e-card-horizontal .e-card-stacked > :first-child {
235
- -ms-flex-positive: 1;
236
- flex-grow: 1;
254
+ -webkit-box-flex: 1;
255
+ -ms-flex-positive: 1;
256
+ flex-grow: 1;
237
257
  }
238
258
  .e-card .e-card-separator {
239
259
  display: block;
@@ -242,13 +262,18 @@
242
262
  border-radius: 50%;
243
263
  }
244
264
  .e-card .e-card-header {
245
- box-sizing: border-box;
265
+ -webkit-box-sizing: border-box;
266
+ box-sizing: border-box;
267
+ display: -webkit-box;
246
268
  display: -ms-flexbox;
247
269
  display: flex;
248
- -ms-flex-direction: row;
249
- flex-direction: row;
250
- -ms-flex-pack: center;
251
- justify-content: center;
270
+ -webkit-box-orient: horizontal;
271
+ -webkit-box-direction: normal;
272
+ -ms-flex-direction: row;
273
+ flex-direction: row;
274
+ -webkit-box-pack: center;
275
+ -ms-flex-pack: center;
276
+ justify-content: center;
252
277
  line-height: normal;
253
278
  min-height: 22.5px;
254
279
  padding: 18px 18px 12px 18px;
@@ -259,24 +284,30 @@
259
284
  padding-right: 0;
260
285
  }
261
286
  .e-card .e-card-header .e-card-actions {
262
- -ms-flex-pack: start;
263
- justify-content: flex-start;
287
+ -webkit-box-pack: start;
288
+ -ms-flex-pack: start;
289
+ justify-content: flex-start;
264
290
  }
265
291
  .e-card .e-card-header .e-card-header-image {
266
292
  -ms-flex-item-align: center;
267
293
  align-self: center;
294
+ display: -webkit-box;
268
295
  display: -ms-flexbox;
269
296
  display: flex;
270
297
  }
271
298
  .e-card .e-card-header .e-card-header-caption {
272
299
  -ms-flex-item-align: center;
273
300
  align-self: center;
301
+ display: -webkit-box;
274
302
  display: -ms-flexbox;
275
303
  display: flex;
276
- -ms-flex: 1;
277
- flex: 1;
278
- -ms-flex-direction: column;
279
- flex-direction: column;
304
+ -webkit-box-flex: 1;
305
+ -ms-flex: 1;
306
+ flex: 1;
307
+ -webkit-box-orient: vertical;
308
+ -webkit-box-direction: normal;
309
+ -ms-flex-direction: column;
310
+ flex-direction: column;
280
311
  overflow: hidden;
281
312
  padding: 0 0 0 18px;
282
313
  }
@@ -318,7 +349,8 @@
318
349
  }
319
350
  .e-card .e-card-image .e-card-title {
320
351
  bottom: 0;
321
- box-sizing: border-box;
352
+ -webkit-box-sizing: border-box;
353
+ box-sizing: border-box;
322
354
  font-size: 16px;
323
355
  line-height: 30px;
324
356
  min-height: 30px;
@@ -339,28 +371,34 @@
339
371
  text-align: right;
340
372
  }
341
373
  .e-card .e-card-actions {
342
- box-sizing: border-box;
374
+ -webkit-box-sizing: border-box;
375
+ box-sizing: border-box;
343
376
  display: inline-block;
344
- -ms-flex-pack: start;
345
- justify-content: flex-start;
377
+ -webkit-box-pack: start;
378
+ -ms-flex-pack: start;
379
+ justify-content: flex-start;
346
380
  padding: 18px 18px;
347
381
  }
348
382
  .e-card .e-card-actions.e-card-vertical {
383
+ display: -webkit-box;
349
384
  display: -ms-flexbox;
350
385
  display: flex;
351
- -ms-flex-direction: column;
352
- flex-direction: column;
386
+ -webkit-box-orient: vertical;
387
+ -webkit-box-direction: normal;
388
+ -ms-flex-direction: column;
389
+ flex-direction: column;
353
390
  padding: 18px 18px;
354
391
  }
355
392
  .e-card .e-card-actions.e-card-vertical .e-card-btn,
356
393
  .e-card .e-card-actions.e-card-vertical a {
357
394
  -ms-flex-item-align: initial;
358
- -ms-grid-row-align: initial;
359
395
  align-self: initial;
360
- box-sizing: border-box;
396
+ -webkit-box-sizing: border-box;
397
+ box-sizing: border-box;
361
398
  display: inline-block;
362
- -ms-flex-pack: center;
363
- justify-content: center;
399
+ -webkit-box-pack: center;
400
+ -ms-flex-pack: center;
401
+ justify-content: center;
364
402
  margin: 0 0 6px 0;
365
403
  text-align: center;
366
404
  width: 100%;
@@ -371,11 +409,13 @@
371
409
  }
372
410
  .e-card .e-card-actions button,
373
411
  .e-card .e-card-actions a {
374
- -ms-flex-align: center;
375
- align-items: center;
412
+ -webkit-box-align: center;
413
+ -ms-flex-align: center;
414
+ align-items: center;
376
415
  -ms-flex-item-align: center;
377
416
  align-self: center;
378
417
  cursor: pointer;
418
+ display: -webkit-inline-box;
379
419
  display: -ms-inline-flexbox;
380
420
  display: inline-flex;
381
421
  overflow: hidden;
@@ -384,6 +424,7 @@
384
424
  }
385
425
  .e-card .e-card-actions .e-card-btn span,
386
426
  .e-card .e-card-actions .e-card-btn span.e-icons {
427
+ display: -webkit-box;
387
428
  display: -ms-flexbox;
388
429
  display: flex;
389
430
  font-size: 14px;
@@ -394,10 +435,12 @@
394
435
  .e-card .e-card-actions .e-card-btn span.e-icons::before {
395
436
  -ms-flex-item-align: center;
396
437
  align-self: center;
438
+ display: -webkit-box;
397
439
  display: -ms-flexbox;
398
440
  display: flex;
399
- -ms-flex-pack: center;
400
- justify-content: center;
441
+ -webkit-box-pack: center;
442
+ -ms-flex-pack: center;
443
+ justify-content: center;
401
444
  width: inherit;
402
445
  }
403
446
  .e-card .e-card-actions .e-card-btn > * {
@@ -445,13 +488,13 @@
445
488
  text-overflow: ellipsis;
446
489
  }
447
490
 
448
- /*! card theme */
449
491
  /* stylelint-disable property-no-vendor-prefix */
450
492
  .e-card {
451
493
  -webkit-tap-highlight-color: #4f46e5;
452
494
  background: #fff;
453
495
  border: 1px solid #e5e7eb;
454
- box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
496
+ -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
497
+ box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
455
498
  color: #111827;
456
499
  outline: none;
457
500
  }
@@ -0,0 +1,108 @@
1
+ /*! component's theme wise override tailwind-definitions and variables */
2
+
3
+ // Generic
4
+ $icon-zero: 0 !default;
5
+ $icon-border-radius: 50% !default;
6
+ $grid-layout-position: relative !default;
7
+ $panel-position: absolute !default;
8
+ $panel-box-sizing: border-box !default;
9
+
10
+ // Header styles
11
+
12
+ // Mouse
13
+ $panel-header-height: 38px !default;
14
+ $panel-header-padding: 8px 18px !default;
15
+ $panel-header-line-height: 22px !default;
16
+ $panel-header-border-radius: 4px !default;
17
+ $panel-header-color: $content-text-color !default;
18
+ $panel-header-font-size: $text-sm !default;
19
+ $panel-header-bg-color: $content-bg-color-alt1 !default;
20
+ $panel-header-font-weight: $font-weight-medium !default;
21
+ $panel-header-border-bottom: 1px solid $border-light !default;
22
+ $panel-header-font-family: $font-family !default;
23
+ $panel-header-white-space: nowrap !default;
24
+ $panel-header-overflow: hidden !default;
25
+ $panel-header-text-overflow: ellipsis !default;
26
+
27
+ // Touch
28
+ $panel-bigger-header-height: 40px !default;
29
+ $panel-bigger-header-padding: 8px 18px !default;
30
+ $panel-bigger-header-line-height: 24px !default;
31
+ $panel-bigger-header-color: $content-text-color !default;
32
+ $panel-bigger-header-font-size: $text-base !default;
33
+ $panel-bigger-header-font-weight: $font-weight-medium !default;
34
+
35
+ // Panel styles
36
+ $panel-border: 1px solid $border-light !default;
37
+ $panel-border-radius: 4px !default;
38
+ $panel-full-height: 100% !default;
39
+ $panel-full-width: 100% !default;
40
+ $panel-hover-border: 1px solid $border-dark !default;
41
+ $panel-active-border: 1px solid $primary-border-color !default;
42
+
43
+ // icons styles
44
+ $panel-resize-one-dimensional-icon-height: 8px !default;
45
+ $panel-resize-one-dimensional-icon-width: 8px !default;
46
+ $panel-resize-one-dimensional-icon-background: none !default;
47
+ $panel-resize-one-dimensional-icon-border: none !default;
48
+ $panel-resize-one-dimensional-icon-shadow: none !default;
49
+
50
+ $panel-resize-two-dimensional-icon-height: 8px !default;
51
+ $panel-resize-two-dimensional-icon-width: 8px !default;
52
+ $panel-resize-two-dimensional-inner-icon-height: 8px !default;
53
+ $panel-resize-two-dimensional-inner-icon-width: 8px !default;
54
+ $panel-resize-two-dimensional-icon-background: none !default;
55
+ $panel-resize-two-dimensional-icon-color: $icon-color-disabled !default;
56
+ $panel-resize-two-dimensional-icon-border: none !default;
57
+ $panel-resize-two-dimensional-icon-shadow: none !default;
58
+
59
+ // south-east-icon-styles
60
+ $panel-south-east-icon-right: 2px !default;
61
+ $panel-south-east-icon-bottom: 2px !default;
62
+
63
+ // south-west-icon-style
64
+ $panel-south-west-icon-left: 2px !default;
65
+ $panel-south-west-icon-bottom: 2px !default;
66
+
67
+ // north-east-icon-styles
68
+ $panel-north-east-icon-right: 2px !default;
69
+ $panel-north-east-icon-top: 2px !default;
70
+
71
+ // north-west-icon-styles
72
+ $panel-north-west-icon-left: 2px !default;
73
+ $panel-north-west-icon-top: 2px !default;
74
+
75
+ // droppable area border
76
+ $panel-drop-border-radius: 4px !default;
77
+
78
+ // dragging element style
79
+ $panel-dragging-cursor: move !default;
80
+ $panel-drag-prevent: none !default;
81
+
82
+ // Blazor ContentTemplate styles
83
+ $panel-content-template-height: inherit !default;
84
+ $panel-content-template-width: inherit !default;
85
+
86
+ /* stylelint-disable */
87
+ $panel-dragging-zindex: 1111 !important !default;
88
+ $panel-drag-prevent: none !default;
89
+
90
+ $element-width-complete: 100% !important !default;
91
+
92
+ // colors
93
+
94
+ // Panel styles
95
+ $panel-active-background: $flyout-bg-color !default;
96
+ $panel-hover-box-shadow: $shadow !default;
97
+ $panel-active-drag-box-shadow: $shadow !default;
98
+ $panel-background: $flyout-bg-color !default;
99
+ $panel-box-shadow: $shadow-sm;
100
+
101
+ // droppable area border
102
+ $panel-drop-background: $primary-lighter !default;
103
+ $panel-drop-border: 1px $primary-border-color dashed !default;
104
+
105
+ //gridlines
106
+ $gridline-background: $content-bg-color-alt1 !default;
107
+ $gridline-border: $border-dark !default;
108
+ $gridline-border-radius: 6px !default;