@syncfusion/ej2-react-layouts 23.2.4 → 24.1.41

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 (88) hide show
  1. package/dist/ej2-react-layouts.min.js +1 -1
  2. package/dist/ej2-react-layouts.umd.min.js +1 -1
  3. package/package.json +9 -9
  4. package/styles/avatar/bootstrap-dark.css +1 -45
  5. package/styles/avatar/bootstrap.css +1 -45
  6. package/styles/avatar/bootstrap4.css +1 -45
  7. package/styles/avatar/bootstrap5-dark.css +1 -60
  8. package/styles/avatar/bootstrap5.css +1 -60
  9. package/styles/avatar/fabric-dark.css +1 -45
  10. package/styles/avatar/fabric.css +1 -45
  11. package/styles/avatar/fluent-dark.css +1 -58
  12. package/styles/avatar/fluent.css +1 -58
  13. package/styles/avatar/highcontrast-light.css +1 -45
  14. package/styles/avatar/highcontrast.css +1 -45
  15. package/styles/avatar/material-dark.css +1 -45
  16. package/styles/avatar/material.css +1 -45
  17. package/styles/avatar/material3-dark.css +1 -113
  18. package/styles/avatar/material3.css +1 -169
  19. package/styles/avatar/tailwind-dark.css +1 -58
  20. package/styles/avatar/tailwind.css +1 -58
  21. package/styles/bootstrap-dark.css +1 -1351
  22. package/styles/bootstrap.css +1 -1352
  23. package/styles/bootstrap4.css +1 -1357
  24. package/styles/bootstrap5-dark.css +1 -1368
  25. package/styles/bootstrap5.css +1 -1368
  26. package/styles/card/bootstrap-dark.css +1 -513
  27. package/styles/card/bootstrap.css +1 -514
  28. package/styles/card/bootstrap4.css +1 -520
  29. package/styles/card/bootstrap5-dark.css +1 -513
  30. package/styles/card/bootstrap5.css +1 -513
  31. package/styles/card/fabric-dark.css +1 -513
  32. package/styles/card/fabric.css +1 -524
  33. package/styles/card/fluent-dark.css +1 -534
  34. package/styles/card/fluent.css +1 -534
  35. package/styles/card/highcontrast-light.css +1 -513
  36. package/styles/card/highcontrast.css +1 -525
  37. package/styles/card/material-dark.css +1 -513
  38. package/styles/card/material.css +1 -513
  39. package/styles/card/material3-dark.css +1 -566
  40. package/styles/card/material3.css +1 -622
  41. package/styles/card/tailwind-dark.css +1 -514
  42. package/styles/card/tailwind.css +1 -514
  43. package/styles/dashboard-layout/bootstrap-dark.css +1 -296
  44. package/styles/dashboard-layout/bootstrap.css +1 -296
  45. package/styles/dashboard-layout/bootstrap4.css +1 -296
  46. package/styles/dashboard-layout/bootstrap5-dark.css +1 -305
  47. package/styles/dashboard-layout/bootstrap5.css +1 -305
  48. package/styles/dashboard-layout/fabric-dark.css +1 -296
  49. package/styles/dashboard-layout/fabric.css +1 -296
  50. package/styles/dashboard-layout/fluent-dark.css +1 -300
  51. package/styles/dashboard-layout/fluent.css +1 -300
  52. package/styles/dashboard-layout/highcontrast-light.css +1 -234
  53. package/styles/dashboard-layout/highcontrast.css +1 -292
  54. package/styles/dashboard-layout/material-dark.css +1 -296
  55. package/styles/dashboard-layout/material.css +1 -296
  56. package/styles/dashboard-layout/material3-dark.css +1 -356
  57. package/styles/dashboard-layout/material3.css +1 -412
  58. package/styles/dashboard-layout/tailwind-dark.css +1 -317
  59. package/styles/dashboard-layout/tailwind.css +1 -317
  60. package/styles/fabric-dark.css +1 -1351
  61. package/styles/fabric.css +1 -1362
  62. package/styles/fluent-dark.css +1 -1382
  63. package/styles/fluent.css +1 -1382
  64. package/styles/highcontrast-light.css +1 -1289
  65. package/styles/highcontrast.css +1 -1359
  66. package/styles/material-dark.css +1 -1350
  67. package/styles/material.css +1 -1351
  68. package/styles/material3-dark.css +1 -1581
  69. package/styles/material3.css +1 -1805
  70. package/styles/splitter/bootstrap-dark.css +1 -496
  71. package/styles/splitter/bootstrap.css +1 -496
  72. package/styles/splitter/bootstrap4.css +1 -495
  73. package/styles/splitter/bootstrap5-dark.css +1 -489
  74. package/styles/splitter/bootstrap5.css +1 -489
  75. package/styles/splitter/fabric-dark.css +1 -496
  76. package/styles/splitter/fabric.css +1 -496
  77. package/styles/splitter/fluent-dark.css +1 -489
  78. package/styles/splitter/fluent.css +1 -489
  79. package/styles/splitter/highcontrast-light.css +1 -496
  80. package/styles/splitter/highcontrast.css +1 -496
  81. package/styles/splitter/material-dark.css +1 -495
  82. package/styles/splitter/material.css +1 -496
  83. package/styles/splitter/material3-dark.css +1 -544
  84. package/styles/splitter/material3.css +1 -600
  85. package/styles/splitter/tailwind-dark.css +1 -489
  86. package/styles/splitter/tailwind.css +1 -489
  87. package/styles/tailwind-dark.css +1 -1379
  88. package/styles/tailwind.css +1 -1379
@@ -1,296 +1 @@
1
- /*! component's theme wise override material-definitions and variables */
2
- /* stylelint-disable */
3
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east, .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
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west {
11
- height: 100%;
12
- left: 0;
13
- padding: 20px 0;
14
- top: 0;
15
- width: 12px;
16
- }
17
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north {
18
- height: 12px;
19
- padding: 0 20px;
20
- top: 1px;
21
- width: 100%;
22
- }
23
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south {
24
- bottom: 1px;
25
- height: 12px;
26
- padding: 0 20px;
27
- width: 100%;
28
- }
29
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east {
30
- bottom: 0;
31
- right: 1px;
32
- z-index: 10;
33
- }
34
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-west {
35
- left: 2px;
36
- top: 2px;
37
- z-index: 10;
38
- }
39
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-east {
40
- right: 2px;
41
- top: 2px;
42
- z-index: 10;
43
- }
44
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west {
45
- bottom: 1px;
46
- left: 1px;
47
- z-index: 10;
48
- }
49
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east::before, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east::before {
50
- bottom: 0;
51
- content: "\eb05";
52
- font-size: 12px;
53
- position: absolute;
54
- right: 0;
55
- }
56
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west::before, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west::before {
57
- bottom: 0;
58
- content: "\eb05";
59
- font-size: 12px;
60
- left: 0;
61
- position: absolute;
62
- transform: rotateY(180deg);
63
- }
64
-
65
- .e-dashboardlayout.e-control .e-dashboard-gridline-table {
66
- background: #f5f5f5;
67
- border-collapse: collapse;
68
- height: 100%;
69
- width: 100%;
70
- }
71
- .e-dashboardlayout.e-control .e-dashboard-gridline-table tbody tr td.e-dashboard-gridline {
72
- border: 1px dotted #bdbdbd;
73
- position: absolute;
74
- }
75
- .e-dashboardlayout.e-control.e-responsive {
76
- width: 100% !important;
77
- }
78
- .e-dashboardlayout.e-control.e-prevent {
79
- -webkit-user-select: none;
80
- -ms-user-select: none;
81
- user-select: none;
82
- }
83
- .e-dashboardlayout.e-control .e-panel {
84
- border-radius: 2px;
85
- }
86
- .e-dashboardlayout.e-control .e-panel:hover {
87
- border: 1px #bdbdbd solid;
88
- }
89
- .e-dashboardlayout.e-control .e-panel:hover .e-panel-container .e-resize.e-dl-icon {
90
- display: block;
91
- }
92
- .e-dashboardlayout.e-control .e-panel:active {
93
- border: 1px #3f51b5 solid;
94
- }
95
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-dl-icon {
96
- display: none;
97
- }
98
- .e-dashboardlayout.e-control .e-panel.e-panel-transition {
99
- transition: top 0.5s, left 0.5s;
100
- }
101
- .e-dashboardlayout.e-control .e-panel .e-panel-header {
102
- border-bottom: none;
103
- color: rgba(0, 0, 0, 0.54);
104
- font-family: "Roboto", "Segoe UI", "GeezaPro", "DejaVu Serif", "sans-serif", "-apple-system", "BlinkMacSystemFont";
105
- font-size: 14px;
106
- font-weight: 500;
107
- height: 28px;
108
- padding: 2px 12px;
109
- }
110
- .e-dashboardlayout.e-control .e-panel .e-panel-header div {
111
- overflow: hidden;
112
- text-overflow: ellipsis;
113
- white-space: nowrap;
114
- }
115
- .e-dashboardlayout.e-control .e-panel .e-panel-header .e-header-content {
116
- display: inline-block;
117
- }
118
- .e-dashboardlayout.e-control .e-panel .e-panel-header .e-header-template {
119
- float: right;
120
- }
121
- .e-dashboardlayout.e-control .e-panel .e-panel-container {
122
- height: 100%;
123
- width: 100%;
124
- }
125
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-content .e-blazor-template {
126
- height: inherit;
127
- width: inherit;
128
- }
129
- .e-dashboardlayout.e-control .e-panel {
130
- border: 1px #e0e0e0 solid;
131
- height: 100%;
132
- -webkit-user-select: none;
133
- -ms-user-select: none;
134
- user-select: none;
135
- width: 100%;
136
- }
137
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single, .e-dashboardlayout.e-control .e-panel .e-resize.e-double {
138
- position: absolute;
139
- -ms-touch-action: none;
140
- touch-action: none;
141
- }
142
- .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, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south {
143
- border: none;
144
- }
145
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east:hover {
146
- cursor: e-resize;
147
- }
148
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-west:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west:hover {
149
- cursor: w-resize;
150
- }
151
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north:hover {
152
- cursor: n-resize;
153
- }
154
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south:hover {
155
- cursor: s-resize;
156
- }
157
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-west:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-west:hover {
158
- cursor: nw-resize;
159
- }
160
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-east:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-east:hover {
161
- cursor: ne-resize;
162
- }
163
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west:hover {
164
- cursor: sw-resize;
165
- }
166
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east:hover {
167
- cursor: se-resize;
168
- }
169
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single::before, .e-dashboardlayout.e-control .e-panel .e-resize.e-double::before {
170
- font-family: "e-icons";
171
- position: absolute;
172
- }
173
- .e-dashboardlayout.e-control .e-drag:hover {
174
- cursor: move;
175
- }
176
- .e-dashboardlayout.e-control .e-drag-restrict.e-drag:hover,
177
- .e-dashboardlayout.e-control .e-drag-restrict .e-drag:hover {
178
- cursor: default;
179
- }
180
- .e-dashboardlayout.e-control .e-panel.e-dragging, .e-dashboardlayout.e-control .e-panel.e-item-moving {
181
- cursor: move;
182
- z-index: 1111 !important;
183
- }
184
- .e-dashboardlayout.e-control .e-panel.e-rtl .e-panel-header .e-header-template {
185
- float: left;
186
- }
187
- .e-dashboardlayout.e-control .e-holder {
188
- background: rgba(63, 81, 181, 0.2);
189
- border: 1px #3f51b5 dotted;
190
- border-radius: 2px;
191
- position: absolute;
192
- border-radius: 2px;
193
- }
194
- .e-dashboardlayout.e-control .e-holder.e-holder-transition {
195
- transition: top 0.3s, left 0.3s;
196
- }
197
- .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
198
- font-size: 13px;
199
- font-weight: 500;
200
- height: 30px;
201
- padding: 0 12px;
202
- }
203
-
204
- .e-bigger .e-dashboardlayout.e-control .e-panel .e-panel-header {
205
- font-size: 13px;
206
- font-weight: 500;
207
- height: 30px;
208
- padding: 0 12px;
209
- }
210
- .e-content-placeholder.e-dashboardlayout.e-placeholder-dashboardlayout {
211
- height: 100%;
212
- width: 100%;
213
- }
214
-
215
- .e-dashboardlayout.e-control {
216
- display: block;
217
- position: relative;
218
- }
219
- .e-dashboardlayout.e-control .e-panel {
220
- background: #fff;
221
- box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.15);
222
- box-sizing: border-box;
223
- position: absolute;
224
- }
225
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
226
- color: rgba(0, 0, 0, 0.54);
227
- }
228
- .e-dashboardlayout.e-control .e-panel {
229
- background: #fff;
230
- box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.15);
231
- box-sizing: border-box;
232
- position: absolute;
233
- }
234
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
235
- color: rgba(0, 0, 0, 0.54);
236
- }
237
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-single {
238
- background: none;
239
- }
240
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double {
241
- color: #000;
242
- font-size: 20px;
243
- height: 20px;
244
- width: 20px;
245
- }
246
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-double {
247
- bottom: 1px;
248
- right: 1px;
249
- }
250
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-double {
251
- bottom: 1px;
252
- left: 1px;
253
- }
254
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-double {
255
- left: 1px;
256
- top: 1px;
257
- }
258
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-double {
259
- right: 1px;
260
- top: 1px;
261
- }
262
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-shrink {
263
- right: 1px;
264
- top: 1px;
265
- }
266
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-shrink {
267
- left: 1px;
268
- top: 1px;
269
- }
270
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-shrink {
271
- bottom: 1px;
272
- left: 1px;
273
- }
274
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-shrink {
275
- bottom: 1px;
276
- right: 1px;
277
- }
278
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-expand {
279
- right: 1px;
280
- top: 1px;
281
- }
282
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-expand {
283
- left: 1px;
284
- top: 1px;
285
- }
286
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-expand {
287
- bottom: 1px;
288
- left: 1px;
289
- }
290
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-expand {
291
- bottom: 1px;
292
- right: 1px;
293
- }
294
- .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
295
- color: rgba(0, 0, 0, 0.54);
296
- }
1
+ @import '@syncfusion/ej2-layouts/styles/dashboard-layout/material.css';
@@ -1,356 +1 @@
1
- :root {
2
- --color-sf-black: 0, 0, 0;
3
- --color-sf-white: 255, 255, 255;
4
- --color-sf-primary: 208, 188, 255;
5
- --color-sf-primary-container: 79, 55, 139;
6
- --color-sf-secondary: 204, 194, 220;
7
- --color-sf-secondary-container: 74, 68, 88;
8
- --color-sf-tertiary: 239, 184, 200;
9
- --color-sf-tertiary-container: 99, 59, 72;
10
- --color-sf-surface: 28, 27, 31;
11
- --color-sf-surface-variant: 73, 69, 79;
12
- --color-sf-background: var(--color-sf-surface);
13
- --color-sf-on-primary: 55, 30, 115;
14
- --color-sf-on-primary-container: 234, 221, 255;
15
- --color-sf-on-secondary: 51, 45, 65;
16
- --color-sf-on-secondary-container: 232, 222, 248;
17
- --color-sf-on-tertiary: 73, 37, 50;
18
- --color-sf-on-tertiary-containe: 255, 216, 228;
19
- --color-sf-on-surface: 230, 225, 229;
20
- --color-sf-on-surface-variant: 202, 196, 208;
21
- --color-sf-on-background: 230, 225, 229;
22
- --color-sf-outline: 147, 143, 153;
23
- --color-sf-outline-variant: 68, 71, 70;
24
- --color-sf-shadow: 0, 0, 0;
25
- --color-sf-surface-tint-color: 208, 188, 255;
26
- --color-sf-inverse-surface: 230, 225, 229;
27
- --color-sf-inverse-on-surface: 49, 48, 51;
28
- --color-sf-inverse-primary: 103, 80, 164;
29
- --color-sf-scrim: 0, 0, 0;
30
- --color-sf-error: 242, 184, 181;
31
- --color-sf-error-container: 140, 29, 24;
32
- --color-sf-on-error: 96, 20, 16;
33
- --color-sf-on-error-container: 249, 222, 220;
34
- --color-sf-success: 83, 202, 23;
35
- --color-sf-success-container: 22, 62, 2;
36
- --color-sf-on-success: 13, 39, 0;
37
- --color-sf-on-success-container: 183, 250, 150;
38
- --color-sf-info: 71, 172, 251;
39
- --color-sf-info-container: 0, 67, 120;
40
- --color-sf-on-info: 0, 51, 91;
41
- --color-sf-on-info-container: 173, 219, 255;
42
- --color-sf-warning: 245, 180, 130;
43
- --color-sf-warning-container: 123, 65, 0;
44
- --color-sf-on-warning: 99, 52, 0;
45
- --color-sf-on-warning-container: 255, 220, 193;
46
- --color-sf-spreadsheet-gridline: 231, 224, 236;
47
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
48
- --color-sf-success-text: 0, 0, 0;
49
- --color-sf-warning-text: 0, 0, 0;
50
- --color-sf-info-text: 0, 0, 0;
51
- --color-sf-danger-text: 0, 0, 0;
52
- --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
53
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
54
- }
55
-
56
- /*! component's theme wise override material 3 definitions and variables */
57
- /* stylelint-disable */
58
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east {
59
- height: 100%;
60
- padding: 20px 0;
61
- right: 1px;
62
- top: 0;
63
- width: 12px;
64
- }
65
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west {
66
- height: 100%;
67
- left: 0;
68
- padding: 20px 0;
69
- top: 0;
70
- width: 12px;
71
- }
72
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north {
73
- height: 12px;
74
- padding: 0 20px;
75
- top: 1px;
76
- width: 100%;
77
- }
78
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south {
79
- bottom: 1px;
80
- height: 12px;
81
- padding: 0 20px;
82
- width: 100%;
83
- }
84
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east {
85
- bottom: 0;
86
- right: 1px;
87
- z-index: 10;
88
- }
89
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-west {
90
- left: 2px;
91
- top: 2px;
92
- z-index: 10;
93
- }
94
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-east {
95
- right: 2px;
96
- top: 2px;
97
- z-index: 10;
98
- }
99
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west {
100
- bottom: 1px;
101
- left: 1px;
102
- z-index: 10;
103
- }
104
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east::before, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east::before {
105
- bottom: 4px;
106
- content: "\e761";
107
- font-size: 12px;
108
- position: absolute;
109
- right: 4px;
110
- }
111
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west::before, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west::before {
112
- bottom: 4px;
113
- content: "\e761";
114
- font-size: 12px;
115
- left: 4px;
116
- position: absolute;
117
- transform: rotateY(180deg);
118
- }
119
-
120
- .e-dashboardlayout.e-control .e-dashboard-gridline-table {
121
- background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface));
122
- border-collapse: collapse;
123
- height: 100%;
124
- width: 100%;
125
- }
126
- .e-dashboardlayout.e-control .e-dashboard-gridline-table tbody tr td.e-dashboard-gridline {
127
- border: 1px dashed rgba(var(--color-sf-primary));
128
- position: absolute;
129
- }
130
- .e-dashboardlayout.e-control.e-responsive {
131
- width: 100% !important;
132
- }
133
- .e-dashboardlayout.e-control.e-prevent {
134
- -webkit-user-select: none;
135
- -ms-user-select: none;
136
- user-select: none;
137
- }
138
- .e-dashboardlayout.e-control .e-panel {
139
- border-radius: 8px;
140
- }
141
- .e-dashboardlayout.e-control .e-panel:hover {
142
- border: 1px solid rgba(var(--color-sf-outline-variant));
143
- box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
144
- }
145
- .e-dashboardlayout.e-control .e-panel:hover .e-panel-container .e-resize.e-dl-icon {
146
- display: block;
147
- }
148
- .e-dashboardlayout.e-control .e-panel:active {
149
- border: 1px solid rgba(var(--color-sf-primary));
150
- }
151
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-dl-icon {
152
- display: none;
153
- }
154
- .e-dashboardlayout.e-control .e-panel.e-panel-transition {
155
- transition: top 0.5s, left 0.5s;
156
- }
157
- .e-dashboardlayout.e-control .e-panel .e-panel-header {
158
- border-bottom: 1px solid rgba(var(--color-sf-outline-variant));
159
- color: rgba(var(--color-sf-on-surface));
160
- font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
161
- font-size: 14px;
162
- font-weight: 600;
163
- height: 40px;
164
- padding: 11px 16px;
165
- border-top-left-radius: 8px;
166
- border-top-right-radius: 8px;
167
- }
168
- .e-dashboardlayout.e-control .e-panel .e-panel-header div {
169
- overflow: hidden;
170
- text-overflow: ellipsis;
171
- white-space: nowrap;
172
- }
173
- .e-dashboardlayout.e-control .e-panel .e-panel-header .e-header-content {
174
- display: inline-block;
175
- }
176
- .e-dashboardlayout.e-control .e-panel .e-panel-header .e-header-template {
177
- float: right;
178
- }
179
- .e-dashboardlayout.e-control .e-panel .e-panel-container {
180
- height: 100%;
181
- width: 100%;
182
- }
183
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-content .e-blazor-template {
184
- height: inherit;
185
- width: inherit;
186
- }
187
- .e-dashboardlayout.e-control .e-panel {
188
- border: 1px solid rgba(var(--color-sf-outline-variant));
189
- height: 100%;
190
- -webkit-user-select: none;
191
- -ms-user-select: none;
192
- user-select: none;
193
- width: 100%;
194
- }
195
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single, .e-dashboardlayout.e-control .e-panel .e-resize.e-double {
196
- position: absolute;
197
- -ms-touch-action: none;
198
- touch-action: none;
199
- }
200
- .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, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south {
201
- border: none;
202
- }
203
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-east:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-east:hover {
204
- cursor: e-resize;
205
- }
206
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-west:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-west:hover {
207
- cursor: w-resize;
208
- }
209
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north:hover {
210
- cursor: n-resize;
211
- }
212
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south:hover {
213
- cursor: s-resize;
214
- }
215
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-west:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-west:hover {
216
- cursor: nw-resize;
217
- }
218
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-north-east:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-north-east:hover {
219
- cursor: ne-resize;
220
- }
221
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west:hover {
222
- cursor: sw-resize;
223
- }
224
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east:hover, .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east:hover {
225
- cursor: se-resize;
226
- }
227
- .e-dashboardlayout.e-control .e-panel .e-resize.e-single::before, .e-dashboardlayout.e-control .e-panel .e-resize.e-double::before {
228
- font-family: "e-icons";
229
- position: absolute;
230
- }
231
- .e-dashboardlayout.e-control .e-drag:hover {
232
- cursor: move;
233
- }
234
- .e-dashboardlayout.e-control .e-drag-restrict.e-drag:hover,
235
- .e-dashboardlayout.e-control .e-drag-restrict .e-drag:hover {
236
- cursor: default;
237
- }
238
- .e-dashboardlayout.e-control .e-panel.e-dragging, .e-dashboardlayout.e-control .e-panel.e-item-moving {
239
- cursor: move;
240
- z-index: 1111 !important;
241
- }
242
- .e-dashboardlayout.e-control .e-panel.e-rtl .e-panel-header .e-header-template {
243
- float: left;
244
- }
245
- .e-dashboardlayout.e-control .e-holder {
246
- background: rgba(var(--color-sf-primary-container));
247
- border: 1px rgba(var(--color-sf-primary)) dashed;
248
- border-radius: 8px;
249
- position: absolute;
250
- border-radius: 8px;
251
- }
252
- .e-dashboardlayout.e-control .e-holder.e-holder-transition {
253
- transition: top 0.3s, left 0.3s;
254
- }
255
- .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
256
- font-size: 16px;
257
- font-weight: 600;
258
- height: 48px;
259
- padding: 14px 16px;
260
- }
261
-
262
- .e-bigger .e-dashboardlayout.e-control .e-panel .e-panel-header {
263
- font-size: 16px;
264
- font-weight: 600;
265
- height: 48px;
266
- padding: 14px 16px;
267
- }
268
- .e-content-placeholder.e-dashboardlayout.e-placeholder-dashboardlayout {
269
- height: 100%;
270
- width: 100%;
271
- }
272
-
273
- .e-dashboardlayout.e-control {
274
- display: block;
275
- position: relative;
276
- }
277
- .e-dashboardlayout.e-control .e-panel {
278
- background: rgba(var(--color-sf-surface));
279
- box-shadow: none;
280
- box-sizing: border-box;
281
- position: absolute;
282
- }
283
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
284
- color: rgba(var(--color-sf-on-surface));
285
- background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface));
286
- box-sizing: border-box;
287
- }
288
- .e-dashboardlayout.e-control .e-panel {
289
- background: rgba(var(--color-sf-surface));
290
- box-shadow: none;
291
- box-sizing: border-box;
292
- position: absolute;
293
- }
294
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-panel-header {
295
- color: rgba(var(--color-sf-on-surface));
296
- }
297
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-single {
298
- background: none;
299
- }
300
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double {
301
- color: rgba(var(--color-sf-on-surface-variant), 0.38);
302
- font-size: 8px;
303
- height: 8px;
304
- width: 8px;
305
- }
306
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-double {
307
- bottom: 2px;
308
- right: 2px;
309
- }
310
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-double {
311
- bottom: 2px;
312
- left: 2px;
313
- }
314
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-double {
315
- left: 2px;
316
- top: 2px;
317
- }
318
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-double {
319
- right: 2px;
320
- top: 2px;
321
- }
322
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-shrink {
323
- right: 2px;
324
- top: 2px;
325
- }
326
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-shrink {
327
- left: 2px;
328
- top: 2px;
329
- }
330
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-shrink {
331
- bottom: 2px;
332
- left: 2px;
333
- }
334
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-shrink {
335
- bottom: 2px;
336
- right: 2px;
337
- }
338
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-east-expand {
339
- right: 2px;
340
- top: 2px;
341
- }
342
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-north-west-expand {
343
- left: 2px;
344
- top: 2px;
345
- }
346
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-west-expand {
347
- bottom: 2px;
348
- left: 2px;
349
- }
350
- .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-double.e-south-east-expand {
351
- bottom: 2px;
352
- right: 2px;
353
- }
354
- .e-dashboardlayout.e-control .e-panel.e-bigger .e-panel-header {
355
- color: rgba(var(--color-sf-on-surface));
356
- }
1
+ @import '@syncfusion/ej2-layouts/styles/dashboard-layout/material3-dark.css';