@syncfusion/ej2-calendars 27.2.3 → 28.1.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (137) hide show
  1. package/README.md +2 -2
  2. package/dist/ej2-calendars.min.js +2 -2
  3. package/dist/ej2-calendars.umd.min.js +2 -2
  4. package/dist/global/ej2-calendars.min.js +2 -2
  5. package/dist/global/index.d.ts +2 -2
  6. package/package.json +11 -11
  7. package/styles/bds-lite.css +2546 -0
  8. package/styles/bds-lite.scss +19 -0
  9. package/styles/bds.css +3965 -0
  10. package/styles/bds.scss +24 -0
  11. package/styles/bootstrap-dark-lite.css +8 -2
  12. package/styles/bootstrap-dark.css +9 -3
  13. package/styles/bootstrap-lite.css +7 -1
  14. package/styles/bootstrap.css +8 -2
  15. package/styles/bootstrap4-lite.css +7 -1
  16. package/styles/bootstrap4.css +8 -2
  17. package/styles/bootstrap5-dark-lite.css +7 -1
  18. package/styles/bootstrap5-dark.css +8 -2
  19. package/styles/bootstrap5-lite.css +7 -1
  20. package/styles/bootstrap5.3-lite.css +8 -2
  21. package/styles/bootstrap5.3.css +9 -3
  22. package/styles/bootstrap5.css +8 -2
  23. package/styles/calendar/_bigger.scss +22 -8
  24. package/styles/calendar/_fluent2-definition.scss +8 -4
  25. package/styles/calendar/_layout.scss +19 -2
  26. package/styles/calendar/_tailwind3-definition.scss +262 -0
  27. package/styles/calendar/_theme.scss +101 -23
  28. package/styles/calendar/bds.css +1365 -0
  29. package/styles/calendar/bds.scss +6 -0
  30. package/styles/calendar/bootstrap-dark.css +2 -2
  31. package/styles/calendar/bootstrap.css +2 -2
  32. package/styles/calendar/bootstrap4.css +2 -2
  33. package/styles/calendar/bootstrap5-dark.css +2 -2
  34. package/styles/calendar/bootstrap5.3.css +2 -2
  35. package/styles/calendar/bootstrap5.css +2 -2
  36. package/styles/calendar/fabric-dark.css +2 -2
  37. package/styles/calendar/fabric.css +2 -2
  38. package/styles/calendar/fluent-dark.css +2 -2
  39. package/styles/calendar/fluent.css +2 -2
  40. package/styles/calendar/fluent2.css +11 -7
  41. package/styles/calendar/highcontrast-light.css +2 -2
  42. package/styles/calendar/highcontrast.css +2 -2
  43. package/styles/calendar/icons/_tailwind3.scss +13 -0
  44. package/styles/calendar/material-dark.css +2 -2
  45. package/styles/calendar/material.css +2 -2
  46. package/styles/calendar/material3-dark.css +2 -2
  47. package/styles/calendar/material3.css +2 -2
  48. package/styles/calendar/tailwind-dark.css +2 -2
  49. package/styles/calendar/tailwind.css +2 -2
  50. package/styles/calendar/tailwind3.css +1243 -0
  51. package/styles/calendar/tailwind3.scss +6 -0
  52. package/styles/datepicker/_bootstrap-dark-definition.scss +1 -1
  53. package/styles/datepicker/_bootstrap5.3-definition.scss +1 -1
  54. package/styles/datepicker/_tailwind3-definition.scss +108 -0
  55. package/styles/datepicker/bds.css +603 -0
  56. package/styles/datepicker/bds.scss +8 -0
  57. package/styles/datepicker/bootstrap-dark.css +1 -1
  58. package/styles/datepicker/bootstrap5.3.css +1 -1
  59. package/styles/datepicker/fluent2.css +4 -0
  60. package/styles/datepicker/icons/_tailwind3.scss +52 -0
  61. package/styles/datepicker/tailwind3.css +456 -0
  62. package/styles/datepicker/tailwind3.scss +8 -0
  63. package/styles/daterangepicker/_bigger.scss +1 -1
  64. package/styles/daterangepicker/_fluent2-definition.scss +5 -1
  65. package/styles/daterangepicker/_layout.scss +19 -3
  66. package/styles/daterangepicker/_tailwind3-definition.scss +308 -0
  67. package/styles/daterangepicker/_theme.scss +27 -14
  68. package/styles/daterangepicker/bds.css +1605 -0
  69. package/styles/daterangepicker/bds.scss +8 -0
  70. package/styles/daterangepicker/fluent2.css +9 -1
  71. package/styles/daterangepicker/icons/_tailwind3.scss +74 -0
  72. package/styles/daterangepicker/tailwind3.css +1448 -0
  73. package/styles/daterangepicker/tailwind3.scss +8 -0
  74. package/styles/datetimepicker/_layout.scss +7 -0
  75. package/styles/datetimepicker/_tailwind3-definition.scss +70 -0
  76. package/styles/datetimepicker/_theme.scss +27 -2
  77. package/styles/datetimepicker/bds.css +437 -0
  78. package/styles/datetimepicker/bds.scss +9 -0
  79. package/styles/datetimepicker/bootstrap-dark.css +6 -0
  80. package/styles/datetimepicker/bootstrap.css +6 -0
  81. package/styles/datetimepicker/bootstrap4.css +6 -0
  82. package/styles/datetimepicker/bootstrap5-dark.css +6 -0
  83. package/styles/datetimepicker/bootstrap5.3.css +6 -0
  84. package/styles/datetimepicker/bootstrap5.css +6 -0
  85. package/styles/datetimepicker/fabric-dark.css +6 -0
  86. package/styles/datetimepicker/fabric.css +6 -0
  87. package/styles/datetimepicker/fluent-dark.css +6 -0
  88. package/styles/datetimepicker/fluent.css +6 -0
  89. package/styles/datetimepicker/fluent2.css +8 -0
  90. package/styles/datetimepicker/highcontrast-light.css +6 -0
  91. package/styles/datetimepicker/highcontrast.css +6 -0
  92. package/styles/datetimepicker/icons/_tailwind3.scss +11 -0
  93. package/styles/datetimepicker/material-dark.css +6 -0
  94. package/styles/datetimepicker/material.css +6 -0
  95. package/styles/datetimepicker/material3-dark.css +6 -0
  96. package/styles/datetimepicker/material3.css +6 -0
  97. package/styles/datetimepicker/tailwind-dark.css +6 -0
  98. package/styles/datetimepicker/tailwind.css +6 -0
  99. package/styles/datetimepicker/tailwind3.css +260 -0
  100. package/styles/datetimepicker/tailwind3.scss +9 -0
  101. package/styles/fabric-dark-lite.css +7 -1
  102. package/styles/fabric-dark.css +8 -2
  103. package/styles/fabric-lite.css +7 -1
  104. package/styles/fabric.css +8 -2
  105. package/styles/fluent-dark-lite.css +7 -1
  106. package/styles/fluent-dark.css +8 -2
  107. package/styles/fluent-lite.css +7 -1
  108. package/styles/fluent.css +8 -2
  109. package/styles/fluent2-lite.css +18 -2
  110. package/styles/fluent2.css +24 -8
  111. package/styles/highcontrast-light-lite.css +7 -1
  112. package/styles/highcontrast-light.css +8 -2
  113. package/styles/highcontrast-lite.css +7 -1
  114. package/styles/highcontrast.css +8 -2
  115. package/styles/material-dark-lite.css +7 -1
  116. package/styles/material-dark.css +8 -2
  117. package/styles/material-lite.css +7 -1
  118. package/styles/material.css +8 -2
  119. package/styles/material3-dark-lite.css +7 -1
  120. package/styles/material3-dark.css +8 -2
  121. package/styles/material3-lite.css +7 -1
  122. package/styles/material3.css +8 -2
  123. package/styles/tailwind-dark-lite.css +7 -1
  124. package/styles/tailwind-dark.css +8 -2
  125. package/styles/tailwind-lite.css +7 -1
  126. package/styles/tailwind.css +8 -2
  127. package/styles/tailwind3-lite.css +2384 -0
  128. package/styles/tailwind3-lite.scss +19 -0
  129. package/styles/tailwind3.css +3701 -0
  130. package/styles/tailwind3.scss +24 -0
  131. package/styles/timepicker/_tailwind3-definition.scss +92 -0
  132. package/styles/timepicker/_theme.scss +26 -1
  133. package/styles/timepicker/bds.css +470 -0
  134. package/styles/timepicker/bds.scss +7 -0
  135. package/styles/timepicker/icons/_tailwind3.scss +24 -0
  136. package/styles/timepicker/tailwind3.css +351 -0
  137. package/styles/timepicker/tailwind3.scss +7 -0
@@ -48,6 +48,12 @@
48
48
  margin: 0;
49
49
  }
50
50
 
51
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
52
+ -webkit-box-align: normal;
53
+ -ms-flex-align: normal;
54
+ align-items: normal;
55
+ }
56
+
51
57
  .e-datetime-mob-popup-wrap {
52
58
  -webkit-box-align: center;
53
59
  -ms-flex-align: center;
@@ -48,6 +48,12 @@
48
48
  margin: 0;
49
49
  }
50
50
 
51
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
52
+ -webkit-box-align: normal;
53
+ -ms-flex-align: normal;
54
+ align-items: normal;
55
+ }
56
+
51
57
  .e-datetime-mob-popup-wrap {
52
58
  -webkit-box-align: center;
53
59
  -ms-flex-align: center;
@@ -49,6 +49,12 @@
49
49
  margin: 0;
50
50
  }
51
51
 
52
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
53
+ -webkit-box-align: normal;
54
+ -ms-flex-align: normal;
55
+ align-items: normal;
56
+ }
57
+
52
58
  .e-datetime-mob-popup-wrap {
53
59
  -webkit-box-align: center;
54
60
  -ms-flex-align: center;
@@ -49,6 +49,12 @@
49
49
  margin: 0;
50
50
  }
51
51
 
52
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
53
+ -webkit-box-align: normal;
54
+ -ms-flex-align: normal;
55
+ align-items: normal;
56
+ }
57
+
52
58
  .e-datetime-mob-popup-wrap {
53
59
  -webkit-box-align: center;
54
60
  -ms-flex-align: center;
@@ -215,6 +215,8 @@
215
215
  .e-datetime-wrapper .e-clear-icon {
216
216
  -webkit-box-sizing: content-box;
217
217
  box-sizing: content-box;
218
+ -webkit-box-sizing: border-box;
219
+ box-sizing: border-box;
218
220
  }
219
221
  .e-datetime-wrapper span {
220
222
  cursor: pointer;
@@ -234,6 +236,12 @@
234
236
  margin: 0;
235
237
  }
236
238
 
239
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
240
+ -webkit-box-align: normal;
241
+ -ms-flex-align: normal;
242
+ align-items: normal;
243
+ }
244
+
237
245
  .e-datetime-mob-popup-wrap {
238
246
  -webkit-box-align: center;
239
247
  -ms-flex-align: center;
@@ -48,6 +48,12 @@
48
48
  margin: 0;
49
49
  }
50
50
 
51
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
52
+ -webkit-box-align: normal;
53
+ -ms-flex-align: normal;
54
+ align-items: normal;
55
+ }
56
+
51
57
  .e-datetime-mob-popup-wrap {
52
58
  -webkit-box-align: center;
53
59
  -ms-flex-align: center;
@@ -48,6 +48,12 @@
48
48
  margin: 0;
49
49
  }
50
50
 
51
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
52
+ -webkit-box-align: normal;
53
+ -ms-flex-align: normal;
54
+ align-items: normal;
55
+ }
56
+
51
57
  .e-datetime-mob-popup-wrap {
52
58
  -webkit-box-align: center;
53
59
  -ms-flex-align: center;
@@ -0,0 +1,11 @@
1
+ @include export-module('datetimepicker-tailwind3-icons') {
2
+
3
+ /*! component icons */
4
+ .e-datetime-wrapper {
5
+
6
+ #{if(&, '&', '*')} .e-time-icon.e-icons::before {
7
+ content: '\e705';
8
+ font-family: 'e-icons';
9
+ }
10
+ }
11
+ }
@@ -82,6 +82,12 @@
82
82
  margin: 0 6px 4px 0;
83
83
  }
84
84
 
85
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
86
+ -webkit-box-align: normal;
87
+ -ms-flex-align: normal;
88
+ align-items: normal;
89
+ }
90
+
85
91
  .e-datetime-mob-popup-wrap {
86
92
  -webkit-box-align: center;
87
93
  -ms-flex-align: center;
@@ -111,6 +111,12 @@
111
111
  margin: 0 6px 4px 0;
112
112
  }
113
113
 
114
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
115
+ -webkit-box-align: normal;
116
+ -ms-flex-align: normal;
117
+ align-items: normal;
118
+ }
119
+
114
120
  .e-datetime-mob-popup-wrap {
115
121
  -webkit-box-align: center;
116
122
  -ms-flex-align: center;
@@ -88,6 +88,12 @@
88
88
  margin: 0;
89
89
  }
90
90
 
91
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
92
+ -webkit-box-align: normal;
93
+ -ms-flex-align: normal;
94
+ align-items: normal;
95
+ }
96
+
91
97
  .e-datetime-mob-popup-wrap {
92
98
  -webkit-box-align: center;
93
99
  -ms-flex-align: center;
@@ -90,6 +90,12 @@
90
90
  margin: 0;
91
91
  }
92
92
 
93
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
94
+ -webkit-box-align: normal;
95
+ -ms-flex-align: normal;
96
+ align-items: normal;
97
+ }
98
+
93
99
  .e-datetime-mob-popup-wrap {
94
100
  -webkit-box-align: center;
95
101
  -ms-flex-align: center;
@@ -49,6 +49,12 @@
49
49
  margin: 0;
50
50
  }
51
51
 
52
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
53
+ -webkit-box-align: normal;
54
+ -ms-flex-align: normal;
55
+ align-items: normal;
56
+ }
57
+
52
58
  .e-datetime-mob-popup-wrap {
53
59
  -webkit-box-align: center;
54
60
  -ms-flex-align: center;
@@ -49,6 +49,12 @@
49
49
  margin: 0;
50
50
  }
51
51
 
52
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
53
+ -webkit-box-align: normal;
54
+ -ms-flex-align: normal;
55
+ align-items: normal;
56
+ }
57
+
52
58
  .e-datetime-mob-popup-wrap {
53
59
  -webkit-box-align: center;
54
60
  -ms-flex-align: center;
@@ -0,0 +1,260 @@
1
+
2
+
3
+
4
+
5
+ /* stylelint-disable property-no-vendor-prefix */
6
+ /* stylelint-disable */
7
+ .e-filled.e-float-input.e-error label.e-float-text,
8
+ .e-filled.e-float-input.e-control-wrapper.e-error label.e-float-text,
9
+ .e-filled.e-float-input.e-error input:focus ~ label.e-float-text,
10
+ .e-filled.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
11
+ .e-filled.e-float-input.e-error textarea:focus ~ label.e-float-text,
12
+ .e-filled.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text,
13
+ .e-filled.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
14
+ .e-filled.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text {
15
+ color: var(--color-sf-danger) !important;
16
+ }
17
+
18
+ /* stylelint-disable-line no-empty-source */
19
+ /*! component icons */
20
+ .e-datetime-wrapper .e-time-icon.e-icons::before {
21
+ content: "\e705";
22
+ font-family: "e-icons";
23
+ }
24
+
25
+ .e-input-group.e-control-wrapper.e-datetime-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
26
+ .e-float-input.e-control-wrapper.e-input-group.e-datetime-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
27
+ display: -webkit-box;
28
+ display: -ms-flexbox;
29
+ display: flex;
30
+ }
31
+
32
+ .e-datetime-wrapper {
33
+ /* stylelint-disable property-no-vendor-prefix */
34
+ -webkit-tap-highlight-color: transparent;
35
+ }
36
+ .e-datetime-wrapper .e-time-icon.e-icons::before {
37
+ font-size: 16px;
38
+ }
39
+ .e-datetime-wrapper.e-control-wrapper {
40
+ -webkit-box-sizing: border-box;
41
+ box-sizing: border-box;
42
+ }
43
+ .e-datetime-wrapper .e-time-icon.e-icons.e-disabled, .e-datetime-wrapper .e-date-icon.e-icons.e-disabled {
44
+ pointer-events: none;
45
+ }
46
+ .e-datetime-wrapper .e-clear-icon {
47
+ -webkit-box-sizing: content-box;
48
+ box-sizing: content-box;
49
+ }
50
+ .e-datetime-wrapper span {
51
+ cursor: pointer;
52
+ }
53
+ .e-datetime-wrapper .e-input-group-icon.e-date-icon, .e-datetime-wrapper .e-input-group-icon.e-time-icon {
54
+ font-size: 16px;
55
+ margin: 0;
56
+ outline: none;
57
+ }
58
+ .e-datetime-wrapper .e-input-group-icon.e-time-icon {
59
+ border: 0;
60
+ border-style: none;
61
+ margin: 0;
62
+ }
63
+
64
+ .e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon {
65
+ margin: 0;
66
+ }
67
+
68
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
69
+ -webkit-box-align: normal;
70
+ -ms-flex-align: normal;
71
+ align-items: normal;
72
+ }
73
+
74
+ .e-datetime-mob-popup-wrap {
75
+ -webkit-box-align: center;
76
+ -ms-flex-align: center;
77
+ align-items: center;
78
+ display: -webkit-box;
79
+ display: -ms-flexbox;
80
+ display: flex;
81
+ -webkit-box-orient: vertical;
82
+ -webkit-box-direction: normal;
83
+ -ms-flex-direction: column;
84
+ flex-direction: column;
85
+ height: 100%;
86
+ -webkit-box-pack: center;
87
+ -ms-flex-pack: center;
88
+ justify-content: center;
89
+ left: 0;
90
+ max-height: 100%;
91
+ position: fixed;
92
+ top: 0;
93
+ width: 100%;
94
+ z-index: 1002;
95
+ }
96
+ .e-datetime-mob-popup-wrap .e-datetimepicker.e-popup.e-lib.e-control.e-popup-open {
97
+ left: 0 !important; /* stylelint-disable-line declaration-no-important */
98
+ position: relative;
99
+ top: 0 !important; /* stylelint-disable-line declaration-no-important */
100
+ }
101
+
102
+ .e-datetimepicker.e-time-modal {
103
+ background-color: var(--color-sf-content-bg-color-alt2);
104
+ height: 100%;
105
+ left: 0;
106
+ opacity: 0.5;
107
+ pointer-events: auto;
108
+ position: fixed;
109
+ top: 0;
110
+ width: 100%;
111
+ z-index: 999;
112
+ }
113
+
114
+ .e-datetimepicker.e-popup {
115
+ border-style: solid;
116
+ border-width: 1px;
117
+ overflow: auto;
118
+ }
119
+ .e-datetimepicker.e-popup .e-content {
120
+ position: relative;
121
+ }
122
+ .e-datetimepicker.e-popup .e-list-parent.e-ul {
123
+ margin: 0;
124
+ padding: 8px 0;
125
+ }
126
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
127
+ color: var(--color-sf-content-text-color);
128
+ cursor: default;
129
+ font-size: 14px;
130
+ overflow: hidden;
131
+ position: relative;
132
+ text-overflow: ellipsis;
133
+ vertical-align: middle;
134
+ white-space: nowrap;
135
+ width: 100%;
136
+ }
137
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover {
138
+ cursor: pointer;
139
+ }
140
+
141
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
142
+ line-height: 30px;
143
+ text-indent: 12px;
144
+ }
145
+
146
+ .e-small .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
147
+ *.e-small.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
148
+ font-size: 12px;
149
+ line-height: 26px;
150
+ text-indent: 8px;
151
+ }
152
+
153
+ .e-small.e-datetime-wrapper .e-time-icon.e-icons::before,
154
+ *.e-small .e-datetime-wrapper .e-time-icon.e-icons::before {
155
+ font-size: 14px;
156
+ }
157
+ .e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker {
158
+ background-size: 250px 33px;
159
+ min-height: 33px;
160
+ }
161
+
162
+ .e-datetimepicker.e-popup-expand.e-popup {
163
+ position: fixed;
164
+ }
165
+ .e-datetimepicker.e-popup-expand.e-popup .e-datetime-mob-popup-wrap {
166
+ position: relative;
167
+ width: 100%;
168
+ }
169
+
170
+ /*! datetimepicker theme */
171
+ .e-datetime-wrapper .e-input-group-icon.e-icons.e-active {
172
+ color: var(--color-sf-content-text-color-pressed);
173
+ }
174
+ .e-datetime-wrapper.e-input-group:not(.e-disabled) .e-input-group-icon.e-active:active {
175
+ color: var(--color-sf-icon-color-pressed);
176
+ }
177
+
178
+ .e-datetimepicker.e-popup {
179
+ border: 1px solid var(--color-sf-border-light);
180
+ border-radius: 6px;
181
+ -webkit-box-shadow: none;
182
+ box-shadow: none;
183
+ }
184
+ .e-datetimepicker.e-popup .e-list-parent.e-ul {
185
+ background-color: var(--color-sf-content-bg-color);
186
+ }
187
+ .e-datetimepicker.e-popup .e-list-parent.e-ul li.e-list-item {
188
+ border: none;
189
+ color: var(--color-sf-content-text-color);
190
+ }
191
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover {
192
+ background: var(--color-sf-flyout-bg-color-hover);
193
+ color: var(--color-sf-flyout-text-color-hover);
194
+ }
195
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-navigation {
196
+ background: var(--color-sf-flyout-bg-color);
197
+ color: var(--color-sf-flyout-text-color);
198
+ -webkit-box-shadow: inset 0 0 0 2px var(--color-sf-primary);
199
+ box-shadow: inset 0 0 0 2px var(--color-sf-primary);
200
+ }
201
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item:focus {
202
+ background: var(--color-sf-flyout-bg-color-focus);
203
+ color: var(--color-sf-flyout-text-color-focus);
204
+ }
205
+ .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 {
206
+ background-color: var(--color-sf-flyout-bg-color-hover);
207
+ border: none;
208
+ color: var(--color-sf-flyout-text-color-hover);
209
+ }
210
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active {
211
+ background: var(--color-sf-flyout-bg-color-selected);
212
+ color: var(--color-sf-flyout-text-color-selected);
213
+ font-weight: 500;
214
+ }
215
+ .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active.e-hover {
216
+ background-color: var(--color-sf-flyout-bg-color-hover);
217
+ color: var(--color-sf-flyout-text-color-hover);
218
+ }
219
+
220
+ .e-bigger.e-datetime-wrapper .e-time-icon.e-icons::before,
221
+ *.e-bigger .e-datetime-wrapper .e-time-icon.e-icons::before {
222
+ font-size: 18px;
223
+ }
224
+ .e-bigger.e-datetime-wrapper .e-input-group-icon.e-time-icon,
225
+ *.e-bigger .e-datetime-wrapper .e-input-group-icon.e-time-icon {
226
+ margin: 0;
227
+ }
228
+
229
+ .e-bigger.e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon,
230
+ *.e-bigger .e-datetime-wrapper:not(.e-outline).e-rtl .e-input-group-icon.e-time-icon {
231
+ margin: 0;
232
+ }
233
+
234
+ .e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul,
235
+ *.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul {
236
+ padding: 8px 0;
237
+ }
238
+ .e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
239
+ *.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
240
+ font-size: 16px;
241
+ line-height: 32px;
242
+ text-indent: 16px;
243
+ }
244
+
245
+ .e-bigger .e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker,
246
+ .e-bigger.e-content-placeholder.e-datetimepicker.e-placeholder-datetimepicker {
247
+ background-size: 250px 40px;
248
+ min-height: 40px;
249
+ }
250
+
251
+ .e-small.e-bigger.e-datetime-wrapper .e-time-icon.e-icons::before,
252
+ *.e-small.e-bigger .e-datetime-wrapper .e-time-icon.e-icons::before {
253
+ font-size: 16px;
254
+ }
255
+ .e-small.e-bigger .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item,
256
+ *.e-small.e-bigger.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item {
257
+ font-size: 14px;
258
+ line-height: 30px;
259
+ text-indent: 16px;
260
+ }
@@ -0,0 +1,9 @@
1
+ @import 'ej2-base/styles/definition/tailwind3.scss';
2
+ @import 'ej2-inputs/styles/input/tailwind3-definition.scss';
3
+ @import 'ej2-popups/styles/popup/tailwind3-definition.scss';
4
+ @import 'ej2-buttons/styles/button/tailwind3-definition.scss';
5
+ @import '../datepicker/tailwind3-definition.scss';
6
+ @import 'tailwind3-definition.scss';
7
+ @import 'icons/tailwind3.scss';
8
+ @import 'all.scss';
9
+ @import 'bigger.scss';
@@ -290,6 +290,7 @@ ejs-calendar {
290
290
  .e-calendar .e-footer-container {
291
291
  background-color: transparent;
292
292
  border-top: none;
293
+ text-align: center;
293
294
  cursor: default;
294
295
  display: -webkit-box;
295
296
  display: -ms-flexbox;
@@ -302,7 +303,6 @@ ejs-calendar {
302
303
  -ms-flex-pack: end;
303
304
  justify-content: flex-end;
304
305
  padding: 10px 10px 10px 10px;
305
- text-align: center;
306
306
  width: 100%;
307
307
  }
308
308
  .e-small.e-calendar,
@@ -2119,6 +2119,12 @@ ejs-calendar {
2119
2119
  margin: 0;
2120
2120
  }
2121
2121
 
2122
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
2123
+ -webkit-box-align: normal;
2124
+ -ms-flex-align: normal;
2125
+ align-items: normal;
2126
+ }
2127
+
2122
2128
  .e-datetime-mob-popup-wrap {
2123
2129
  -webkit-box-align: center;
2124
2130
  -ms-flex-align: center;
@@ -290,6 +290,7 @@ ejs-calendar {
290
290
  .e-calendar .e-footer-container {
291
291
  background-color: transparent;
292
292
  border-top: none;
293
+ text-align: center;
293
294
  cursor: default;
294
295
  display: -webkit-box;
295
296
  display: -ms-flexbox;
@@ -302,7 +303,6 @@ ejs-calendar {
302
303
  -ms-flex-pack: end;
303
304
  justify-content: flex-end;
304
305
  padding: 10px 10px 10px 10px;
305
- text-align: center;
306
306
  width: 100%;
307
307
  }
308
308
  .e-small.e-calendar,
@@ -1173,6 +1173,7 @@ ejs-calendar {
1173
1173
  .e-bigger.e-small .e-calendar .e-footer-container {
1174
1174
  background-color: transparent;
1175
1175
  border-top: none;
1176
+ text-align: center;
1176
1177
  cursor: default;
1177
1178
  display: -webkit-box;
1178
1179
  display: -ms-flexbox;
@@ -1185,7 +1186,6 @@ ejs-calendar {
1185
1186
  -ms-flex-pack: end;
1186
1187
  justify-content: flex-end;
1187
1188
  padding: 10px 10px 10px 10px;
1188
- text-align: center;
1189
1189
  width: 100%;
1190
1190
  }
1191
1191
  .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3410,6 +3410,12 @@ ejs-calendar {
3410
3410
  margin: 0;
3411
3411
  }
3412
3412
 
3413
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
3414
+ -webkit-box-align: normal;
3415
+ -ms-flex-align: normal;
3416
+ align-items: normal;
3417
+ }
3418
+
3413
3419
  .e-datetime-mob-popup-wrap {
3414
3420
  -webkit-box-align: center;
3415
3421
  -ms-flex-align: center;
@@ -291,6 +291,7 @@ ejs-calendar {
291
291
  .e-calendar .e-footer-container {
292
292
  background-color: #fff;
293
293
  border-top: none;
294
+ text-align: center;
294
295
  cursor: default;
295
296
  display: -webkit-box;
296
297
  display: -ms-flexbox;
@@ -303,7 +304,6 @@ ejs-calendar {
303
304
  -ms-flex-pack: end;
304
305
  justify-content: flex-end;
305
306
  padding: 0 10px 10px 10px;
306
- text-align: center;
307
307
  width: 100%;
308
308
  }
309
309
  .e-small.e-calendar,
@@ -2123,6 +2123,12 @@ ejs-calendar {
2123
2123
  margin: 0;
2124
2124
  }
2125
2125
 
2126
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
2127
+ -webkit-box-align: normal;
2128
+ -ms-flex-align: normal;
2129
+ align-items: normal;
2130
+ }
2131
+
2126
2132
  .e-datetime-mob-popup-wrap {
2127
2133
  -webkit-box-align: center;
2128
2134
  -ms-flex-align: center;
package/styles/fabric.css CHANGED
@@ -291,6 +291,7 @@ ejs-calendar {
291
291
  .e-calendar .e-footer-container {
292
292
  background-color: #fff;
293
293
  border-top: none;
294
+ text-align: center;
294
295
  cursor: default;
295
296
  display: -webkit-box;
296
297
  display: -ms-flexbox;
@@ -303,7 +304,6 @@ ejs-calendar {
303
304
  -ms-flex-pack: end;
304
305
  justify-content: flex-end;
305
306
  padding: 0 10px 10px 10px;
306
- text-align: center;
307
307
  width: 100%;
308
308
  }
309
309
  .e-small.e-calendar,
@@ -1180,6 +1180,7 @@ ejs-calendar {
1180
1180
  .e-bigger.e-small .e-calendar .e-footer-container {
1181
1181
  background-color: #fff;
1182
1182
  border-top: none;
1183
+ text-align: center;
1183
1184
  cursor: default;
1184
1185
  display: -webkit-box;
1185
1186
  display: -ms-flexbox;
@@ -1192,7 +1193,6 @@ ejs-calendar {
1192
1193
  -ms-flex-pack: end;
1193
1194
  justify-content: flex-end;
1194
1195
  padding: 0 10px 10px 10px;
1195
- text-align: center;
1196
1196
  width: 100%;
1197
1197
  }
1198
1198
  .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3417,6 +3417,12 @@ ejs-calendar {
3417
3417
  margin: 0;
3418
3418
  }
3419
3419
 
3420
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
3421
+ -webkit-box-align: normal;
3422
+ -ms-flex-align: normal;
3423
+ align-items: normal;
3424
+ }
3425
+
3420
3426
  .e-datetime-mob-popup-wrap {
3421
3427
  -webkit-box-align: center;
3422
3428
  -ms-flex-align: center;
@@ -295,6 +295,7 @@ ejs-calendar {
295
295
  .e-calendar .e-footer-container {
296
296
  background-color: transparent;
297
297
  border-top: 0 solid #292827;
298
+ text-align: center;
298
299
  cursor: default;
299
300
  display: -webkit-box;
300
301
  display: -ms-flexbox;
@@ -307,7 +308,6 @@ ejs-calendar {
307
308
  -ms-flex-pack: end;
308
309
  justify-content: flex-end;
309
310
  padding: 8px;
310
- text-align: center;
311
311
  width: 100%;
312
312
  }
313
313
  .e-small.e-calendar,
@@ -2377,6 +2377,12 @@ ejs-calendar {
2377
2377
  margin: 0;
2378
2378
  }
2379
2379
 
2380
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
2381
+ -webkit-box-align: normal;
2382
+ -ms-flex-align: normal;
2383
+ align-items: normal;
2384
+ }
2385
+
2380
2386
  .e-datetime-mob-popup-wrap {
2381
2387
  -webkit-box-align: center;
2382
2388
  -ms-flex-align: center;
@@ -295,6 +295,7 @@ ejs-calendar {
295
295
  .e-calendar .e-footer-container {
296
296
  background-color: transparent;
297
297
  border-top: 0 solid #292827;
298
+ text-align: center;
298
299
  cursor: default;
299
300
  display: -webkit-box;
300
301
  display: -ms-flexbox;
@@ -307,7 +308,6 @@ ejs-calendar {
307
308
  -ms-flex-pack: end;
308
309
  justify-content: flex-end;
309
310
  padding: 8px;
310
- text-align: center;
311
311
  width: 100%;
312
312
  }
313
313
  .e-small.e-calendar,
@@ -1424,6 +1424,7 @@ ejs-calendar {
1424
1424
  .e-bigger.e-small .e-calendar .e-footer-container {
1425
1425
  background-color: transparent;
1426
1426
  border-top: 0 solid #292827;
1427
+ text-align: center;
1427
1428
  cursor: default;
1428
1429
  display: -webkit-box;
1429
1430
  display: -ms-flexbox;
@@ -1436,7 +1437,6 @@ ejs-calendar {
1436
1437
  -ms-flex-pack: end;
1437
1438
  justify-content: flex-end;
1438
1439
  padding: 8px;
1439
- text-align: center;
1440
1440
  width: 100%;
1441
1441
  }
1442
1442
  .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3810,6 +3810,12 @@ ejs-calendar {
3810
3810
  margin: 0;
3811
3811
  }
3812
3812
 
3813
+ .e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
3814
+ -webkit-box-align: normal;
3815
+ -ms-flex-align: normal;
3816
+ align-items: normal;
3817
+ }
3818
+
3813
3819
  .e-datetime-mob-popup-wrap {
3814
3820
  -webkit-box-align: center;
3815
3821
  -ms-flex-align: center;