@syncfusion/ej2-vue-layouts 19.2.48 → 19.3.44

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 (61) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/ej2-vue-layouts.umd.min.js +20 -2
  3. package/dist/ej2-vue-layouts.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-vue-layouts.es2015.js +49 -1
  5. package/dist/es6/ej2-vue-layouts.es2015.js.map +1 -1
  6. package/dist/es6/ej2-vue-layouts.es5.js +53 -1
  7. package/dist/es6/ej2-vue-layouts.es5.js.map +1 -1
  8. package/dist/global/ej2-vue-layouts.min.js +2 -2
  9. package/package.json +8 -8
  10. package/src/dashboard-layout/dashboardlayout.component.d.ts +2 -0
  11. package/src/dashboard-layout/dashboardlayout.component.js +27 -1
  12. package/src/splitter/splitter.component.d.ts +2 -0
  13. package/src/splitter/splitter.component.js +27 -1
  14. package/styles/avatar/bootstrap5-dark.css +61 -0
  15. package/styles/avatar/bootstrap5-dark.scss +1 -0
  16. package/styles/avatar/bootstrap5.css +61 -0
  17. package/styles/avatar/bootstrap5.scss +1 -0
  18. package/styles/bootstrap-dark.css +8 -0
  19. package/styles/bootstrap.css +8 -0
  20. package/styles/bootstrap4.css +8 -0
  21. package/styles/bootstrap5-dark.css +1618 -0
  22. package/styles/bootstrap5-dark.scss +4 -0
  23. package/styles/bootstrap5.css +1618 -0
  24. package/styles/bootstrap5.scss +4 -0
  25. package/styles/card/bootstrap5-dark.css +593 -0
  26. package/styles/card/bootstrap5-dark.scss +1 -0
  27. package/styles/card/bootstrap5.css +593 -0
  28. package/styles/card/bootstrap5.scss +1 -0
  29. package/styles/card/fabric-dark.css +12 -12
  30. package/styles/card/tailwind-dark.css +2 -3
  31. package/styles/card/tailwind.css +0 -1
  32. package/styles/dashboard-layout/bootstrap5-dark.css +393 -0
  33. package/styles/dashboard-layout/bootstrap5-dark.scss +1 -0
  34. package/styles/dashboard-layout/bootstrap5.css +393 -0
  35. package/styles/dashboard-layout/bootstrap5.scss +1 -0
  36. package/styles/dashboard-layout/material-dark.css +3 -3
  37. package/styles/dashboard-layout/tailwind-dark.css +10 -8
  38. package/styles/dashboard-layout/tailwind.css +5 -3
  39. package/styles/fabric-dark.css +20 -12
  40. package/styles/fabric.css +8 -0
  41. package/styles/highcontrast-light.css +8 -0
  42. package/styles/highcontrast.css +8 -0
  43. package/styles/material-dark.css +19 -11
  44. package/styles/material.css +8 -0
  45. package/styles/splitter/bootstrap-dark.css +8 -0
  46. package/styles/splitter/bootstrap.css +8 -0
  47. package/styles/splitter/bootstrap4.css +8 -0
  48. package/styles/splitter/bootstrap5-dark.css +568 -0
  49. package/styles/splitter/bootstrap5-dark.scss +1 -0
  50. package/styles/splitter/bootstrap5.css +568 -0
  51. package/styles/splitter/bootstrap5.scss +1 -0
  52. package/styles/splitter/fabric-dark.css +8 -0
  53. package/styles/splitter/fabric.css +8 -0
  54. package/styles/splitter/highcontrast-light.css +8 -0
  55. package/styles/splitter/highcontrast.css +8 -0
  56. package/styles/splitter/material-dark.css +16 -8
  57. package/styles/splitter/material.css +8 -0
  58. package/styles/splitter/tailwind-dark.css +14 -7
  59. package/styles/splitter/tailwind.css +8 -1
  60. package/styles/tailwind-dark.css +26 -18
  61. package/styles/tailwind.css +13 -5
@@ -0,0 +1,393 @@
1
+ /*! component's theme wise override tailwind-definitions and variables */
2
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east,
3
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east {
4
+ height: 100%;
5
+ padding: 20px 0;
6
+ right: 1px;
7
+ top: 0;
8
+ width: 12px;
9
+ }
10
+
11
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-west,
12
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west {
13
+ height: 100%;
14
+ left: 0;
15
+ padding: 20px 0;
16
+ top: 0;
17
+ width: 12px;
18
+ }
19
+
20
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north,
21
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north {
22
+ height: 12px;
23
+ padding: 0 20px;
24
+ top: 1px;
25
+ width: 100%;
26
+ }
27
+
28
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south,
29
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south {
30
+ bottom: 1px;
31
+ height: 12px;
32
+ padding: 0 20px;
33
+ width: 100%;
34
+ }
35
+
36
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east,
37
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east {
38
+ bottom: 0;
39
+ right: 1px;
40
+ z-index: 10;
41
+ }
42
+
43
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-west,
44
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-west {
45
+ left: 2px;
46
+ top: 2px;
47
+ z-index: 10;
48
+ }
49
+
50
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-east,
51
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-east {
52
+ right: 2px;
53
+ top: 2px;
54
+ z-index: 10;
55
+ }
56
+
57
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west,
58
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west {
59
+ bottom: 1px;
60
+ left: 1px;
61
+ z-index: 10;
62
+ }
63
+
64
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east::before,
65
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east::before {
66
+ bottom: 4px;
67
+ content: '\e761';
68
+ font-size: 12px;
69
+ position: absolute;
70
+ right: 4px;
71
+ }
72
+
73
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west::before,
74
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west::before {
75
+ bottom: 4px;
76
+ content: '\e761';
77
+ font-size: 12px;
78
+ left: 4px;
79
+ position: absolute;
80
+ transform: rotateY(180deg);
81
+ }
82
+
83
+ .e-dashboardlayout.e-control .e-dashboard-gridline-table {
84
+ background: #282d31;
85
+ border-collapse: collapse;
86
+ height: 100%;
87
+ width: 100%;
88
+ }
89
+
90
+ .e-dashboardlayout.e-control .e-dashboard-gridline-table tbody tr td.e-dashboard-gridline {
91
+ border: 1px dashed #adb5bd;
92
+ border-radius: 6px;
93
+ position: absolute;
94
+ }
95
+
96
+ .e-dashboardlayout.e-control.e-responsive {
97
+ width: 100% !important;
98
+ }
99
+
100
+ .e-dashboardlayout.e-control.e-prevent {
101
+ -webkit-user-select: none;
102
+ -ms-user-select: none;
103
+ user-select: none;
104
+ }
105
+
106
+ .e-dashboardlayout.e-control .e-panel {
107
+ border-radius: 4px;
108
+ }
109
+
110
+ .e-dashboardlayout.e-control .e-panel:hover {
111
+ border: 1px solid #adb5bd;
112
+ box-shadow: 0 0.8px 16px rgba(0, 0, 0, 0.15);
113
+ }
114
+
115
+ .e-dashboardlayout.e-control .e-panel:hover .e-panel-container .e-resize.e-dl-icon {
116
+ display: block;
117
+ }
118
+
119
+ .e-dashboardlayout.e-control .e-panel:active {
120
+ border: 1px solid #0d6efd;
121
+ }
122
+
123
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-dl-icon {
124
+ display: none;
125
+ }
126
+
127
+ .e-dashboardlayout.e-control .e-panel.e-panel-transition {
128
+ transition: top .5s, left .5s;
129
+ }
130
+
131
+ .e-dashboardlayout.e-control .e-panel .e-panel-header {
132
+ border-bottom: none;
133
+ color: #fff;
134
+ font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
135
+ font-size: 14px;
136
+ font-weight: 500;
137
+ height: 38px;
138
+ padding: 8px 18px;
139
+ border-top-left-radius: 4px;
140
+ border-top-right-radius: 4px;
141
+ }
142
+
143
+ .e-dashboardlayout.e-control .e-panel .e-panel-header div {
144
+ overflow: hidden;
145
+ text-overflow: ellipsis;
146
+ white-space: nowrap;
147
+ }
148
+
149
+ .e-dashboardlayout.e-control .e-panel .e-panel-header .e-header-content {
150
+ display: inline-block;
151
+ }
152
+
153
+ .e-dashboardlayout.e-control .e-panel .e-panel-header .e-header-template {
154
+ float: right;
155
+ }
156
+
157
+ .e-dashboardlayout.e-control .e-panel .e-panel-container {
158
+ height: 100%;
159
+ width: 100%;
160
+ }
161
+
162
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-content .e-blazor-template {
163
+ height: inherit;
164
+ width: inherit;
165
+ }
166
+
167
+ .e-dashboardlayout.e-control .e-panel {
168
+ border: 1px solid #444c54;
169
+ height: 100%;
170
+ -webkit-user-select: none;
171
+ -ms-user-select: none;
172
+ user-select: none;
173
+ width: 100%;
174
+ }
175
+
176
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single,
177
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double {
178
+ position: absolute;
179
+ -ms-touch-action: none;
180
+ touch-action: none;
181
+ }
182
+
183
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north, .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south,
184
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east,
185
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west,
186
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north,
187
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south {
188
+ border: none;
189
+ }
190
+
191
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east:hover,
192
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east:hover {
193
+ cursor: e-resize;
194
+ }
195
+
196
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-west:hover,
197
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west:hover {
198
+ cursor: w-resize;
199
+ }
200
+
201
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north:hover,
202
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north:hover {
203
+ cursor: n-resize;
204
+ }
205
+
206
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south:hover,
207
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south:hover {
208
+ cursor: s-resize;
209
+ }
210
+
211
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-west:hover,
212
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-west:hover {
213
+ cursor: nw-resize;
214
+ }
215
+
216
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-east:hover,
217
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-east:hover {
218
+ cursor: ne-resize;
219
+ }
220
+
221
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west:hover,
222
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west:hover {
223
+ cursor: sw-resize;
224
+ }
225
+
226
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east:hover,
227
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east:hover {
228
+ cursor: se-resize;
229
+ }
230
+
231
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-single::before,
232
+ .e-dashboardlayout.e-control .e-panel .e-resize.e-double::before {
233
+ font-family: 'e-icons';
234
+ position: absolute;
235
+ }
236
+
237
+ .e-dashboardlayout.e-control .e-drag:hover {
238
+ cursor: move;
239
+ }
240
+
241
+ .e-dashboardlayout.e-control .e-drag-restrict.e-drag:hover,
242
+ .e-dashboardlayout.e-control .e-drag-restrict .e-drag:hover {
243
+ cursor: default;
244
+ }
245
+
246
+ .e-dashboardlayout.e-control .e-panel.e-dragging,
247
+ .e-dashboardlayout.e-control .e-panel.e-item-moving {
248
+ cursor: move;
249
+ z-index: 1111 !important;
250
+ }
251
+
252
+ .e-dashboardlayout.e-control .e-panel.e-rtl .e-panel-header .e-header-template {
253
+ float: left;
254
+ }
255
+
256
+ .e-dashboardlayout.e-control .e-holder {
257
+ background: #031633;
258
+ border: 1px #0d6efd dashed;
259
+ border-radius: 4px;
260
+ position: absolute;
261
+ border-radius: 4px;
262
+ }
263
+
264
+ .e-dashboardlayout.e-control .e-holder.e-holder-transition {
265
+ transition: top .3s, left .3s;
266
+ }
267
+
268
+ .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
269
+ font-size: 16px;
270
+ font-weight: 500;
271
+ height: 40px;
272
+ padding: 8px 18px;
273
+ }
274
+
275
+ .e-bigger .e-dashboardlayout.e-control .e-panel .e-panel-header {
276
+ font-size: 16px;
277
+ font-weight: 500;
278
+ height: 40px;
279
+ padding: 8px 18px;
280
+ }
281
+
282
+ .e-content-placeholder.e-dashboardlayout.e-placeholder-dashboardlayout {
283
+ height: 100%;
284
+ width: 100%;
285
+ }
286
+
287
+ .e-dashboardlayout.e-control {
288
+ display: block;
289
+ position: relative;
290
+ }
291
+
292
+ .e-dashboardlayout.e-control .e-panel {
293
+ background: #343a40;
294
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.075);
295
+ box-sizing: border-box;
296
+ position: absolute;
297
+ }
298
+
299
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
300
+ color: #fff;
301
+ background: #282d31;
302
+ box-sizing: border-box;
303
+ }
304
+
305
+ .e-dashboardlayout.e-control .e-panel {
306
+ background: #343a40;
307
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.075);
308
+ box-sizing: border-box;
309
+ position: absolute;
310
+ }
311
+
312
+ .e-dashboardlayout.e-control .e-panel:active {
313
+ background: #343a40;
314
+ }
315
+
316
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
317
+ color: #fff;
318
+ }
319
+
320
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-single {
321
+ background: none;
322
+ }
323
+
324
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double {
325
+ color: #adb5bd;
326
+ font-size: 8px;
327
+ height: 8px;
328
+ width: 8px;
329
+ }
330
+
331
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-double {
332
+ bottom: 2px;
333
+ right: 2px;
334
+ }
335
+
336
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-double {
337
+ bottom: 2px;
338
+ left: 2px;
339
+ }
340
+
341
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-double {
342
+ left: 2px;
343
+ top: 2px;
344
+ }
345
+
346
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-double {
347
+ right: 2px;
348
+ top: 2px;
349
+ }
350
+
351
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-shrink {
352
+ right: 2px;
353
+ top: 2px;
354
+ }
355
+
356
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-shrink {
357
+ left: 2px;
358
+ top: 2px;
359
+ }
360
+
361
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-shrink {
362
+ bottom: 2px;
363
+ left: 2px;
364
+ }
365
+
366
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-shrink {
367
+ bottom: 2px;
368
+ right: 2px;
369
+ }
370
+
371
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-expand {
372
+ right: 2px;
373
+ top: 2px;
374
+ }
375
+
376
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-expand {
377
+ left: 2px;
378
+ top: 2px;
379
+ }
380
+
381
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-expand {
382
+ bottom: 2px;
383
+ left: 2px;
384
+ }
385
+
386
+ .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-expand {
387
+ bottom: 2px;
388
+ right: 2px;
389
+ }
390
+
391
+ .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
392
+ color: #fff;
393
+ }
@@ -0,0 +1 @@
1
+ @import 'ej2-layouts/styles/dashboard-layout/bootstrap5-dark.scss';