@syncfusion/ej2-calendars 20.1.56 → 20.2.36

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 (134) hide show
  1. package/dist/ej2-calendars.umd.min.js +2 -2
  2. package/dist/ej2-calendars.umd.min.js.map +1 -1
  3. package/dist/es6/ej2-calendars.es2015.js +115 -14
  4. package/dist/es6/ej2-calendars.es2015.js.map +1 -1
  5. package/dist/es6/ej2-calendars.es5.js +117 -14
  6. package/dist/es6/ej2-calendars.es5.js.map +1 -1
  7. package/dist/global/ej2-calendars.min.js +2 -2
  8. package/dist/global/ej2-calendars.min.js.map +1 -1
  9. package/dist/global/index.d.ts +1 -1
  10. package/helpers/e2e/calendarHelper.js +86 -70
  11. package/helpers/e2e/datepickerHelper.js +95 -79
  12. package/helpers/e2e/daterangepickerHelper.js +128 -112
  13. package/helpers/e2e/datetimepickerHelper.js +125 -109
  14. package/helpers/e2e/index.js +12 -10
  15. package/helpers/e2e/timepickerHelper.js +62 -46
  16. package/package.json +10 -10
  17. package/src/calendar/calendar.js +4 -0
  18. package/src/datepicker/datepicker.d.ts +1 -0
  19. package/src/datepicker/datepicker.js +2 -0
  20. package/src/daterangepicker/daterangepicker.d.ts +2 -0
  21. package/src/daterangepicker/daterangepicker.js +62 -8
  22. package/src/maskbase/interface.d.ts +1 -0
  23. package/src/maskbase/masked-date-time.d.ts +2 -0
  24. package/src/maskbase/masked-date-time.js +49 -6
  25. package/styles/bootstrap-dark.css +96 -491
  26. package/styles/bootstrap.css +96 -491
  27. package/styles/bootstrap4.css +96 -493
  28. package/styles/bootstrap5-dark.css +97 -499
  29. package/styles/bootstrap5.css +97 -499
  30. package/styles/calendar/_fusionnew-definition.scss +224 -0
  31. package/styles/calendar/_material3-definition.scss +224 -0
  32. package/styles/calendar/bootstrap-dark.css +50 -238
  33. package/styles/calendar/bootstrap.css +50 -238
  34. package/styles/calendar/bootstrap4.css +50 -238
  35. package/styles/calendar/bootstrap5-dark.css +51 -246
  36. package/styles/calendar/bootstrap5.css +51 -246
  37. package/styles/calendar/fabric-dark.css +50 -237
  38. package/styles/calendar/fabric.css +50 -238
  39. package/styles/calendar/fluent-dark.css +56 -270
  40. package/styles/calendar/fluent.css +56 -270
  41. package/styles/calendar/highcontrast-light.css +50 -238
  42. package/styles/calendar/highcontrast.css +50 -238
  43. package/styles/calendar/icons/_fusionnew.scss +12 -0
  44. package/styles/calendar/icons/_material3.scss +12 -0
  45. package/styles/calendar/material-dark.css +50 -238
  46. package/styles/calendar/material.css +50 -238
  47. package/styles/calendar/tailwind-dark.css +53 -261
  48. package/styles/calendar/tailwind.css +53 -261
  49. package/styles/datepicker/_fusionnew-definition.scss +42 -0
  50. package/styles/datepicker/_material3-definition.scss +42 -0
  51. package/styles/datepicker/bootstrap-dark.css +7 -20
  52. package/styles/datepicker/bootstrap.css +7 -20
  53. package/styles/datepicker/bootstrap4.css +7 -21
  54. package/styles/datepicker/bootstrap5-dark.css +7 -20
  55. package/styles/datepicker/bootstrap5.css +7 -20
  56. package/styles/datepicker/fabric-dark.css +7 -20
  57. package/styles/datepicker/fabric.css +7 -20
  58. package/styles/datepicker/fluent-dark.css +7 -21
  59. package/styles/datepicker/fluent.css +7 -21
  60. package/styles/datepicker/highcontrast-light.css +7 -21
  61. package/styles/datepicker/highcontrast.css +7 -21
  62. package/styles/datepicker/icons/_fusionnew.scss +55 -0
  63. package/styles/datepicker/icons/_material3.scss +55 -0
  64. package/styles/datepicker/material-dark.css +7 -22
  65. package/styles/datepicker/material.css +7 -23
  66. package/styles/datepicker/tailwind-dark.css +7 -21
  67. package/styles/datepicker/tailwind.css +7 -21
  68. package/styles/daterangepicker/_fusionnew-definition.scss +223 -0
  69. package/styles/daterangepicker/_material3-definition.scss +223 -0
  70. package/styles/daterangepicker/bootstrap-dark.css +32 -184
  71. package/styles/daterangepicker/bootstrap.css +32 -184
  72. package/styles/daterangepicker/bootstrap4.css +32 -185
  73. package/styles/daterangepicker/bootstrap5-dark.css +32 -185
  74. package/styles/daterangepicker/bootstrap5.css +32 -185
  75. package/styles/daterangepicker/fabric-dark.css +32 -184
  76. package/styles/daterangepicker/fabric.css +32 -184
  77. package/styles/daterangepicker/fluent-dark.css +35 -188
  78. package/styles/daterangepicker/fluent.css +35 -188
  79. package/styles/daterangepicker/highcontrast-light.css +32 -184
  80. package/styles/daterangepicker/highcontrast.css +32 -184
  81. package/styles/daterangepicker/icons/_fusionnew.scss +67 -0
  82. package/styles/daterangepicker/icons/_material3.scss +67 -0
  83. package/styles/daterangepicker/material-dark.css +32 -185
  84. package/styles/daterangepicker/material.css +32 -186
  85. package/styles/daterangepicker/tailwind-dark.css +31 -178
  86. package/styles/daterangepicker/tailwind.css +31 -178
  87. package/styles/datetimepicker/_fusionnew-definition.scss +55 -0
  88. package/styles/datetimepicker/_material3-definition.scss +55 -0
  89. package/styles/datetimepicker/bootstrap-dark.css +7 -30
  90. package/styles/datetimepicker/bootstrap.css +7 -30
  91. package/styles/datetimepicker/bootstrap4.css +7 -30
  92. package/styles/datetimepicker/bootstrap5-dark.css +7 -30
  93. package/styles/datetimepicker/bootstrap5.css +7 -30
  94. package/styles/datetimepicker/fabric-dark.css +7 -30
  95. package/styles/datetimepicker/fabric.css +7 -30
  96. package/styles/datetimepicker/fluent-dark.css +7 -30
  97. package/styles/datetimepicker/fluent.css +7 -30
  98. package/styles/datetimepicker/highcontrast-light.css +7 -30
  99. package/styles/datetimepicker/highcontrast.css +7 -30
  100. package/styles/datetimepicker/icons/_fusionnew.scss +11 -0
  101. package/styles/datetimepicker/icons/_material3.scss +11 -0
  102. package/styles/datetimepicker/material-dark.css +7 -31
  103. package/styles/datetimepicker/material.css +7 -32
  104. package/styles/datetimepicker/tailwind-dark.css +7 -30
  105. package/styles/datetimepicker/tailwind.css +7 -30
  106. package/styles/fabric-dark.css +96 -490
  107. package/styles/fabric.css +96 -491
  108. package/styles/fluent-dark.css +105 -527
  109. package/styles/fluent.css +105 -527
  110. package/styles/highcontrast-light.css +96 -492
  111. package/styles/highcontrast.css +96 -492
  112. package/styles/material-dark.css +96 -496
  113. package/styles/material.css +96 -500
  114. package/styles/tailwind-dark.css +98 -509
  115. package/styles/tailwind.css +98 -509
  116. package/styles/timepicker/_fusionnew-definition.scss +52 -0
  117. package/styles/timepicker/_material3-definition.scss +52 -0
  118. package/styles/timepicker/bootstrap-dark.css +4 -22
  119. package/styles/timepicker/bootstrap.css +4 -22
  120. package/styles/timepicker/bootstrap4.css +4 -22
  121. package/styles/timepicker/bootstrap5-dark.css +4 -22
  122. package/styles/timepicker/bootstrap5.css +4 -22
  123. package/styles/timepicker/fabric-dark.css +4 -22
  124. package/styles/timepicker/fabric.css +4 -22
  125. package/styles/timepicker/fluent-dark.css +4 -22
  126. package/styles/timepicker/fluent.css +4 -22
  127. package/styles/timepicker/highcontrast-light.css +4 -22
  128. package/styles/timepicker/highcontrast.css +4 -22
  129. package/styles/timepicker/icons/_fusionnew.scss +13 -0
  130. package/styles/timepicker/icons/_material3.scss +13 -0
  131. package/styles/timepicker/material-dark.css +4 -23
  132. package/styles/timepicker/material.css +4 -24
  133. package/styles/timepicker/tailwind-dark.css +4 -22
  134. package/styles/timepicker/tailwind.css +4 -22
package/styles/datepicker/fabric-dark.css CHANGED
@@ -5,13 +5,11 @@
5
5
  margin: 0;
6
6
  outline: none;
7
7
  }
8
-
9
8
  .e-input-group-icon.e-date-icon::before,
10
9
  *.e-control-wrapper .e-input-group-icon.e-date-icon::before {
11
- content: '\e93a';
12
- font-family: 'e-icons';
10
+ content: "\e93a";
11
+ font-family: "e-icons";
13
12
  }
14
-
15
13
  .e-input-group-icon.e-date-icon:focus,
16
14
  *.e-control-wrapper .e-input-group-icon.e-date-icon:focus {
17
15
  background: #414040;
@@ -24,14 +22,12 @@
24
22
  font-size: 20px;
25
23
  margin: 0;
26
24
  }
27
-
28
25
  .e-bigger .e-input-group-icon.e-date-icon::before,
29
26
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon::before,
30
27
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon::before {
31
- content: '\e93a';
32
- font-family: 'e-icons';
28
+ content: "\e93a";
29
+ font-family: "e-icons";
33
30
  }
34
-
35
31
  .e-bigger .e-input-group-icon.e-date-icon:focus,
36
32
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon:focus,
37
33
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon:focus {
@@ -60,25 +56,22 @@
60
56
  .e-datepicker .e-calendar .e-content table tbody tr.e-month-hide:last-child {
61
57
  display: table-row;
62
58
  }
63
-
64
59
  .e-datepicker.e-popup-wrapper {
65
60
  border-radius: 0;
66
61
  overflow-y: hidden;
67
62
  pointer-events: auto;
68
63
  }
69
-
70
64
  .e-datepicker.e-date-modal {
71
65
  background-color: rgba(248, 248, 248, 0.6);
72
66
  height: 100%;
73
67
  left: 0;
74
- opacity: .5;
68
+ opacity: 0.5;
75
69
  pointer-events: auto;
76
70
  position: fixed;
77
71
  top: 0;
78
72
  width: 100%;
79
73
  z-index: 999;
80
74
  }
81
-
82
75
  .e-datepicker .e-model-header {
83
76
  background-color: #0074cc;
84
77
  color: #201f1f;
@@ -86,16 +79,13 @@
86
79
  display: none;
87
80
  padding: 10px 10px 10px 15px;
88
81
  }
89
-
90
82
  .e-datepicker .e-model-header .e-model-year {
91
83
  font-size: 14px;
92
84
  font-weight: 500;
93
85
  line-height: 32px;
94
86
  margin: 0;
95
87
  }
96
-
97
- .e-datepicker .e-model-month,
98
- .e-datepicker .e-model-day {
88
+ .e-datepicker .e-model-month, .e-datepicker .e-model-day {
99
89
  font-size: 20px;
100
90
  font-weight: 500;
101
91
  line-height: 32px;
@@ -123,7 +113,6 @@
123
113
  width: 100%;
124
114
  z-index: 1002;
125
115
  }
126
-
127
116
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-wrapper.e-lib.e-popup.e-control.e-popup-open {
128
117
  position: relative;
129
118
  top: 0 !important;
@@ -148,7 +137,6 @@
148
137
  overflow: auto;
149
138
  }
150
139
  }
151
-
152
140
  .e-datepicker.e-popup-wrapper,
153
141
  .e-bigger.e-small .e-datepicker.e-popup-wrapper,
154
142
  .e-bigger .e-datepicker.e-popup-wrapper,
@@ -159,7 +147,6 @@
159
147
  border: 1px solid #414040;
160
148
  box-shadow: none;
161
149
  }
162
-
163
150
  .e-datepicker .e-calendar,
164
151
  .e-bigger.e-small .e-datepicker .e-calendar,
165
152
  .e-bigger .e-datepicker .e-calendar,
@@ -173,4 +160,4 @@
173
160
 
174
161
  *.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
175
162
  border: 1px solid #0074cc;
176
- }
163
+ }
package/styles/datepicker/fabric.css CHANGED
@@ -6,13 +6,11 @@
6
6
  margin: 0;
7
7
  outline: none;
8
8
  }
9
-
10
9
  .e-input-group-icon.e-date-icon::before,
11
10
  *.e-control-wrapper .e-input-group-icon.e-date-icon::before {
12
- content: '\e93a';
13
- font-family: 'e-icons';
11
+ content: "\e93a";
12
+ font-family: "e-icons";
14
13
  }
15
-
16
14
  .e-input-group-icon.e-date-icon:focus,
17
15
  *.e-control-wrapper .e-input-group-icon.e-date-icon:focus {
18
16
  background: #eaeaea;
@@ -25,14 +23,12 @@
25
23
  font-size: 20px;
26
24
  margin: 0;
27
25
  }
28
-
29
26
  .e-bigger .e-input-group-icon.e-date-icon::before,
30
27
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon::before,
31
28
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon::before {
32
- content: '\e93a';
33
- font-family: 'e-icons';
29
+ content: "\e93a";
30
+ font-family: "e-icons";
34
31
  }
35
-
36
32
  .e-bigger .e-input-group-icon.e-date-icon:focus,
37
33
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon:focus,
38
34
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon:focus {
@@ -61,25 +57,22 @@
61
57
  .e-datepicker .e-calendar .e-content table tbody tr.e-month-hide:last-child {
62
58
  display: table-row;
63
59
  }
64
-
65
60
  .e-datepicker.e-popup-wrapper {
66
61
  border-radius: 0;
67
62
  overflow-y: hidden;
68
63
  pointer-events: auto;
69
64
  }
70
-
71
65
  .e-datepicker.e-date-modal {
72
66
  background-color: rgba(0, 0, 0, 0.6);
73
67
  height: 100%;
74
68
  left: 0;
75
- opacity: .5;
69
+ opacity: 0.5;
76
70
  pointer-events: auto;
77
71
  position: fixed;
78
72
  top: 0;
79
73
  width: 100%;
80
74
  z-index: 999;
81
75
  }
82
-
83
76
  .e-datepicker .e-model-header {
84
77
  background-color: #0078d6;
85
78
  color: #fff;
@@ -87,16 +80,13 @@
87
80
  display: none;
88
81
  padding: 10px 10px 10px 15px;
89
82
  }
90
-
91
83
  .e-datepicker .e-model-header .e-model-year {
92
84
  font-size: 14px;
93
85
  font-weight: 500;
94
86
  line-height: 32px;
95
87
  margin: 0;
96
88
  }
97
-
98
- .e-datepicker .e-model-month,
99
- .e-datepicker .e-model-day {
89
+ .e-datepicker .e-model-month, .e-datepicker .e-model-day {
100
90
  font-size: 20px;
101
91
  font-weight: 500;
102
92
  line-height: 32px;
@@ -124,7 +114,6 @@
124
114
  width: 100%;
125
115
  z-index: 1002;
126
116
  }
127
-
128
117
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-wrapper.e-lib.e-popup.e-control.e-popup-open {
129
118
  position: relative;
130
119
  top: 0 !important;
@@ -149,7 +138,6 @@
149
138
  overflow: auto;
150
139
  }
151
140
  }
152
-
153
141
  .e-datepicker.e-popup-wrapper,
154
142
  .e-bigger.e-small .e-datepicker.e-popup-wrapper,
155
143
  .e-bigger .e-datepicker.e-popup-wrapper,
@@ -160,7 +148,6 @@
160
148
  border: 1px solid #eaeaea;
161
149
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
162
150
  }
163
-
164
151
  .e-datepicker .e-calendar,
165
152
  .e-bigger.e-small .e-datepicker .e-calendar,
166
153
  .e-bigger .e-datepicker .e-calendar,
@@ -174,4 +161,4 @@
174
161
 
175
162
  *.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
176
163
  border: 1px solid #0078d6;
177
- }
164
+ }
package/styles/datepicker/fluent-dark.css CHANGED
@@ -8,13 +8,11 @@
8
8
  min-width: 30px;
9
9
  outline: none;
10
10
  }
11
-
12
11
  .e-input-group-icon.e-date-icon::before,
13
12
  *.e-control-wrapper .e-input-group-icon.e-date-icon::before {
14
- content: '\e75e';
15
- font-family: 'e-icons';
13
+ content: "\e75e";
14
+ font-family: "e-icons";
16
15
  }
17
-
18
16
  .e-input-group-icon.e-date-icon:focus,
19
17
  *.e-control-wrapper .e-input-group-icon.e-date-icon:focus {
20
18
  background: #f3f2f1;
@@ -29,14 +27,12 @@
29
27
  min-height: 18px;
30
28
  min-width: 36px;
31
29
  }
32
-
33
30
  .e-bigger .e-input-group-icon.e-date-icon::before,
34
31
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon::before,
35
32
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon::before {
36
- content: '\e75e';
37
- font-family: 'e-icons';
33
+ content: "\e75e";
34
+ font-family: "e-icons";
38
35
  }
39
-
40
36
  .e-bigger .e-input-group-icon.e-date-icon:focus,
41
37
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon:focus,
42
38
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon:focus {
@@ -65,25 +61,22 @@
65
61
  .e-datepicker .e-calendar .e-content table tbody tr.e-month-hide:last-child {
66
62
  display: none;
67
63
  }
68
-
69
64
  .e-datepicker.e-popup-wrapper {
70
65
  border-radius: 6px;
71
66
  overflow-y: hidden;
72
67
  pointer-events: auto;
73
68
  }
74
-
75
69
  .e-datepicker.e-date-modal {
76
70
  background-color: rgba(0, 0, 0, 0.4);
77
71
  height: 100%;
78
72
  left: 0;
79
- opacity: .5;
73
+ opacity: 0.5;
80
74
  pointer-events: auto;
81
75
  position: fixed;
82
76
  top: 0;
83
77
  width: 100%;
84
78
  z-index: 999;
85
79
  }
86
-
87
80
  .e-datepicker .e-model-header {
88
81
  background-color: #8a8886;
89
82
  color: #fff;
@@ -91,16 +84,13 @@
91
84
  display: block;
92
85
  padding: 10px 10px 10px 15px;
93
86
  }
94
-
95
87
  .e-datepicker .e-model-header .e-model-year {
96
88
  font-size: 14px;
97
89
  font-weight: 600;
98
90
  line-height: 22px;
99
91
  margin: 0;
100
92
  }
101
-
102
- .e-datepicker .e-model-month,
103
- .e-datepicker .e-model-day {
93
+ .e-datepicker .e-model-month, .e-datepicker .e-model-day {
104
94
  font-size: 18px;
105
95
  font-weight: 600;
106
96
  line-height: 28px;
@@ -128,7 +118,6 @@
128
118
  width: 100%;
129
119
  z-index: 1002;
130
120
  }
131
-
132
121
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-wrapper.e-lib.e-popup.e-control.e-popup-open {
133
122
  position: relative;
134
123
  top: 0 !important;
@@ -153,7 +142,6 @@
153
142
  overflow: auto;
154
143
  }
155
144
  }
156
-
157
145
  .e-datepicker.e-popup-wrapper,
158
146
  .e-bigger.e-small .e-datepicker.e-popup-wrapper,
159
147
  .e-bigger .e-datepicker.e-popup-wrapper,
@@ -164,7 +152,6 @@
164
152
  border: 0 solid #292827;
165
153
  box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
166
154
  }
167
-
168
155
  .e-datepicker .e-calendar,
169
156
  .e-bigger.e-small .e-datepicker .e-calendar,
170
157
  .e-bigger .e-datepicker .e-calendar,
@@ -183,7 +170,6 @@
183
170
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
184
171
  color: #a19f9d;
185
172
  }
186
-
187
173
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
188
174
  color: #a19f9d;
189
- }
175
+ }
package/styles/datepicker/fluent.css CHANGED
@@ -8,13 +8,11 @@
8
8
  min-width: 30px;
9
9
  outline: none;
10
10
  }
11
-
12
11
  .e-input-group-icon.e-date-icon::before,
13
12
  *.e-control-wrapper .e-input-group-icon.e-date-icon::before {
14
- content: '\e75e';
15
- font-family: 'e-icons';
13
+ content: "\e75e";
14
+ font-family: "e-icons";
16
15
  }
17
-
18
16
  .e-input-group-icon.e-date-icon:focus,
19
17
  *.e-control-wrapper .e-input-group-icon.e-date-icon:focus {
20
18
  background: #323130;
@@ -29,14 +27,12 @@
29
27
  min-height: 18px;
30
28
  min-width: 36px;
31
29
  }
32
-
33
30
  .e-bigger .e-input-group-icon.e-date-icon::before,
34
31
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon::before,
35
32
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon::before {
36
- content: '\e75e';
37
- font-family: 'e-icons';
33
+ content: "\e75e";
34
+ font-family: "e-icons";
38
35
  }
39
-
40
36
  .e-bigger .e-input-group-icon.e-date-icon:focus,
41
37
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon:focus,
42
38
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon:focus {
@@ -65,25 +61,22 @@
65
61
  .e-datepicker .e-calendar .e-content table tbody tr.e-month-hide:last-child {
66
62
  display: none;
67
63
  }
68
-
69
64
  .e-datepicker.e-popup-wrapper {
70
65
  border-radius: 6px;
71
66
  overflow-y: hidden;
72
67
  pointer-events: auto;
73
68
  }
74
-
75
69
  .e-datepicker.e-date-modal {
76
70
  background-color: rgba(0, 0, 0, 0.4);
77
71
  height: 100%;
78
72
  left: 0;
79
- opacity: .5;
73
+ opacity: 0.5;
80
74
  pointer-events: auto;
81
75
  position: fixed;
82
76
  top: 0;
83
77
  width: 100%;
84
78
  z-index: 999;
85
79
  }
86
-
87
80
  .e-datepicker .e-model-header {
88
81
  background-color: #8a8886;
89
82
  color: #fff;
@@ -91,16 +84,13 @@
91
84
  display: block;
92
85
  padding: 10px 10px 10px 15px;
93
86
  }
94
-
95
87
  .e-datepicker .e-model-header .e-model-year {
96
88
  font-size: 14px;
97
89
  font-weight: 600;
98
90
  line-height: 22px;
99
91
  margin: 0;
100
92
  }
101
-
102
- .e-datepicker .e-model-month,
103
- .e-datepicker .e-model-day {
93
+ .e-datepicker .e-model-month, .e-datepicker .e-model-day {
104
94
  font-size: 18px;
105
95
  font-weight: 600;
106
96
  line-height: 28px;
@@ -128,7 +118,6 @@
128
118
  width: 100%;
129
119
  z-index: 1002;
130
120
  }
131
-
132
121
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-wrapper.e-lib.e-popup.e-control.e-popup-open {
133
122
  position: relative;
134
123
  top: 0 !important;
@@ -153,7 +142,6 @@
153
142
  overflow: auto;
154
143
  }
155
144
  }
156
-
157
145
  .e-datepicker.e-popup-wrapper,
158
146
  .e-bigger.e-small .e-datepicker.e-popup-wrapper,
159
147
  .e-bigger .e-datepicker.e-popup-wrapper,
@@ -164,7 +152,6 @@
164
152
  border: 0 solid #edebe9;
165
153
  box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
166
154
  }
167
-
168
155
  .e-datepicker .e-calendar,
169
156
  .e-bigger.e-small .e-datepicker .e-calendar,
170
157
  .e-bigger .e-datepicker .e-calendar,
@@ -183,7 +170,6 @@
183
170
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
184
171
  color: #605e5c;
185
172
  }
186
-
187
173
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
188
174
  color: #605e5c;
189
- }
175
+ }
package/styles/datepicker/highcontrast-light.css CHANGED
@@ -5,13 +5,11 @@
5
5
  margin: 0;
6
6
  outline: none;
7
7
  }
8
-
9
8
  .e-input-group-icon.e-date-icon::before,
10
9
  *.e-control-wrapper .e-input-group-icon.e-date-icon::before {
11
- content: '\e93a';
12
- font-family: 'e-icons';
10
+ content: "\e93a";
11
+ font-family: "e-icons";
13
12
  }
14
-
15
13
  .e-input-group-icon.e-date-icon:focus,
16
14
  *.e-control-wrapper .e-input-group-icon.e-date-icon:focus {
17
15
  background: #ecf;
@@ -24,14 +22,12 @@
24
22
  font-size: 20px;
25
23
  margin: 0;
26
24
  }
27
-
28
25
  .e-bigger .e-input-group-icon.e-date-icon::before,
29
26
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon::before,
30
27
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon::before {
31
- content: '\e93a';
32
- font-family: 'e-icons';
28
+ content: "\e93a";
29
+ font-family: "e-icons";
33
30
  }
34
-
35
31
  .e-bigger .e-input-group-icon.e-date-icon:focus,
36
32
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon:focus,
37
33
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon:focus {
@@ -60,25 +56,22 @@
60
56
  .e-datepicker .e-calendar .e-content table tbody tr.e-month-hide:last-child {
61
57
  display: table-row;
62
58
  }
63
-
64
59
  .e-datepicker.e-popup-wrapper {
65
60
  border-radius: 0;
66
61
  overflow-y: hidden;
67
62
  pointer-events: auto;
68
63
  }
69
-
70
64
  .e-datepicker.e-date-modal {
71
65
  background-color: rgba(255, 255, 255, 0.6);
72
66
  height: 100%;
73
67
  left: 0;
74
- opacity: .5;
68
+ opacity: 0.5;
75
69
  pointer-events: auto;
76
70
  position: fixed;
77
71
  top: 0;
78
72
  width: 100%;
79
73
  z-index: 999;
80
74
  }
81
-
82
75
  .e-datepicker .e-model-header {
83
76
  background-color: #23726c;
84
77
  color: #000;
@@ -86,16 +79,13 @@
86
79
  display: none;
87
80
  padding: 10px 10px 10px 15px;
88
81
  }
89
-
90
82
  .e-datepicker .e-model-header .e-model-year {
91
83
  font-size: 14px;
92
84
  font-weight: 500;
93
85
  line-height: 32px;
94
86
  margin: 0;
95
87
  }
96
-
97
- .e-datepicker .e-model-month,
98
- .e-datepicker .e-model-day {
88
+ .e-datepicker .e-model-month, .e-datepicker .e-model-day {
99
89
  font-size: 20px;
100
90
  font-weight: 500;
101
91
  line-height: 32px;
@@ -123,7 +113,6 @@
123
113
  width: 100%;
124
114
  z-index: 1002;
125
115
  }
126
-
127
116
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-wrapper.e-lib.e-popup.e-control.e-popup-open {
128
117
  position: relative;
129
118
  top: 0 !important;
@@ -148,7 +137,6 @@
148
137
  overflow: auto;
149
138
  }
150
139
  }
151
-
152
140
  .e-datepicker.e-popup-wrapper,
153
141
  .e-bigger.e-small .e-datepicker.e-popup-wrapper,
154
142
  .e-bigger .e-datepicker.e-popup-wrapper,
@@ -159,7 +147,6 @@
159
147
  border: 1px solid #757575;
160
148
  box-shadow: none;
161
149
  }
162
-
163
150
  .e-datepicker .e-calendar,
164
151
  .e-bigger.e-small .e-datepicker .e-calendar,
165
152
  .e-bigger .e-datepicker .e-calendar,
@@ -178,7 +165,6 @@
178
165
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
179
166
  color: #000;
180
167
  }
181
-
182
168
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
183
169
  color: #000;
184
- }
170
+ }
package/styles/datepicker/highcontrast.css CHANGED
@@ -6,13 +6,11 @@
6
6
  margin: 0;
7
7
  outline: none;
8
8
  }
9
-
10
9
  .e-input-group-icon.e-date-icon::before,
11
10
  *.e-control-wrapper .e-input-group-icon.e-date-icon::before {
12
- content: '\e93a';
13
- font-family: 'e-icons';
11
+ content: "\e93a";
12
+ font-family: "e-icons";
14
13
  }
15
-
16
14
  .e-input-group-icon.e-date-icon:focus,
17
15
  *.e-control-wrapper .e-input-group-icon.e-date-icon:focus {
18
16
  background: #685708;
@@ -25,14 +23,12 @@
25
23
  font-size: 20px;
26
24
  margin: 0;
27
25
  }
28
-
29
26
  .e-bigger .e-input-group-icon.e-date-icon::before,
30
27
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon::before,
31
28
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon::before {
32
- content: '\e93a';
33
- font-family: 'e-icons';
29
+ content: "\e93a";
30
+ font-family: "e-icons";
34
31
  }
35
-
36
32
  .e-bigger .e-input-group-icon.e-date-icon:focus,
37
33
  *.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon:focus,
38
34
  *.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon:focus {
@@ -61,25 +57,22 @@
61
57
  .e-datepicker .e-calendar .e-content table tbody tr.e-month-hide:last-child {
62
58
  display: table-row;
63
59
  }
64
-
65
60
  .e-datepicker.e-popup-wrapper {
66
61
  border-radius: 0;
67
62
  overflow-y: hidden;
68
63
  pointer-events: auto;
69
64
  }
70
-
71
65
  .e-datepicker.e-date-modal {
72
66
  background-color: rgba(0, 0, 0, 0.6);
73
67
  height: 100%;
74
68
  left: 0;
75
- opacity: .5;
69
+ opacity: 0.5;
76
70
  pointer-events: auto;
77
71
  position: fixed;
78
72
  top: 0;
79
73
  width: 100%;
80
74
  z-index: 999;
81
75
  }
82
-
83
76
  .e-datepicker .e-model-header {
84
77
  background-color: #ffd939;
85
78
  color: #fff;
@@ -87,16 +80,13 @@
87
80
  display: none;
88
81
  padding: 10px 10px 10px 15px;
89
82
  }
90
-
91
83
  .e-datepicker .e-model-header .e-model-year {
92
84
  font-size: 14px;
93
85
  font-weight: 500;
94
86
  line-height: 32px;
95
87
  margin: 0;
96
88
  }
97
-
98
- .e-datepicker .e-model-month,
99
- .e-datepicker .e-model-day {
89
+ .e-datepicker .e-model-month, .e-datepicker .e-model-day {
100
90
  font-size: 20px;
101
91
  font-weight: 500;
102
92
  line-height: 32px;
@@ -124,7 +114,6 @@
124
114
  width: 100%;
125
115
  z-index: 1002;
126
116
  }
127
-
128
117
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-wrapper.e-lib.e-popup.e-control.e-popup-open {
129
118
  position: relative;
130
119
  top: 0 !important;
@@ -149,7 +138,6 @@
149
138
  overflow: auto;
150
139
  }
151
140
  }
152
-
153
141
  .e-datepicker.e-popup-wrapper,
154
142
  .e-bigger.e-small .e-datepicker.e-popup-wrapper,
155
143
  .e-bigger .e-datepicker.e-popup-wrapper,
@@ -160,7 +148,6 @@
160
148
  border: 1px solid #969696;
161
149
  box-shadow: none;
162
150
  }
163
-
164
151
  .e-datepicker .e-calendar,
165
152
  .e-bigger.e-small .e-datepicker .e-calendar,
166
153
  .e-bigger .e-datepicker .e-calendar,
@@ -179,7 +166,6 @@
179
166
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
180
167
  color: #fff;
181
168
  }
182
-
183
169
  .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
184
170
  color: #fff;
185
- }
171
+ }
package/styles/datepicker/icons/_fusionnew.scss ADDED
@@ -0,0 +1,55 @@
1
+ @include export-module('datepicker-fusionnew-icons') {
2
+ /*! component icons */
3
+
4
+ .e-input-group-icon.e-date-icon,
5
+ #{if(&, '&', '*')}.e-control-wrapper .e-input-group-icon.e-date-icon {
6
+ font-size: $datepicker-icon-font-size;
7
+ margin: $datepicker-icon-normal-margin;
8
+ min-height: $datepicker-icon-container-min-height;
9
+ min-width: $datepicker-icon-container-min-width;
10
+ outline: none;
11
+
12
+ #{if(&, '&', '*')}::before {
13
+ content: '\e75e';
14
+ font-family: 'e-icons';
15
+ }
16
+
17
+ #{if(&, '&', '*')}:focus {
18
+ background: $datepicker-icon-hover-color;
19
+ border-radius: $datepicker-icon-border-radius;
20
+ }
21
+ }
22
+
23
+ .e-bigger .e-input-group-icon.e-date-icon,
24
+ #{if(&, '&', '*')}.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon,
25
+ #{if(&, '&', '*')}.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon {
26
+ font-size: $datepicker-bigger-icon-font-size;
27
+ margin: $datepicker-icon-bigger-margin;
28
+ min-height: $datepicker-bigger-icon-container-min-height;
29
+ min-width: $datepicker-bigger-icon-container-min-width;
30
+
31
+ #{if(&, '&', '*')}::before {
32
+ content: '\e75e';
33
+ font-family: 'e-icons';
34
+ }
35
+
36
+ #{if(&, '&', '*')}:focus {
37
+ background: $datepicker-icon-hover-color;
38
+ border-radius: $datepicker-icon-border-radius;
39
+ }
40
+ }
41
+
42
+ // mouse small icon
43
+ .e-small .e-input-group-icon.e-date-icon,
44
+ #{if(&, '&', '*')}.e-control-wrapper.e-small .e-input-group-icon.e-date-icon,
45
+ #{if(&, '&', '*')}.e-small .e-control-wrapper .e-input-group-icon.e-date-icon {
46
+ font-size: $datepicker-small-icon-font-size;
47
+ }
48
+
49
+ // Touch small icon
50
+ .e-small.e-bigger .e-input-group-icon.e-date-icon,
51
+ #{if(&, '&', '*')}.e-control-wrapper.e-small.e-bigger .e-input-group-icon.e-date-icon,
52
+ #{if(&, '&', '*')}.e-small.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon {
53
+ font-size: $datepicker-bigger-small-icon-font-size;
54
+ }
55
+ }