@syncfusion/ej2-angular-calendars 23.2.7-ngcc → 24.1.41-ngcc

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 (109) hide show
  1. package/CHANGELOG.md +0 -30
  2. package/dist/ej2-angular-calendars.umd.js +1 -1
  3. package/dist/ej2-angular-calendars.umd.min.js +1 -1
  4. package/package.json +9 -9
  5. package/schematics/utils/lib-details.d.ts +2 -2
  6. package/schematics/utils/lib-details.js +2 -2
  7. package/schematics/utils/lib-details.ts +2 -2
  8. package/styles/bootstrap-dark.css +1 -2952
  9. package/styles/bootstrap.css +1 -2960
  10. package/styles/bootstrap4.css +1 -2988
  11. package/styles/bootstrap5-dark.css +1 -3118
  12. package/styles/bootstrap5.css +1 -3118
  13. package/styles/calendar/bootstrap-dark.css +1 -824
  14. package/styles/calendar/bootstrap.css +1 -825
  15. package/styles/calendar/bootstrap4.css +1 -825
  16. package/styles/calendar/bootstrap5-dark.css +1 -894
  17. package/styles/calendar/bootstrap5.css +1 -894
  18. package/styles/calendar/fabric-dark.css +1 -830
  19. package/styles/calendar/fabric.css +1 -835
  20. package/styles/calendar/fluent-dark.css +1 -1000
  21. package/styles/calendar/fluent.css +1 -1000
  22. package/styles/calendar/highcontrast-light.css +1 -825
  23. package/styles/calendar/highcontrast.css +1 -835
  24. package/styles/calendar/material-dark.css +1 -834
  25. package/styles/calendar/material.css +1 -835
  26. package/styles/calendar/material3-dark.css +1 -894
  27. package/styles/calendar/material3.css +1 -950
  28. package/styles/calendar/tailwind-dark.css +1 -927
  29. package/styles/calendar/tailwind.css +1 -927
  30. package/styles/datepicker/bootstrap-dark.css +1 -449
  31. package/styles/datepicker/bootstrap.css +1 -450
  32. package/styles/datepicker/bootstrap4.css +1 -462
  33. package/styles/datepicker/bootstrap5-dark.css +1 -460
  34. package/styles/datepicker/bootstrap5.css +1 -460
  35. package/styles/datepicker/fabric-dark.css +1 -442
  36. package/styles/datepicker/fabric.css +1 -443
  37. package/styles/datepicker/fluent-dark.css +1 -460
  38. package/styles/datepicker/fluent.css +1 -460
  39. package/styles/datepicker/highcontrast-light.css +1 -455
  40. package/styles/datepicker/highcontrast.css +1 -456
  41. package/styles/datepicker/material-dark.css +1 -491
  42. package/styles/datepicker/material.css +1 -500
  43. package/styles/datepicker/material3-dark.css +1 -539
  44. package/styles/datepicker/material3.css +1 -595
  45. package/styles/datepicker/tailwind-dark.css +1 -465
  46. package/styles/datepicker/tailwind.css +1 -465
  47. package/styles/daterangepicker/bootstrap-dark.css +1 -1177
  48. package/styles/daterangepicker/bootstrap.css +1 -1183
  49. package/styles/daterangepicker/bootstrap4.css +1 -1195
  50. package/styles/daterangepicker/bootstrap5-dark.css +1 -1257
  51. package/styles/daterangepicker/bootstrap5.css +1 -1257
  52. package/styles/daterangepicker/fabric-dark.css +1 -1177
  53. package/styles/daterangepicker/fabric.css +1 -1178
  54. package/styles/daterangepicker/fluent-dark.css +1 -1295
  55. package/styles/daterangepicker/fluent.css +1 -1295
  56. package/styles/daterangepicker/highcontrast-light.css +1 -1177
  57. package/styles/daterangepicker/highcontrast.css +1 -1178
  58. package/styles/daterangepicker/material-dark.css +1 -1215
  59. package/styles/daterangepicker/material.css +1 -1229
  60. package/styles/daterangepicker/material3-dark.css +1 -1325
  61. package/styles/daterangepicker/material3.css +1 -1381
  62. package/styles/daterangepicker/tailwind-dark.css +1 -1196
  63. package/styles/daterangepicker/tailwind.css +1 -1196
  64. package/styles/datetimepicker/bootstrap-dark.css +1 -190
  65. package/styles/datetimepicker/bootstrap.css +1 -190
  66. package/styles/datetimepicker/bootstrap4.css +1 -192
  67. package/styles/datetimepicker/bootstrap5-dark.css +1 -191
  68. package/styles/datetimepicker/bootstrap5.css +1 -191
  69. package/styles/datetimepicker/fabric-dark.css +1 -190
  70. package/styles/datetimepicker/fabric.css +1 -190
  71. package/styles/datetimepicker/fluent-dark.css +1 -191
  72. package/styles/datetimepicker/fluent.css +1 -191
  73. package/styles/datetimepicker/highcontrast-light.css +1 -190
  74. package/styles/datetimepicker/highcontrast.css +1 -190
  75. package/styles/datetimepicker/material-dark.css +1 -240
  76. package/styles/datetimepicker/material.css +1 -257
  77. package/styles/datetimepicker/material3-dark.css +1 -282
  78. package/styles/datetimepicker/material3.css +1 -338
  79. package/styles/datetimepicker/tailwind-dark.css +1 -191
  80. package/styles/datetimepicker/tailwind.css +1 -191
  81. package/styles/fabric-dark.css +1 -2951
  82. package/styles/fabric.css +1 -2958
  83. package/styles/fluent-dark.css +1 -3260
  84. package/styles/fluent.css +1 -3260
  85. package/styles/highcontrast-light.css +1 -2959
  86. package/styles/highcontrast.css +1 -2971
  87. package/styles/material-dark.css +1 -3130
  88. package/styles/material.css +1 -3179
  89. package/styles/material3-dark.css +1 -3441
  90. package/styles/material3.css +1 -3721
  91. package/styles/tailwind-dark.css +1 -3092
  92. package/styles/tailwind.css +1 -3092
  93. package/styles/timepicker/bootstrap-dark.css +1 -309
  94. package/styles/timepicker/bootstrap.css +1 -309
  95. package/styles/timepicker/bootstrap4.css +1 -311
  96. package/styles/timepicker/bootstrap5-dark.css +1 -312
  97. package/styles/timepicker/bootstrap5.css +1 -312
  98. package/styles/timepicker/fabric-dark.css +1 -309
  99. package/styles/timepicker/fabric.css +1 -309
  100. package/styles/timepicker/fluent-dark.css +1 -310
  101. package/styles/timepicker/fluent.css +1 -310
  102. package/styles/timepicker/highcontrast-light.css +1 -309
  103. package/styles/timepicker/highcontrast.css +1 -309
  104. package/styles/timepicker/material-dark.css +1 -347
  105. package/styles/timepicker/material.css +1 -355
  106. package/styles/timepicker/material3-dark.css +1 -398
  107. package/styles/timepicker/material3.css +1 -454
  108. package/styles/timepicker/tailwind-dark.css +1 -310
  109. package/styles/timepicker/tailwind.css +1 -310
@@ -1,257 +1 @@
1
- /* stylelint-disable property-no-vendor-prefix */
2
- @keyframes e-input-ripple {
3
- 100% {
4
- opacity: 0;
5
- transform: scale(4);
6
- }
7
- }
8
- @keyframes slideTopUp {
9
- from {
10
- transform: translate3d(0, 0, 0) scale(1);
11
- }
12
- to {
13
- transform: translate3d(0, 0, 0) scale(1);
14
- }
15
- }
16
- /*! component icons */
17
- .e-datetime-wrapper .e-time-icon.e-icons::before {
18
- content: "\e20c";
19
- font-family: "e-icons";
20
- }
21
-
22
- .e-datetime-wrapper.e-outline .e-input-group-icon.e-date-icon,
23
- .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-date-icon,
24
- .e-datetime-wrapper.e-outline .e-input-group-icon.e-time-icon,
25
- .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-time-icon {
26
- min-height: 0;
27
- min-width: 20px;
28
- }
29
-
30
- .e-bigger .e-datetime-wrapper.e-outline .e-input-group-icon.e-date-icon,
31
- .e-datetime-wrapper.e-control-wrapper.e-bigger.e-outline .e-input-group-icon.e-date-icon,
32
- .e-bigger .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-date-icon,
33
- .e-bigger .e-datetime-wrapper.e-outline .e-input-group-icon.e-time-icon,
34
- .e-datetime-wrapper.e-control-wrapper.e-bigger.e-outline .e-input-group-icon.e-time-icon,
35
- .e-bigger .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-time-icon {
36
- min-height: 0;
37
- min-width: 24px;
38
- }
39
-
40
- .e-small .e-datetime-wrapper.e-outline .e-input-group-icon.e-date-icon,
41
- .e-datetime-wrapper.e-control-wrapper.e-small.e-outline .e-input-group-icon.e-date-icon,
42
- .e-small .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-date-icon,
43
- .e-small .e-datetime-wrapper.e-outline .e-input-group-icon.e-time-icon,
44
- .e-datetime-wrapper.e-control-wrapper.e-small.e-outline .e-input-group-icon.e-time-icon,
45
- .e-small .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-time-icon {
46
- min-height: 0;
47
- min-width: 18px;
48
- }
49
-
50
- .e-bigger.e-small .e-outline.e-datetime-wrapper .e-input-group-icon.e-date-icon,
51
- .e-bigger.e-small.e-outline.e-datetime-wrapper .e-input-group-icon.e-date-icon,
52
- .e-datetime-wrapper.e-control-wrapper.e-bigger.e-small.e-outline .e-input-group-icon.e-date-icon,
53
- .e-bigger.e-small .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-date-icon,
54
- .e-bigger.e-small .e-outline.e-datetime-wrapper .e-input-group-icon.e-time-icon,
55
- .e-bigger.e-small.e-outline.e-datetime-wrapper .e-input-group-icon.e-time-icon,
56
- .e-datetime-wrapper.e-control-wrapper.e-bigger.e-small.e-outline .e-input-group-icon.e-time-icon,
57
- .e-bigger.e-small .e-datetime-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-time-icon {
58
- min-height: 0;
59
- min-width: 20px;
60
- }
61
-
62
- .e-datetime-wrapper.e-filled .e-input-group-icon.e-time-icon,
63
- .e-datetime-wrapper.e-control-wrapper.e-filled .e-input-group-icon.e-time-icon,
64
- .e-rtl.e-datetime-wrapper.e-filled .e-input-group-icon.e-time-icon,
65
- .e-rtl.e-datetime-wrapper.e-control-wrapper.e-filled .e-input-group-icon.e-time-icon,
66
- .e-rtl .e-datetime-wrapper.e-filled .e-input-group-icon.e-time-icon,
67
- .e-rtl .e-datetime-wrapper.e-control-wrapper.e-filled .e-input-group-icon.e-time-icon {
68
- margin: 0;
69
- }
70
-
71
- .e-input-group.e-control-wrapper.e-datetime-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
72
- .e-float-input.e-control-wrapper.e-input-group.e-datetime-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
73
- display: -ms-flexbox;
74
- display: flex;
75
- }
76
-
77
- .e-datetime-wrapper {
78
- /* stylelint-disable property-no-vendor-prefix */
79
- -webkit-tap-highlight-color: transparent;
80
- }
81
- .e-datetime-wrapper .e-time-icon.e-icons::before {
82
- font-size: 16px;
83
- }
84
- .e-datetime-wrapper.e-control-wrapper {
85
- box-sizing: border-box;
86
- }
87
- .e-datetime-wrapper .e-time-icon.e-icons.e-disabled, .e-datetime-wrapper .e-date-icon.e-icons.e-disabled {
88
- pointer-events: none;
89
- }
90
- .e-datetime-wrapper .e-clear-icon {
91
- box-sizing: content-box;
92
- }
93
- .e-datetime-wrapper span {
94
- cursor: pointer;
95
- }
96
- .e-datetime-wrapper .e-input-group-icon.e-date-icon, .e-datetime-wrapper .e-input-group-icon.e-time-icon {
97
- font-size: 16px;
98
- margin: 0 0 4px;
99
- min-height: 24px;
100
- min-width: 24px;
101
- outline: none;
102
- }
103
- .e-datetime-wrapper .e-input-group-icon.e-time-icon {
104
- border: 0;
105
- border-style: none;
106
- margin: 0 0 4px 6px;
107
- }
108
-
109
- .e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon {
110
- margin: 0 6px 4px 0;
111
- }
112
-
113
- .e-datetimepicker.e-time-modal {
114
- background-color: rgba(0, 0, 0, 0.6);
115
- height: 100%;
116
- left: 0;
117
- opacity: 0.5;
118
- pointer-events: auto;
119
- position: fixed;
120
- top: 0;
121
- width: 100%;
122
- z-index: 999;
123
- }
124
-
125
- .e-datetimepicker.e-popup {
126
- border-style: solid;
127
- border-width: 1px;
128
- overflow: auto;
129
- }
130
- .e-datetimepicker.e-popup .e-content {
131
- position: relative;
132
- }
133
- .e-datetimepicker.e-popup .e-list-parent.e-ul {
134
- margin: 0;
135
- padding: 8px 0;
136
- }
137
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
138
- color: rgba(0, 0, 0, 0.87);
139
- cursor: default;
140
- font-size: 13px;
141
- overflow: hidden;
142
- position: relative;
143
- text-overflow: ellipsis;
144
- vertical-align: middle;
145
- white-space: nowrap;
146
- width: 100%;
147
- }
148
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover {
149
- cursor: pointer;
150
- }
151
-
152
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
153
- line-height: 36px;
154
- text-indent: 16px;
155
- }
156
-
157
- .e-bigger.e-datetime-wrapper .e-time-icon.e-icons::before,
158
- *.e-bigger .e-datetime-wrapper .e-time-icon.e-icons::before {
159
- font-size: 18px;
160
- }
161
- .e-bigger.e-datetime-wrapper .e-input-group-icon.e-time-icon,
162
- *.e-bigger .e-datetime-wrapper .e-input-group-icon.e-time-icon {
163
- margin: 5px 0 6px 8px;
164
- min-height: 26px;
165
- min-width: 26px;
166
- }
167
-
168
- .e-bigger.e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon,
169
- *.e-bigger .e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon {
170
- margin: 5px 8px 6px 0;
171
- }
172
-
173
- .e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul,
174
- *.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul {
175
- padding: 8px 0;
176
- }
177
- .e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
178
- *.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
179
- font-size: 14px;
180
- line-height: 48px;
181
- text-indent: 16px;
182
- }
183
-
184
- .e-small .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
185
- *.e-small.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
186
- font-size: 12px;
187
- line-height: 26px;
188
- text-indent: 12px;
189
- }
190
-
191
- .e-small.e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
192
- *.e-small.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
193
- font-size: 13px;
194
- line-height: 40px;
195
- text-indent: 16px;
196
- }
197
-
198
- .e-small.e-datetime-wrapper .e-time-icon.e-icons::before,
199
- *.e-small .e-datetime-wrapper .e-time-icon.e-icons::before {
200
- font-size: 14px;
201
- }
202
- .e-small.e-bigger.e-datetime-wrapper .e-time-icon.e-icons::before,
203
- *.e-small.e-bigger .e-datetime-wrapper .e-time-icon.e-icons::before {
204
- font-size: 18px;
205
- }
206
- .e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker {
207
- background-size: 250px 33px;
208
- min-height: 33px;
209
- }
210
-
211
- .e-bigger .e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker,
212
- .e-bigger.e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker {
213
- background-size: 250px 40px;
214
- min-height: 40px;
215
- }
216
-
217
- .e-datetimepicker.e-popup-expand.e-popup {
218
- position: fixed;
219
- }
220
- .e-datetimepicker.e-popup-expand.e-popup .e-datetime-mob-popup-wrap {
221
- position: relative;
222
- width: 100%;
223
- }
224
-
225
- /*! datetimepicker theme */
226
- .e-datetime-wrapper .e-input-group-icon.e-icons.e-active {
227
- color: #e3165b;
228
- }
229
- .e-datetime-wrapper.e-input-group:not(.e-disabled) .e-input-group-icon.e-active:active {
230
- color: #e3165b;
231
- }
232
-
233
- .e-datetimepicker.e-popup {
234
- border: none;
235
- border-radius: 2px;
236
- box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
237
- }
238
- .e-datetimepicker.e-popup .e-list-parent.e-ul {
239
- background-color: #fff;
240
- }
241
- .e-datetimepicker.e-popup .e-list-parent.e-ul li.e-list-item {
242
- border: none;
243
- color: rgba(0, 0, 0, 0.87);
244
- }
245
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover, .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-navigation, .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item:focus {
246
- background-color: #eee;
247
- border: none;
248
- color: #000;
249
- }
250
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active {
251
- background-color: #eee;
252
- color: #e3165b;
253
- }
254
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active.e-hover {
255
- background-color: #eee;
256
- color: #e3165b;
257
- }
1
+ @import '@syncfusion/ej2-calendars/styles/datetimepicker/material.css';
@@ -1,282 +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
- /* stylelint-disable property-no-vendor-prefix */
57
- @keyframes e-input-ripple {
58
- 100% {
59
- opacity: 0;
60
- transform: scale(4);
61
- }
62
- }
63
- @keyframes slideTopUp {
64
- from {
65
- transform: translate3d(0, 0, 0) scale(1);
66
- }
67
- to {
68
- transform: translate3d(0, 0, 0) scale(1);
69
- }
70
- }
71
- /* stylelint-disable-line no-empty-source */
72
- /*! component icons */
73
- .e-datetime-wrapper .e-time-icon.e-icons::before {
74
- content: "\e705";
75
- font-family: "e-icons";
76
- }
77
-
78
- .e-input-group.e-control-wrapper.e-datetime-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
79
- .e-float-input.e-control-wrapper.e-input-group.e-datetime-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
80
- display: -ms-flexbox;
81
- display: flex;
82
- }
83
-
84
- .e-datetime-wrapper {
85
- /* stylelint-disable property-no-vendor-prefix */
86
- -webkit-tap-highlight-color: transparent;
87
- }
88
- .e-datetime-wrapper .e-time-icon.e-icons::before {
89
- font-size: 16px;
90
- }
91
- .e-datetime-wrapper.e-control-wrapper {
92
- box-sizing: border-box;
93
- }
94
- .e-datetime-wrapper .e-time-icon.e-icons.e-disabled, .e-datetime-wrapper .e-date-icon.e-icons.e-disabled {
95
- pointer-events: none;
96
- }
97
- .e-datetime-wrapper .e-clear-icon {
98
- box-sizing: content-box;
99
- }
100
- .e-datetime-wrapper span {
101
- cursor: pointer;
102
- }
103
- .e-datetime-wrapper .e-input-group-icon.e-date-icon, .e-datetime-wrapper .e-input-group-icon.e-time-icon {
104
- font-size: 16px;
105
- margin: 0;
106
- min-height: 30px;
107
- min-width: 30px;
108
- border-radius: 16px;
109
- outline: none;
110
- }
111
- .e-datetime-wrapper .e-input-group-icon.e-time-icon {
112
- border: 0;
113
- border-style: none;
114
- margin: 0;
115
- }
116
-
117
- .e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon {
118
- margin: 0;
119
- }
120
-
121
- .e-datetimepicker.e-time-modal {
122
- background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface));
123
- height: 100%;
124
- left: 0;
125
- opacity: 0.5;
126
- pointer-events: auto;
127
- position: fixed;
128
- top: 0;
129
- width: 100%;
130
- z-index: 999;
131
- }
132
-
133
- .e-datetimepicker.e-popup {
134
- border-style: solid;
135
- border-width: 1px;
136
- overflow: auto;
137
- }
138
- .e-datetimepicker.e-popup .e-content {
139
- position: relative;
140
- }
141
- .e-datetimepicker.e-popup .e-list-parent.e-ul {
142
- margin: 0;
143
- padding: 0;
144
- }
145
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
146
- color: rgba(var(--color-sf-on-surface));
147
- cursor: default;
148
- font-size: 13px;
149
- overflow: hidden;
150
- position: relative;
151
- text-overflow: ellipsis;
152
- vertical-align: middle;
153
- white-space: nowrap;
154
- width: 100%;
155
- }
156
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover {
157
- cursor: pointer;
158
- }
159
-
160
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
161
- line-height: 36px;
162
- text-indent: 16px;
163
- }
164
-
165
- .e-bigger.e-datetime-wrapper .e-time-icon.e-icons::before,
166
- *.e-bigger .e-datetime-wrapper .e-time-icon.e-icons::before {
167
- font-size: 20px;
168
- }
169
- .e-bigger.e-datetime-wrapper .e-input-group-icon.e-time-icon,
170
- *.e-bigger .e-datetime-wrapper .e-input-group-icon.e-time-icon {
171
- margin: 0;
172
- min-height: 38px;
173
- min-width: 38px;
174
- border-radius: 20px;
175
- }
176
-
177
- .e-bigger.e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon,
178
- *.e-bigger .e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon {
179
- margin: 0;
180
- }
181
-
182
- .e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul,
183
- *.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul {
184
- padding: 0;
185
- }
186
- .e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
187
- *.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
188
- font-size: 14px;
189
- line-height: 48px;
190
- text-indent: 16px;
191
- }
192
-
193
- .e-small .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
194
- *.e-small.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
195
- font-size: 12px;
196
- line-height: 26px;
197
- text-indent: 12px;
198
- }
199
-
200
- .e-small.e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
201
- *.e-small.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
202
- font-size: 13px;
203
- line-height: 40px;
204
- text-indent: 16px;
205
- }
206
-
207
- .e-small.e-datetime-wrapper .e-time-icon.e-icons::before,
208
- *.e-small .e-datetime-wrapper .e-time-icon.e-icons::before {
209
- font-size: 16px;
210
- }
211
- .e-small.e-datetime-wrapper .e-input-group-icon.e-time-icon,
212
- *.e-small .e-datetime-wrapper .e-input-group-icon.e-time-icon {
213
- min-height: 22px;
214
- min-width: 22px;
215
- border-radius: 14px;
216
- margin: 0;
217
- }
218
-
219
- .e-small.e-bigger.e-datetime-wrapper .e-time-icon.e-icons::before,
220
- *.e-small.e-bigger .e-datetime-wrapper .e-time-icon.e-icons::before {
221
- font-size: 20px;
222
- }
223
- .e-small.e-bigger.e-datetime-wrapper .e-input-group-icon.e-time-icon,
224
- *.e-small.e-bigger .e-datetime-wrapper .e-input-group-icon.e-time-icon {
225
- min-height: 34px;
226
- min-width: 34px;
227
- border-radius: 20px;
228
- margin: 0;
229
- }
230
-
231
- .e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker {
232
- background-size: 250px 33px;
233
- min-height: 33px;
234
- }
235
-
236
- .e-bigger .e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker,
237
- .e-bigger.e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker {
238
- background-size: 250px 40px;
239
- min-height: 40px;
240
- }
241
-
242
- .e-datetimepicker.e-popup-expand.e-popup {
243
- position: fixed;
244
- }
245
- .e-datetimepicker.e-popup-expand.e-popup .e-datetime-mob-popup-wrap {
246
- position: relative;
247
- width: 100%;
248
- }
249
-
250
- /*! datetimepicker theme */
251
- .e-datetime-wrapper .e-input-group-icon.e-icons.e-active {
252
- color: rgba(var(--color-sf-on-surface));
253
- }
254
- .e-datetime-wrapper.e-input-group:not(.e-disabled) .e-input-group-icon.e-active:active {
255
- color: rgba(var(--color-sf-on-surface));
256
- }
257
-
258
- .e-datetimepicker.e-popup {
259
- border: none;
260
- border-radius: 4px;
261
- box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
262
- }
263
- .e-datetimepicker.e-popup .e-list-parent.e-ul {
264
- background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
265
- }
266
- .e-datetimepicker.e-popup .e-list-parent.e-ul li.e-list-item {
267
- border: none;
268
- color: rgba(var(--color-sf-on-surface));
269
- }
270
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover, .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-navigation, .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item:focus {
271
- background: rgba(var(--color-sf-on-surface), 0.05);
272
- border: none;
273
- color: rgba(var(--color-sf-on-surface));
274
- }
275
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active {
276
- background: rgba(var(--color-sf-primary-container));
277
- color: rgba(var(--color-sf-on-surface));
278
- }
279
- .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active.e-hover {
280
- background: rgba(var(--color-sf-primary));
281
- color: rgba(var(--color-sf-on-primary));
282
- }
1
+ @import '@syncfusion/ej2-calendars/styles/datetimepicker/material3-dark.css';