@syncfusion/ej2-schedule 20.3.58 → 20.4.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 (158) hide show
  1. package/.eslintrc.json +16 -1
  2. package/CHANGELOG.md +10 -0
  3. package/README.md +62 -46
  4. package/dist/ej2-schedule.min.js +2 -2
  5. package/dist/ej2-schedule.umd.min.js +2 -2
  6. package/dist/ej2-schedule.umd.min.js.map +1 -1
  7. package/dist/es6/ej2-schedule.es2015.js +821 -528
  8. package/dist/es6/ej2-schedule.es2015.js.map +1 -1
  9. package/dist/es6/ej2-schedule.es5.js +860 -539
  10. package/dist/es6/ej2-schedule.es5.js.map +1 -1
  11. package/dist/global/ej2-schedule.min.js +2 -2
  12. package/dist/global/ej2-schedule.min.js.map +1 -1
  13. package/dist/global/index.d.ts +1 -1
  14. package/package.json +22 -30
  15. package/src/common/calendar-util.js +1 -1
  16. package/src/recurrence-editor/date-generator.js +26 -26
  17. package/src/recurrence-editor/recurrence-editor.js +5 -5
  18. package/src/schedule/actions/action-base.js +3 -3
  19. package/src/schedule/actions/crud.js +16 -16
  20. package/src/schedule/actions/drag.js +36 -32
  21. package/src/schedule/actions/keyboard.js +10 -8
  22. package/src/schedule/actions/resize.js +6 -6
  23. package/src/schedule/actions/touch.js +4 -3
  24. package/src/schedule/actions/virtual-scroll.js +10 -7
  25. package/src/schedule/base/interface.d.ts +8 -1
  26. package/src/schedule/base/resource.d.ts +1 -0
  27. package/src/schedule/base/resource.js +179 -93
  28. package/src/schedule/base/schedule-model.d.ts +7 -0
  29. package/src/schedule/base/schedule.d.ts +23 -0
  30. package/src/schedule/base/schedule.js +73 -22
  31. package/src/schedule/base/util.js +4 -6
  32. package/src/schedule/event-renderer/agenda-base.js +36 -31
  33. package/src/schedule/event-renderer/event-base.js +25 -25
  34. package/src/schedule/event-renderer/inline-edit.js +8 -5
  35. package/src/schedule/event-renderer/month.js +17 -14
  36. package/src/schedule/event-renderer/timeline-view.js +11 -11
  37. package/src/schedule/event-renderer/vertical-view.d.ts +1 -0
  38. package/src/schedule/event-renderer/vertical-view.js +97 -70
  39. package/src/schedule/event-renderer/year.js +25 -17
  40. package/src/schedule/exports/calendar-export.js +4 -4
  41. package/src/schedule/exports/calendar-import.js +14 -15
  42. package/src/schedule/exports/excel-export.js +1 -1
  43. package/src/schedule/exports/print.js +39 -4
  44. package/src/schedule/models/group-model.d.ts +8 -0
  45. package/src/schedule/models/group.d.ts +7 -0
  46. package/src/schedule/models/group.js +3 -0
  47. package/src/schedule/models/views-model.d.ts +8 -1
  48. package/src/schedule/models/views.d.ts +7 -1
  49. package/src/schedule/models/views.js +3 -0
  50. package/src/schedule/popups/event-tooltip.js +3 -2
  51. package/src/schedule/popups/event-window.js +36 -30
  52. package/src/schedule/popups/quick-popups.js +6 -6
  53. package/src/schedule/renderer/agenda.js +5 -5
  54. package/src/schedule/renderer/header-renderer.d.ts +1 -1
  55. package/src/schedule/renderer/header-renderer.js +21 -5
  56. package/src/schedule/renderer/month-agenda.js +11 -4
  57. package/src/schedule/renderer/month.js +44 -16
  58. package/src/schedule/renderer/renderer.js +3 -3
  59. package/src/schedule/renderer/timeline-header-row.js +7 -7
  60. package/src/schedule/renderer/timeline-month.js +5 -5
  61. package/src/schedule/renderer/timeline-view.js +2 -2
  62. package/src/schedule/renderer/timeline-year.js +20 -14
  63. package/src/schedule/renderer/vertical-view.js +24 -9
  64. package/src/schedule/renderer/view-base.d.ts +3 -0
  65. package/src/schedule/renderer/view-base.js +11 -3
  66. package/src/schedule/renderer/year.js +11 -5
  67. package/styles/bootstrap-dark.css +364 -101
  68. package/styles/bootstrap.css +363 -99
  69. package/styles/bootstrap4.css +375 -141
  70. package/styles/bootstrap5-dark.css +339 -137
  71. package/styles/bootstrap5.css +339 -137
  72. package/styles/fabric-dark.css +330 -101
  73. package/styles/fabric.css +316 -106
  74. package/styles/fluent-dark.css +395 -102
  75. package/styles/fluent.css +395 -102
  76. package/styles/highcontrast-light.css +407 -98
  77. package/styles/highcontrast.css +399 -113
  78. package/styles/material-dark.css +362 -110
  79. package/styles/material.css +404 -110
  80. package/styles/recurrence-editor/_layout.scss +42 -28
  81. package/styles/recurrence-editor/bootstrap-dark.css +137 -28
  82. package/styles/recurrence-editor/bootstrap-dark.scss +5 -0
  83. package/styles/recurrence-editor/bootstrap.css +137 -28
  84. package/styles/recurrence-editor/bootstrap.scss +5 -0
  85. package/styles/recurrence-editor/bootstrap4.css +171 -28
  86. package/styles/recurrence-editor/bootstrap4.scss +5 -0
  87. package/styles/recurrence-editor/bootstrap5-dark.css +178 -28
  88. package/styles/recurrence-editor/bootstrap5-dark.scss +5 -0
  89. package/styles/recurrence-editor/bootstrap5.css +178 -28
  90. package/styles/recurrence-editor/bootstrap5.scss +5 -0
  91. package/styles/recurrence-editor/fabric-dark.css +113 -28
  92. package/styles/recurrence-editor/fabric-dark.scss +5 -0
  93. package/styles/recurrence-editor/fabric.css +106 -28
  94. package/styles/recurrence-editor/fabric.scss +5 -0
  95. package/styles/recurrence-editor/fluent-dark.css +158 -28
  96. package/styles/recurrence-editor/fluent-dark.scss +5 -0
  97. package/styles/recurrence-editor/fluent.css +158 -28
  98. package/styles/recurrence-editor/fluent.scss +5 -0
  99. package/styles/recurrence-editor/highcontrast-light.css +110 -28
  100. package/styles/recurrence-editor/highcontrast-light.scss +5 -0
  101. package/styles/recurrence-editor/highcontrast.css +110 -28
  102. package/styles/recurrence-editor/highcontrast.scss +5 -0
  103. package/styles/recurrence-editor/material-dark.css +138 -28
  104. package/styles/recurrence-editor/material-dark.scss +5 -0
  105. package/styles/recurrence-editor/material.css +163 -28
  106. package/styles/recurrence-editor/material.scss +5 -0
  107. package/styles/recurrence-editor/tailwind-dark.css +126 -28
  108. package/styles/recurrence-editor/tailwind-dark.scss +5 -0
  109. package/styles/recurrence-editor/tailwind.css +126 -28
  110. package/styles/recurrence-editor/tailwind.scss +5 -0
  111. package/styles/schedule/_bootstrap-dark-definition.scss +63 -4
  112. package/styles/schedule/_bootstrap-definition.scss +62 -3
  113. package/styles/schedule/_bootstrap4-definition.scss +65 -5
  114. package/styles/schedule/_bootstrap5-definition.scss +63 -5
  115. package/styles/schedule/_fabric-dark-definition.scss +61 -3
  116. package/styles/schedule/_fabric-definition.scss +62 -3
  117. package/styles/schedule/_fluent-definition.scss +63 -6
  118. package/styles/schedule/_fusionnew-definition.scss +60 -3
  119. package/styles/schedule/_highcontrast-definition.scss +62 -3
  120. package/styles/schedule/_highcontrast-light-definition.scss +62 -3
  121. package/styles/schedule/_layout.scss +117 -506
  122. package/styles/schedule/_material-dark-definition.scss +63 -4
  123. package/styles/schedule/_material-definition.scss +63 -4
  124. package/styles/schedule/_material3-definition.scss +62 -3
  125. package/styles/schedule/_tailwind-definition.scss +63 -6
  126. package/styles/schedule/_theme.scss +97 -62
  127. package/styles/schedule/bootstrap-dark.css +332 -73
  128. package/styles/schedule/bootstrap-dark.scss +11 -0
  129. package/styles/schedule/bootstrap.css +331 -71
  130. package/styles/schedule/bootstrap.scss +11 -0
  131. package/styles/schedule/bootstrap4.css +343 -113
  132. package/styles/schedule/bootstrap4.scss +11 -0
  133. package/styles/schedule/bootstrap5-dark.css +307 -109
  134. package/styles/schedule/bootstrap5-dark.scss +11 -0
  135. package/styles/schedule/bootstrap5.css +307 -109
  136. package/styles/schedule/bootstrap5.scss +11 -0
  137. package/styles/schedule/fabric-dark.css +298 -73
  138. package/styles/schedule/fabric-dark.scss +11 -0
  139. package/styles/schedule/fabric.css +284 -78
  140. package/styles/schedule/fabric.scss +11 -0
  141. package/styles/schedule/fluent-dark.css +363 -74
  142. package/styles/schedule/fluent-dark.scss +11 -0
  143. package/styles/schedule/fluent.css +363 -74
  144. package/styles/schedule/fluent.scss +11 -0
  145. package/styles/schedule/highcontrast-light.css +375 -70
  146. package/styles/schedule/highcontrast-light.scss +11 -0
  147. package/styles/schedule/highcontrast.css +367 -85
  148. package/styles/schedule/highcontrast.scss +11 -0
  149. package/styles/schedule/material-dark.css +330 -82
  150. package/styles/schedule/material-dark.scss +11 -0
  151. package/styles/schedule/material.css +372 -82
  152. package/styles/schedule/material.scss +11 -0
  153. package/styles/schedule/tailwind-dark.css +246 -111
  154. package/styles/schedule/tailwind-dark.scss +11 -0
  155. package/styles/schedule/tailwind.css +246 -111
  156. package/styles/schedule/tailwind.scss +11 -0
  157. package/styles/tailwind-dark.css +279 -140
  158. package/styles/tailwind.css +279 -140
@@ -1,4 +1,98 @@
1
1
  @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
2
+ .e-ddl.e-control-wrapper .e-ddl-icon::before {
3
+ transform: rotate(0deg);
4
+ transition: transform 300ms ease;
5
+ }
6
+
7
+ .e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before {
8
+ transform: rotate(180deg);
9
+ transition: transform 300ms ease;
10
+ }
11
+
12
+ .e-dropdownbase .e-list-item.e-active.e-hover {
13
+ color: #fff;
14
+ }
15
+
16
+ .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:active,
17
+ .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:hover,
18
+ .e-input-group:not(.e-disabled) .e-back-icon:active,
19
+ .e-input-group:not(.e-disabled) .e-back-icon:hover,
20
+ .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:active,
21
+ .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:hover {
22
+ background: transparent;
23
+ }
24
+
25
+ .e-input-group .e-ddl-icon:not(:active)::after {
26
+ animation: none;
27
+ }
28
+
29
+ .e-ddl.e-popup {
30
+ border: 0;
31
+ border-radius: 4px;
32
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
33
+ margin-top: 4px;
34
+ }
35
+
36
+ .e-small .e-ddl.e-popup,
37
+ .e-small.e-ddl.e-popup {
38
+ border-radius: 2px;
39
+ margin-top: 2px;
40
+ }
41
+
42
+ .e-bigger .e-ddl.e-popup,
43
+ .e-bigger.e-ddl.e-popup {
44
+ border-radius: 6px;
45
+ margin-top: 8px;
46
+ }
47
+
48
+ .e-bigger.e-small .e-ddl.e-popup,
49
+ .e-small.e-bigger.e-ddl.e-popup {
50
+ border-radius: 4px;
51
+ margin-top: 6px;
52
+ }
53
+
54
+ .e-popup.e-ddl .e-dropdownbase {
55
+ min-height: 26px;
56
+ padding: 4px 0;
57
+ }
58
+
59
+ .e-bigger .e-popup.e-ddl-device-filter .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
60
+ border-color: #4b5563;
61
+ }
62
+
63
+ .e-bigger .e-popup.e-ddl-device-filter {
64
+ margin-top: 0;
65
+ }
66
+
67
+ .e-bigger .e-ddl-device .e-input-group,
68
+ .e-bigger .e-ddl-device .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
69
+ background: #374151;
70
+ border-width: 0;
71
+ box-shadow: none;
72
+ margin-bottom: 0;
73
+ }
74
+
75
+ .e-bigger .e-ddl-device .e-input-group .e-back-icon,
76
+ .e-bigger .e-ddl-device .e-input-group input.e-input,
77
+ .e-bigger .e-ddl-device .e-input-group .e-clear-icon {
78
+ background-color: #374151;
79
+ }
80
+
81
+ .e-input-group.e-ddl,
82
+ .e-input-group.e-ddl .e-input,
83
+ .e-input-group.e-ddl .e-ddl-icon {
84
+ background: #1f2937;
85
+ }
86
+
87
+ .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group:hover:not(.e-disabled):not(.e-float-icon-left),
88
+ .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left) {
89
+ border-bottom-width: 0;
90
+ }
91
+
92
+ .e-ddl.e-popup.e-outline .e-filter-parent {
93
+ padding: 4px 8px;
94
+ }
95
+
2
96
  /*! recurrence editor theme wise definitions*/
3
97
  /*! Recurrence-Editor component layout */
4
98
  .e-recurrenceeditor .e-editor {
@@ -6,8 +100,7 @@
6
100
  display: flex;
7
101
  -ms-flex-flow: row wrap;
8
102
  flex-flow: row wrap;
9
- margin-left: auto;
10
- margin-right: auto;
103
+ margin: 0 auto;
11
104
  max-width: 1240px;
12
105
  }
13
106
  .e-recurrenceeditor .e-recurrence-table {
@@ -48,7 +141,7 @@
48
141
  }
49
142
  .e-recurrenceeditor .e-form-right,
50
143
  .e-recurrenceeditor .e-input-wrapper-side.e-form-right {
51
- padding: 0 0 10px 8px;
144
+ padding: 0 0 10px;
52
145
  }
53
146
  .e-recurrenceeditor .e-input-wrapper {
54
147
  float: left;
@@ -89,13 +182,11 @@
89
182
  margin-bottom: 5px;
90
183
  }
91
184
  .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
92
- padding-left: 8px;
93
- padding-right: 0;
185
+ padding: 0 0 0 8px;
94
186
  }
95
187
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
96
188
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
97
- padding-left: 0;
98
- padding-right: 8px;
189
+ padding: 0 8px 0 0;
99
190
  }
100
191
  .e-recurrenceeditor.e-rtl .e-recurrenceeditor .e-recurrence-table.e-month-expand-wrapper td:first-child {
101
192
  width: 30px;
@@ -123,10 +214,10 @@
123
214
  margin-bottom: 11px;
124
215
  }
125
216
  .e-recurrenceeditor .e-month-expander tr:first-child .e-input-wrapper {
126
- margin-bottom: 11px;
217
+ padding-bottom: 11px;
127
218
  }
128
219
  .e-recurrenceeditor .e-month-expander-checkbox-wrapper.e-input-wrapper {
129
- margin-top: -3px;
220
+ padding-top: 3px;
130
221
  }
131
222
  .e-recurrenceeditor .e-month-expander-checkbox-wrapper.e-input-wrapper .e-month-type .e-label {
132
223
  display: none;
@@ -176,7 +267,7 @@
176
267
  }
177
268
  .e-bigger .e-recurrenceeditor .e-form-right,
178
269
  .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-form-right {
179
- padding: 0 0 10px 12px;
270
+ padding: 0 0 10px;
180
271
  }
181
272
  .e-bigger .e-recurrenceeditor .e-input-wrapper-side .e-days .e-form-left {
182
273
  padding-bottom: 6px;
@@ -235,8 +326,7 @@
235
326
  }
236
327
  .e-bigger .e-recurrenceeditor.e-rtl .e-recurrence-table .e-monthday-element,
237
328
  .e-bigger .e-recurrenceeditor.e-rtl .e-recurrence-table .e-day-position {
238
- padding-left: 0;
239
- padding-right: 64px;
329
+ padding: 0 64px 0 0;
240
330
  }
241
331
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-label,
242
332
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-non-week > .e-month-expander-label {
@@ -246,13 +336,11 @@
246
336
  margin-bottom: 5px;
247
337
  }
248
338
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
249
- padding-left: 12px;
250
- padding-right: 0;
339
+ padding: 0 0 0 12px;
251
340
  }
252
341
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
253
342
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
254
- padding-left: 0;
255
- padding-right: 12px;
343
+ padding: 0 12px 0 0;
256
344
  }
257
345
  .e-bigger .e-recurrenceeditor.e-rtl .e-recurrence-table .e-week-position {
258
346
  left: 0;
@@ -284,8 +372,7 @@
284
372
  }
285
373
  .e-device .e-recurrenceeditor .e-input-wrapper.e-end-on-date,
286
374
  .e-device .e-recurrenceeditor .e-input-wrapper.e-end-on-count {
287
- padding-left: 10px;
288
- padding-right: 0;
375
+ padding: 0 0 0 10px;
289
376
  }
290
377
  .e-device .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
291
378
  padding-right: 10px;
@@ -306,23 +393,25 @@
306
393
  .e-device .e-recurrenceeditor .e-recurrence-table .e-day-position {
307
394
  padding-left: 20px;
308
395
  }
396
+ .e-device .e-recurrenceeditor .e-recurrence-table .e-monthday-element {
397
+ margin-left: 20px;
398
+ }
309
399
  .e-device .e-recurrenceeditor .e-week-position {
310
400
  right: 0;
401
+ padding-right: 10px;
311
402
  }
312
403
  .e-device .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
313
404
  padding-right: 0;
314
405
  }
315
406
  .e-device .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
316
407
  .e-device .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
317
- padding-left: 0;
318
- padding-right: 10px;
408
+ padding: 0 10px 0 0;
319
409
  }
320
410
  .e-device .e-recurrenceeditor.e-rtl .e-recurrence-table .e-monthday-element {
321
- padding-left: 0;
411
+ padding: 0 20px 0 0;
322
412
  }
323
413
  .e-device .e-recurrenceeditor.e-rtl .e-recurrence-table .e-day-position {
324
- padding-right: 20px;
325
- padding-left: 0;
414
+ padding: 0 50px 0 0;
326
415
  }
327
416
  .e-device .e-recurrenceeditor.e-rtl .e-week-position {
328
417
  left: 0;
@@ -339,6 +428,14 @@
339
428
  padding: 16px 8px;
340
429
  }
341
430
 
431
+ @media (max-width: 1024px) {
432
+ .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on {
433
+ width: 100%;
434
+ }
435
+ .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week {
436
+ width: 65%;
437
+ }
438
+ }
342
439
  @media (max-width: 580px) {
343
440
  .e-recurrenceeditor {
344
441
  margin-left: auto;
@@ -374,8 +471,7 @@
374
471
  }
375
472
  .e-recurrenceeditor .e-editor .e-input-wrapper.e-end-on-date,
376
473
  .e-recurrenceeditor .e-editor .e-input-wrapper.e-end-on-count {
377
- padding-left: 10px;
378
- padding-right: 0;
474
+ padding: 0 0 0 10px;
379
475
  }
380
476
  .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on .e-end-on-left {
381
477
  padding-right: 10px;
@@ -388,15 +484,17 @@
388
484
  width: 100%;
389
485
  }
390
486
  .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week {
391
- width: 100%;
487
+ width: 65%;
488
+ }
489
+ .e-recurrenceeditor .e-editor .e-recurrence-table .e-day-position {
490
+ padding-left: 50px;
392
491
  }
393
492
  .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
394
493
  padding-right: 0;
395
494
  }
396
495
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
397
496
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
398
- padding-left: 0;
399
- padding-right: 10px;
497
+ padding: 0 10px 0 0;
400
498
  }
401
499
  }
402
500
  /*! Recurrence-Editor component theme */
@@ -1,3 +1,8 @@
1
1
  @import 'ej2-base/styles/tailwind-dark-definition.scss';
2
+ @import 'ej2-inputs/styles/numerictextbox/tailwind-dark-definition.scss';
3
+ @import 'ej2-buttons/styles/button/tailwind-dark-definition.scss';
4
+ @import 'ej2-buttons/styles/radio-button/tailwind-dark-definition.scss';
5
+ @import 'ej2-calendars/styles/datepicker/tailwind-dark-definition.scss';
6
+ @import 'ej2-dropdowns/styles/drop-down-list/tailwind-dark-definition.scss';
2
7
  @import 'tailwind-dark-definition.scss';
3
8
  @import 'all.scss';
@@ -1,4 +1,98 @@
1
1
  @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
2
+ .e-ddl.e-control-wrapper .e-ddl-icon::before {
3
+ transform: rotate(0deg);
4
+ transition: transform 300ms ease;
5
+ }
6
+
7
+ .e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before {
8
+ transform: rotate(180deg);
9
+ transition: transform 300ms ease;
10
+ }
11
+
12
+ .e-dropdownbase .e-list-item.e-active.e-hover {
13
+ color: #111827;
14
+ }
15
+
16
+ .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:active,
17
+ .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:hover,
18
+ .e-input-group:not(.e-disabled) .e-back-icon:active,
19
+ .e-input-group:not(.e-disabled) .e-back-icon:hover,
20
+ .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:active,
21
+ .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:hover {
22
+ background: transparent;
23
+ }
24
+
25
+ .e-input-group .e-ddl-icon:not(:active)::after {
26
+ animation: none;
27
+ }
28
+
29
+ .e-ddl.e-popup {
30
+ border: 0;
31
+ border-radius: 4px;
32
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
33
+ margin-top: 4px;
34
+ }
35
+
36
+ .e-small .e-ddl.e-popup,
37
+ .e-small.e-ddl.e-popup {
38
+ border-radius: 2px;
39
+ margin-top: 2px;
40
+ }
41
+
42
+ .e-bigger .e-ddl.e-popup,
43
+ .e-bigger.e-ddl.e-popup {
44
+ border-radius: 6px;
45
+ margin-top: 8px;
46
+ }
47
+
48
+ .e-bigger.e-small .e-ddl.e-popup,
49
+ .e-small.e-bigger.e-ddl.e-popup {
50
+ border-radius: 4px;
51
+ margin-top: 6px;
52
+ }
53
+
54
+ .e-popup.e-ddl .e-dropdownbase {
55
+ min-height: 26px;
56
+ padding: 4px 0;
57
+ }
58
+
59
+ .e-bigger .e-popup.e-ddl-device-filter .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
60
+ border-color: #e5e7eb;
61
+ }
62
+
63
+ .e-bigger .e-popup.e-ddl-device-filter {
64
+ margin-top: 0;
65
+ }
66
+
67
+ .e-bigger .e-ddl-device .e-input-group,
68
+ .e-bigger .e-ddl-device .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
69
+ background: #fff;
70
+ border-width: 0;
71
+ box-shadow: none;
72
+ margin-bottom: 0;
73
+ }
74
+
75
+ .e-bigger .e-ddl-device .e-input-group .e-back-icon,
76
+ .e-bigger .e-ddl-device .e-input-group input.e-input,
77
+ .e-bigger .e-ddl-device .e-input-group .e-clear-icon {
78
+ background-color: #fff;
79
+ }
80
+
81
+ .e-input-group.e-ddl,
82
+ .e-input-group.e-ddl .e-input,
83
+ .e-input-group.e-ddl .e-ddl-icon {
84
+ background: #fff;
85
+ }
86
+
87
+ .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group:hover:not(.e-disabled):not(.e-float-icon-left),
88
+ .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left) {
89
+ border-bottom-width: 0;
90
+ }
91
+
92
+ .e-ddl.e-popup.e-outline .e-filter-parent {
93
+ padding: 4px 8px;
94
+ }
95
+
2
96
  /*! recurrence editor theme wise definitions*/
3
97
  /*! Recurrence-Editor component layout */
4
98
  .e-recurrenceeditor .e-editor {
@@ -6,8 +100,7 @@
6
100
  display: flex;
7
101
  -ms-flex-flow: row wrap;
8
102
  flex-flow: row wrap;
9
- margin-left: auto;
10
- margin-right: auto;
103
+ margin: 0 auto;
11
104
  max-width: 1240px;
12
105
  }
13
106
  .e-recurrenceeditor .e-recurrence-table {
@@ -48,7 +141,7 @@
48
141
  }
49
142
  .e-recurrenceeditor .e-form-right,
50
143
  .e-recurrenceeditor .e-input-wrapper-side.e-form-right {
51
- padding: 0 0 10px 8px;
144
+ padding: 0 0 10px;
52
145
  }
53
146
  .e-recurrenceeditor .e-input-wrapper {
54
147
  float: left;
@@ -89,13 +182,11 @@
89
182
  margin-bottom: 5px;
90
183
  }
91
184
  .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
92
- padding-left: 8px;
93
- padding-right: 0;
185
+ padding: 0 0 0 8px;
94
186
  }
95
187
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
96
188
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
97
- padding-left: 0;
98
- padding-right: 8px;
189
+ padding: 0 8px 0 0;
99
190
  }
100
191
  .e-recurrenceeditor.e-rtl .e-recurrenceeditor .e-recurrence-table.e-month-expand-wrapper td:first-child {
101
192
  width: 30px;
@@ -123,10 +214,10 @@
123
214
  margin-bottom: 11px;
124
215
  }
125
216
  .e-recurrenceeditor .e-month-expander tr:first-child .e-input-wrapper {
126
- margin-bottom: 11px;
217
+ padding-bottom: 11px;
127
218
  }
128
219
  .e-recurrenceeditor .e-month-expander-checkbox-wrapper.e-input-wrapper {
129
- margin-top: -3px;
220
+ padding-top: 3px;
130
221
  }
131
222
  .e-recurrenceeditor .e-month-expander-checkbox-wrapper.e-input-wrapper .e-month-type .e-label {
132
223
  display: none;
@@ -176,7 +267,7 @@
176
267
  }
177
268
  .e-bigger .e-recurrenceeditor .e-form-right,
178
269
  .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-form-right {
179
- padding: 0 0 10px 12px;
270
+ padding: 0 0 10px;
180
271
  }
181
272
  .e-bigger .e-recurrenceeditor .e-input-wrapper-side .e-days .e-form-left {
182
273
  padding-bottom: 6px;
@@ -235,8 +326,7 @@
235
326
  }
236
327
  .e-bigger .e-recurrenceeditor.e-rtl .e-recurrence-table .e-monthday-element,
237
328
  .e-bigger .e-recurrenceeditor.e-rtl .e-recurrence-table .e-day-position {
238
- padding-left: 0;
239
- padding-right: 64px;
329
+ padding: 0 64px 0 0;
240
330
  }
241
331
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-label,
242
332
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-non-week > .e-month-expander-label {
@@ -246,13 +336,11 @@
246
336
  margin-bottom: 5px;
247
337
  }
248
338
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
249
- padding-left: 12px;
250
- padding-right: 0;
339
+ padding: 0 0 0 12px;
251
340
  }
252
341
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
253
342
  .e-bigger .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
254
- padding-left: 0;
255
- padding-right: 12px;
343
+ padding: 0 12px 0 0;
256
344
  }
257
345
  .e-bigger .e-recurrenceeditor.e-rtl .e-recurrence-table .e-week-position {
258
346
  left: 0;
@@ -284,8 +372,7 @@
284
372
  }
285
373
  .e-device .e-recurrenceeditor .e-input-wrapper.e-end-on-date,
286
374
  .e-device .e-recurrenceeditor .e-input-wrapper.e-end-on-count {
287
- padding-left: 10px;
288
- padding-right: 0;
375
+ padding: 0 0 0 10px;
289
376
  }
290
377
  .e-device .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
291
378
  padding-right: 10px;
@@ -306,23 +393,25 @@
306
393
  .e-device .e-recurrenceeditor .e-recurrence-table .e-day-position {
307
394
  padding-left: 20px;
308
395
  }
396
+ .e-device .e-recurrenceeditor .e-recurrence-table .e-monthday-element {
397
+ margin-left: 20px;
398
+ }
309
399
  .e-device .e-recurrenceeditor .e-week-position {
310
400
  right: 0;
401
+ padding-right: 10px;
311
402
  }
312
403
  .e-device .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
313
404
  padding-right: 0;
314
405
  }
315
406
  .e-device .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
316
407
  .e-device .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
317
- padding-left: 0;
318
- padding-right: 10px;
408
+ padding: 0 10px 0 0;
319
409
  }
320
410
  .e-device .e-recurrenceeditor.e-rtl .e-recurrence-table .e-monthday-element {
321
- padding-left: 0;
411
+ padding: 0 20px 0 0;
322
412
  }
323
413
  .e-device .e-recurrenceeditor.e-rtl .e-recurrence-table .e-day-position {
324
- padding-right: 20px;
325
- padding-left: 0;
414
+ padding: 0 50px 0 0;
326
415
  }
327
416
  .e-device .e-recurrenceeditor.e-rtl .e-week-position {
328
417
  left: 0;
@@ -339,6 +428,14 @@
339
428
  padding: 16px 8px;
340
429
  }
341
430
 
431
+ @media (max-width: 1024px) {
432
+ .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on {
433
+ width: 100%;
434
+ }
435
+ .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week {
436
+ width: 65%;
437
+ }
438
+ }
342
439
  @media (max-width: 580px) {
343
440
  .e-recurrenceeditor {
344
441
  margin-left: auto;
@@ -374,8 +471,7 @@
374
471
  }
375
472
  .e-recurrenceeditor .e-editor .e-input-wrapper.e-end-on-date,
376
473
  .e-recurrenceeditor .e-editor .e-input-wrapper.e-end-on-count {
377
- padding-left: 10px;
378
- padding-right: 0;
474
+ padding: 0 0 0 10px;
379
475
  }
380
476
  .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on .e-end-on-left {
381
477
  padding-right: 10px;
@@ -388,15 +484,17 @@
388
484
  width: 100%;
389
485
  }
390
486
  .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week {
391
- width: 100%;
487
+ width: 65%;
488
+ }
489
+ .e-recurrenceeditor .e-editor .e-recurrence-table .e-day-position {
490
+ padding-left: 50px;
392
491
  }
393
492
  .e-recurrenceeditor.e-rtl .e-input-wrapper-side.e-end-on .e-end-on-left {
394
493
  padding-right: 0;
395
494
  }
396
495
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-date,
397
496
  .e-recurrenceeditor.e-rtl .e-input-wrapper.e-end-on-count {
398
- padding-left: 0;
399
- padding-right: 10px;
497
+ padding: 0 10px 0 0;
400
498
  }
401
499
  }
402
500
  /*! Recurrence-Editor component theme */
@@ -1,3 +1,8 @@
1
1
  @import 'ej2-base/styles/tailwind-definition.scss';
2
+ @import 'ej2-inputs/styles/numerictextbox/tailwind-definition.scss';
3
+ @import 'ej2-buttons/styles/button/tailwind-definition.scss';
4
+ @import 'ej2-buttons/styles/radio-button/tailwind-definition.scss';
5
+ @import 'ej2-calendars/styles/datepicker/tailwind-definition.scss';
6
+ @import 'ej2-dropdowns/styles/drop-down-list/tailwind-definition.scss';
2
7
  @import 'tailwind-definition.scss';
3
8
  @import 'all.scss';
@@ -21,6 +21,10 @@ $schedule-active-color: $brand-primary-font !default;
21
21
  $schedule-active-border-color: $brand-primary !default;
22
22
  $schedule-active-font-color: lighten($brand-primary, 15%) !default;
23
23
  $schedule-current-day-active-color: $schedule-active-color !default;
24
+ $schedule-calendar-background: none !default;
25
+ $schedule-calendar-shadow: none !default;
26
+ $schedule-time-cells-font-color: $schedule-secondary-content-font-color !default;
27
+ $schedule-time-cells-bg-color: $schedule-header-bg-color !default;
24
28
 
25
29
  $schedule-timezone-enable-nrml-height: 60px !default;
26
30
  $schedule-timezone-enable-bgr-height: 70px !default;
@@ -46,6 +50,9 @@ $schedule-date-month-header-wrap-bgr-font-size: 14px !default;
46
50
  $schedule-date-header-wrap-nrml-font-size: 13px !default;
47
51
  $schedule-date-header-wrap-bgr-font-size: 14px !default;
48
52
  $schedule-date-header-wrap-device-font-size: 14px !default;
53
+ $schedule-month-date-header-cell-font-size: none !default;
54
+ $schedule-month-date-header-cell-text-align: left !default;
55
+ $schedule-month-date-header-cell-text-transform: none !default;
49
56
 
50
57
  $schedule-appointment-bg-color: $brand-primary !default;
51
58
  $schedule-appointment-details-padding: 0 4px !default;
@@ -65,6 +72,8 @@ $schedule-timescale-appointment-height: 54px !default;
65
72
  $schedule-header-day-nrml-font-size: 13px !default;
66
73
  $schedule-header-day-bgr-font-size: 14px !default;
67
74
  $schedule-header-day-device-font-size: 14px !default;
75
+ $schedule-header-day-line-height: unset !default;
76
+ $schedule-header-day-padding-bottom: 0 !default;
68
77
  $schedule-header-date-device-font-size: 20px !default;
69
78
  $schedule-header-date-nrml-font-size: 18px !default;
70
79
  $schedule-header-date-bgr-font-size: 20px !default;
@@ -77,6 +86,8 @@ $schedule-current-time-bgr-device-font-size: 9px !default;
77
86
  $schedule-popup-header-icon-font-size: 11px !default;
78
87
  $schedule-time-scale-width: 85px !default;
79
88
  $schedule-device-time-scale-width: 35px !default;
89
+ $schedule-header-date-line-height: unset !default;
90
+ $schedule-header-padding-top: 0 !default;
80
91
 
81
92
  $schedule-vertical-work-cells-border: 0 0 1px 1px !default;
82
93
  $schedule-rtl-vertical-work-cells-border: 0 1px 1px 0 !default;
@@ -91,12 +102,14 @@ $schedule-agenda-date-header-padding: 10px 32px 0 16px !default;
91
102
  $schedule-recurrence-font-size: 11px !default;
92
103
  $schedule-agenda-item-padding: 10px 0 !default;
93
104
  $schedule-agenda-appointment-padding: 0 8px !default;
105
+ $schedule-agenda-big-appointment-padding: $schedule-agenda-appointment-padding !default;
94
106
  $schedule-month-agenda-appointment-padding: 0 8px !default;
95
107
  $schedule-month-agenda-item-padding: 10px 0 !default;
96
108
  $schedule-popup-content-padding: 38px 18px 12px !default;
97
109
  $schedule-popup-footer-padding: 8px 18px 8px 22px !default;
98
110
  $schedule-date-header-line-height: 20px !default;
99
111
  $schedule-date-header-margin: 3px 3px 2px !default;
112
+ $schedule-date-header-margin-rtl: $schedule-date-header-margin !default;
100
113
 
101
114
  $schedule-tbar-bgr-min-height: 56px !default;
102
115
  $schedule-tbar-border-bottom-size: 1px solid $grey-99 !default;
@@ -104,7 +117,7 @@ $schedule-tbar-box-shadow: none !default;
104
117
  $schedule-tbar-box-shadow-bottom-margin: 0 !default;
105
118
  $schedule-tbar-min-height: 43px !default;
106
119
  $schedule-tbar-down-arrow-font-size: 12px !default;
107
- $schedule-tbar-down-arrow-padding-top: 0 !default;
120
+ $schedule-tbar-down-arrow-margin-top: 0 !default;
108
121
  $schedule-tbar-default-icon-color: $grey-light-font !default;
109
122
  $schedule-tbar-separator-size: $border-size !default;
110
123
  $schedule-tbar-default-bg: $grey-darker !default;
@@ -124,7 +137,7 @@ $schedule-tbar-btn-icon-bgr-width: 24px !default;
124
137
  $schedule-tbar-btn-bgr-mrgn: 4px 0 !default;
125
138
  $schedule-tbar-btn-bgr-minheight: 34px !default;
126
139
  $schedule-tbar-btn-bgr-minwidth: 34px !default;
127
- $schedule-tbar-btn-bgr-padding: 0 1.5px !default;
140
+ $schedule-tbar-btn-bgr-padding: 1px 7px !default;
128
141
  $schedule-tbar-btn-icn-bgr-padding: 0 !default;
129
142
  $schedule-tbar-btn-icn-right-bgr-padding: 0 !default;
130
143
 
@@ -153,6 +166,30 @@ $schedule-btn-txt-bgr-padding: 5px 12px !default;
153
166
  $schedule-icon-color: $grey-light-font !default;
154
167
  $schedule-popup-header-icon-focus-bg-color: $schedule-popup-icon-hover-bg-color !default;
155
168
  $schedule-popup-header-icon-focus-color: $schedule-popup-icon-hover-color !default;
169
+ $schedule-popup-icon-font-size: 18px !default;
170
+ $schedule-popup-icon-padding: 0 13px 0 0 !default;
171
+ $schedule-popup-footer-text-transform: capitalize !default;
172
+ $schedule-cell-popup-header-icon-padding: 0 !default;
173
+ $schedule-cell-popup-span-margin: 0 0 4px !default;
174
+ $schedule-cell-popup-subject-height: 40px !default;
175
+ $schedule-bgr-cell-popup-content-padding: $schedule-popup-content-padding !default;
176
+ $schedule-bgr-cell-popup-footer-padding: $schedule-popup-footer-padding !default;
177
+ $schedule-bgr-event-popup-header-icon-size: 2em !default;
178
+ $schedule-bgr-rtl-event-popup-date-time-icon-padding-right: 13px !default;
179
+ $schedule-device-event-popup-subject-padding: 12px 24px !default;
180
+ $schedule-event-popup-subject-color: $schedule-primary-content-font-color !default;
181
+ $schedule-event-popup-subject-bg-color: $schedule-popup-title-color !default;
182
+ $schedule-event-popup-subject-border-left: 6px solid $schedule-appointment-bg-color !default;
183
+ $schedule-event-popup-subject-padding: 8px 0 8px 10px !default;
184
+ $schedule-event-popup-subject-border-radius: $schedule-more-popup-wrapper-border-radius !default;
185
+ $schedule-event-popup-footer-display: block !default;
186
+ $schedule-event-popup-header-bg-color: $schedule-popup-bg-color !default;
187
+ $schedule-event-popup-header-icon-display: none !default;
188
+ $schedule-event-popup-header-close-icon-position: relative !default;
189
+ $schedule-event-popup-header-close-icon-right: 2px !default;
190
+ $schedule-multiple-event-popup-icon-bg-color: transparent !default;
191
+ $schedule-multiple-event-popup-icon-color: $schedule-primary-content-font-color !default;
192
+ $schedule-multiple-event-popup-subject-padding: 0 5px 0 8px !default;
156
193
 
157
194
  $schedule-event-box-shadow-1: 0 6px 10px 0 rgba($shadow, .14) !default;
158
195
  $schedule-event-box-shadow-2: 0 1px 18px 0 rgba($shadow, .12) !default;
@@ -165,7 +202,7 @@ $schedule-more-popup-close-margin-top: 3px !default;
165
202
  $schedule-more-popup-padding: 8px 0 !default;
166
203
  $schedule-more-appointment-margin-bottom: 2px !default;
167
204
  $schedule-event-popup-header-icon-padding: 5px 5px 2px !default;
168
- $schedule-event-popup-subject-padding: 0 18px 8px !default;
205
+ $schedule-event-popup-subject-wrap-padding: 0 18px 8px !default;
169
206
 
170
207
  $schedule-timeline-header-cells-height: 36px !default;
171
208
  $schedule-timeline-work-cells-height: 60px !default;
@@ -187,8 +224,10 @@ $schedule-dialog-all-day-row-padding-bottom: 14px !default;
187
224
  $schedule-bigger-dialog-row-continer-padding-bottom: 12px !default;
188
225
  $schedule-bigger-dialog-all-day-row-padding-top: 10px !default;
189
226
  $schedule-device-dialog-all-day-row-padding-top: 20px !default;
227
+ $schedule-all-day-section-hover-color: $schedule-tbar-default-icon-color !default;
190
228
 
191
229
  $schedule-tree-bg-color: $content-bg-color !default;
230
+ $schedule-tree-font-color: $schedule-primary-content-font-color !default;
192
231
  $schedule-popup-overlay-bg-color: #383838 !default;
193
232
 
194
233
  $schedule-val-error-color: #f44336 !default;
@@ -198,9 +237,29 @@ $schedule-block-appointment-bg-color: rgba(255, 255, 255, .08) !default;
198
237
  $schedule-block-appointment-font-color: #969696 !default;
199
238
 
200
239
  $schedule-resource-color-margin-top: 6px !default;
201
- $schedule-bigger-resource-color-margin-top: 12px !default;
240
+ $schedule-bigger-resource-color-margin-top: 10px !default;
202
241
  $schedule-resource-color-size: 14px !default;
203
242
  $schedule-bigger-resource-color-size: 16px !default;
243
+ $schedule-resource-tree-text-content-padding: 0 0 0 12px !default;
244
+
245
+ $schedule-tip-content-padding: 3px 6px !default;
246
+ $schedule-time-cells-border-bottom-color: $schedule-content-border-color !default;
247
+ $schedule-current-day-font-weight: normal !default;
248
+ $schedule-selected-cell-hover-font-color: $schedule-hover-font-color !default;
249
+ $schedule-work-cell-hover-color: $schedule-hover-font-color !default;
250
+ $schedule-current-date-header-font-color: $schedule-active-color !default;
251
+ $schedule-selected-date-header-cell-font-color: none !default;
252
+ $schedule-appointment-detail-line-height: unset !default;
253
+ $schedule-timeline-header-time-slots-bg: $schedule-header-bg-color !default;
254
+ $schedule-agenda-subject-wrap-margin-bottom: 0 !default;
255
+ $schedule-bigger-tbar-btn-font-size: $schedule-date-navigation-font-size !default;
256
+ $schedule-more-event-close-icon-font-size: 9px !default;
257
+ $schedule-tbar-btn-icn-right-bgr-padding-top: 0 !default;
258
+ $schedule-following-events-dlg-padding: 15px !default;
259
+ $schedule-header-icon-wrapper-bg-color: $schedule-content-bg-color !default;
260
+ $schedule-bgr-date-time-icon-padding-right: 13px !default;
261
+ $schedule-bgr-more-event-close-icon-padding: unset !default;
262
+ $schedule-bgr-tbar-btn-text-font-size: $schedule-header-nrml-font-size !default;
204
263
 
205
264
  @mixin tbar-btn-animation {
206
265
  content: '';