@syncfusion/ej2-calendars 25.2.5 → 26.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 (192) hide show
  1. package/.eslintrc.json +3 -2
  2. package/dist/ej2-calendars.min.js +2 -2
  3. package/dist/ej2-calendars.umd.min.js +2 -2
  4. package/dist/ej2-calendars.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-calendars.es2015.js +150 -201
  6. package/dist/es6/ej2-calendars.es2015.js.map +1 -1
  7. package/dist/es6/ej2-calendars.es5.js +145 -197
  8. package/dist/es6/ej2-calendars.es5.js.map +1 -1
  9. package/dist/global/ej2-calendars.min.js +2 -2
  10. package/dist/global/ej2-calendars.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +11 -11
  13. package/src/calendar/calendar.d.ts +1 -2
  14. package/src/calendar/calendar.js +35 -27
  15. package/src/calendar/islamic.js +8 -7
  16. package/src/datepicker/datepicker.d.ts +0 -1
  17. package/src/datepicker/datepicker.js +15 -16
  18. package/src/daterangepicker/daterangepicker.d.ts +0 -1
  19. package/src/daterangepicker/daterangepicker.js +25 -26
  20. package/src/datetimepicker/datetimepicker.js +17 -11
  21. package/src/maskbase/interface.js +0 -1
  22. package/src/maskbase/masked-date-time.js +3 -5
  23. package/src/timepicker/timepicker.d.ts +0 -1
  24. package/src/timepicker/timepicker.js +7 -11
  25. package/styles/bootstrap-dark.css +143 -91
  26. package/styles/bootstrap-dark.scss +20 -5
  27. package/styles/bootstrap.css +143 -93
  28. package/styles/bootstrap.scss +20 -5
  29. package/styles/bootstrap4.css +143 -93
  30. package/styles/bootstrap4.scss +20 -5
  31. package/styles/bootstrap5-dark.css +143 -94
  32. package/styles/bootstrap5-dark.scss +20 -5
  33. package/styles/bootstrap5.css +143 -94
  34. package/styles/bootstrap5.scss +20 -5
  35. package/styles/calendar/_bds-definition.scss +4 -3
  36. package/styles/calendar/_bootstrap5.3-definition.scss +256 -0
  37. package/styles/calendar/_fluent2-definition.scss +290 -0
  38. package/styles/calendar/_layout.scss +34 -14
  39. package/styles/calendar/_material3-definition.scss +0 -9
  40. package/styles/calendar/_theme.scss +104 -45
  41. package/styles/calendar/bootstrap-dark.css +48 -24
  42. package/styles/calendar/bootstrap.css +48 -24
  43. package/styles/calendar/bootstrap4.css +48 -24
  44. package/styles/calendar/bootstrap5-dark.css +48 -24
  45. package/styles/calendar/bootstrap5.css +48 -24
  46. package/styles/calendar/fabric-dark.css +51 -25
  47. package/styles/calendar/fabric.css +51 -25
  48. package/styles/calendar/fluent-dark.css +67 -33
  49. package/styles/calendar/fluent.css +67 -33
  50. package/styles/calendar/fluent2.css +2022 -0
  51. package/styles/calendar/fluent2.scss +5 -0
  52. package/styles/calendar/highcontrast-light.css +49 -24
  53. package/styles/calendar/highcontrast.css +51 -25
  54. package/styles/calendar/icons/_bootstrap5.3.scss +13 -0
  55. package/styles/calendar/icons/_fluent2.scss +13 -0
  56. package/styles/calendar/material-dark.css +51 -25
  57. package/styles/calendar/material.css +51 -25
  58. package/styles/calendar/material3-dark.css +52 -23
  59. package/styles/calendar/material3.css +52 -23
  60. package/styles/calendar/tailwind-dark.css +49 -25
  61. package/styles/calendar/tailwind.css +49 -25
  62. package/styles/datepicker/_bootstrap5.3-definition.scss +107 -0
  63. package/styles/datepicker/_fluent2-definition.scss +118 -0
  64. package/styles/datepicker/_layout.scss +20 -11
  65. package/styles/datepicker/_material3-definition.scss +0 -19
  66. package/styles/datepicker/bootstrap-dark.css +16 -18
  67. package/styles/datepicker/bootstrap.css +16 -18
  68. package/styles/datepicker/bootstrap4.css +16 -18
  69. package/styles/datepicker/bootstrap5-dark.css +18 -19
  70. package/styles/datepicker/bootstrap5.css +18 -19
  71. package/styles/datepicker/fabric-dark.css +16 -18
  72. package/styles/datepicker/fabric.css +16 -18
  73. package/styles/datepicker/fluent-dark.css +18 -19
  74. package/styles/datepicker/fluent.css +18 -19
  75. package/styles/datepicker/fluent2.css +1680 -0
  76. package/styles/datepicker/fluent2.scss +7 -0
  77. package/styles/datepicker/highcontrast-light.css +16 -18
  78. package/styles/datepicker/highcontrast.css +16 -18
  79. package/styles/datepicker/icons/_bootstrap5.3.scss +76 -0
  80. package/styles/datepicker/icons/_fluent2.scss +83 -0
  81. package/styles/datepicker/material-dark.css +27 -20
  82. package/styles/datepicker/material.css +41 -22
  83. package/styles/datepicker/material3-dark.css +46 -24
  84. package/styles/datepicker/material3.css +46 -24
  85. package/styles/datepicker/tailwind-dark.css +18 -19
  86. package/styles/datepicker/tailwind.css +18 -19
  87. package/styles/daterangepicker/_bds-definition.scss +2 -2
  88. package/styles/daterangepicker/_bootstrap5.3-definition.scss +296 -0
  89. package/styles/daterangepicker/_fluent2-definition.scss +309 -0
  90. package/styles/daterangepicker/_layout.scss +14 -22
  91. package/styles/daterangepicker/_material3-definition.scss +0 -20
  92. package/styles/daterangepicker/_theme.scss +16 -8
  93. package/styles/daterangepicker/bootstrap-dark.css +54 -33
  94. package/styles/daterangepicker/bootstrap.css +54 -33
  95. package/styles/daterangepicker/bootstrap4.css +54 -33
  96. package/styles/daterangepicker/bootstrap5-dark.css +56 -34
  97. package/styles/daterangepicker/bootstrap5.css +56 -34
  98. package/styles/daterangepicker/fabric-dark.css +54 -33
  99. package/styles/daterangepicker/fabric.css +54 -33
  100. package/styles/daterangepicker/fluent-dark.css +66 -39
  101. package/styles/daterangepicker/fluent.css +66 -39
  102. package/styles/daterangepicker/fluent2.css +2465 -0
  103. package/styles/daterangepicker/fluent2.scss +7 -0
  104. package/styles/daterangepicker/highcontrast-light.css +54 -33
  105. package/styles/daterangepicker/highcontrast.css +54 -33
  106. package/styles/daterangepicker/icons/_bootstrap5.3.scss +92 -0
  107. package/styles/daterangepicker/icons/_fluent2.scss +132 -0
  108. package/styles/daterangepicker/material-dark.css +63 -34
  109. package/styles/daterangepicker/material.css +77 -36
  110. package/styles/daterangepicker/material3-dark.css +88 -38
  111. package/styles/daterangepicker/material3.css +88 -38
  112. package/styles/daterangepicker/tailwind-dark.css +58 -35
  113. package/styles/daterangepicker/tailwind.css +58 -35
  114. package/styles/datetimepicker/_bootstrap5.3-definition.scss +65 -0
  115. package/styles/datetimepicker/_fluent2-definition.scss +65 -0
  116. package/styles/datetimepicker/_layout.scss +0 -3
  117. package/styles/datetimepicker/_material3-definition.scss +0 -10
  118. package/styles/datetimepicker/_theme.scss +2 -2
  119. package/styles/datetimepicker/bootstrap-dark.css +7 -3
  120. package/styles/datetimepicker/bootstrap.css +7 -3
  121. package/styles/datetimepicker/bootstrap4.css +7 -3
  122. package/styles/datetimepicker/bootstrap5-dark.css +7 -3
  123. package/styles/datetimepicker/bootstrap5.css +7 -3
  124. package/styles/datetimepicker/fabric-dark.css +7 -3
  125. package/styles/datetimepicker/fabric.css +7 -3
  126. package/styles/datetimepicker/fluent-dark.css +7 -3
  127. package/styles/datetimepicker/fluent.css +7 -3
  128. package/styles/datetimepicker/fluent2.css +1408 -0
  129. package/styles/datetimepicker/fluent2.scss +8 -0
  130. package/styles/datetimepicker/highcontrast-light.css +7 -3
  131. package/styles/datetimepicker/highcontrast.css +7 -3
  132. package/styles/datetimepicker/icons/_bootstrap5.3.scss +11 -0
  133. package/styles/datetimepicker/icons/_fluent2.scss +11 -0
  134. package/styles/datetimepicker/material-dark.css +16 -4
  135. package/styles/datetimepicker/material.css +30 -6
  136. package/styles/datetimepicker/material3-dark.css +33 -7
  137. package/styles/datetimepicker/material3.css +33 -7
  138. package/styles/datetimepicker/tailwind-dark.css +7 -3
  139. package/styles/datetimepicker/tailwind.css +7 -3
  140. package/styles/fabric-dark.css +146 -92
  141. package/styles/fabric-dark.scss +20 -5
  142. package/styles/fabric.css +146 -94
  143. package/styles/fabric.scss +20 -5
  144. package/styles/fluent-dark.css +172 -108
  145. package/styles/fluent-dark.scss +20 -5
  146. package/styles/fluent.css +172 -108
  147. package/styles/fluent.scss +20 -5
  148. package/styles/fluent2.css +4429 -0
  149. package/styles/fluent2.scss +20 -0
  150. package/styles/highcontrast-light.css +144 -91
  151. package/styles/highcontrast-light.scss +20 -5
  152. package/styles/highcontrast.css +146 -94
  153. package/styles/highcontrast.scss +20 -5
  154. package/styles/material-dark.css +157 -112
  155. package/styles/material-dark.scss +20 -5
  156. package/styles/material.css +171 -140
  157. package/styles/material.scss +20 -5
  158. package/styles/material3-dark.css +189 -139
  159. package/styles/material3-dark.scss +20 -5
  160. package/styles/material3.css +189 -139
  161. package/styles/material3.scss +20 -5
  162. package/styles/tailwind-dark.css +146 -96
  163. package/styles/tailwind-dark.scss +20 -5
  164. package/styles/tailwind.css +146 -96
  165. package/styles/tailwind.scss +20 -5
  166. package/styles/timepicker/_bootstrap5.3-definition.scss +85 -0
  167. package/styles/timepicker/_fluent2-definition.scss +84 -0
  168. package/styles/timepicker/_layout.scss +2 -16
  169. package/styles/timepicker/_material3-definition.scss +0 -16
  170. package/styles/timepicker/_theme.scss +1 -4
  171. package/styles/timepicker/bootstrap-dark.css +18 -10
  172. package/styles/timepicker/bootstrap.css +18 -10
  173. package/styles/timepicker/bootstrap4.css +18 -10
  174. package/styles/timepicker/bootstrap5-dark.css +18 -10
  175. package/styles/timepicker/bootstrap5.css +18 -10
  176. package/styles/timepicker/fabric-dark.css +18 -10
  177. package/styles/timepicker/fabric.css +18 -10
  178. package/styles/timepicker/fluent-dark.css +18 -10
  179. package/styles/timepicker/fluent.css +18 -10
  180. package/styles/timepicker/fluent2.css +1531 -0
  181. package/styles/timepicker/fluent2.scss +6 -0
  182. package/styles/timepicker/highcontrast-light.css +18 -10
  183. package/styles/timepicker/highcontrast.css +18 -10
  184. package/styles/timepicker/icons/_bootstrap5.3.scss +24 -0
  185. package/styles/timepicker/icons/_fluent2.scss +24 -0
  186. package/styles/timepicker/material-dark.css +27 -11
  187. package/styles/timepicker/material.css +41 -13
  188. package/styles/timepicker/material3-dark.css +45 -14
  189. package/styles/timepicker/material3.css +45 -14
  190. package/styles/timepicker/tailwind-dark.css +18 -10
  191. package/styles/timepicker/tailwind.css +18 -10
  192. package/CHANGELOG.md +0 -1218
@@ -0,0 +1,20 @@
1
+ @import 'ej2-base/styles/definition/fluent2.scss';
2
+ @import 'ej2-buttons/styles/button/fluent2-definition.scss';
3
+ @import 'calendar/fluent2-definition.scss';
4
+ @import 'calendar/icons/fluent2.scss';
5
+ @import 'calendar/all.scss';
6
+
7
+ @import 'ej2-inputs/styles/input/fluent2-definition.scss';
8
+ @import 'ej2-popups/styles/popup/fluent2-definition.scss';
9
+ @import 'timepicker/fluent2-definition.scss';
10
+ @import 'timepicker/icons/fluent2.scss';
11
+ @import 'timepicker/all.scss';
12
+ @import 'datepicker/fluent2-definition.scss';
13
+ @import 'datepicker/icons/fluent2.scss';
14
+ @import 'datepicker/all.scss';
15
+ @import 'daterangepicker/fluent2-definition.scss';
16
+ @import 'daterangepicker/icons/fluent2.scss';
17
+ @import 'daterangepicker/all.scss';
18
+ @import 'datetimepicker/fluent2-definition.scss';
19
+ @import 'datetimepicker/icons/fluent2.scss';
20
+ @import 'datetimepicker/all.scss';
@@ -42,6 +42,7 @@ ejs-calendar {
42
42
  display: block;
43
43
  overflow: auto;
44
44
  -webkit-user-select: none;
45
+ -moz-user-select: none;
45
46
  -ms-user-select: none;
46
47
  user-select: none;
47
48
  }
@@ -116,7 +117,8 @@ ejs-calendar {
116
117
  .e-calendar .e-content th, .e-calendar .e-content td,
117
118
  .e-bigger.e-small .e-calendar .e-content th,
118
119
  .e-bigger.e-small .e-calendar .e-content td {
119
- box-sizing: border-box;
120
+ -webkit-box-sizing: border-box;
121
+ box-sizing: border-box;
120
122
  }
121
123
  .e-calendar .e-content td.e-disabled,
122
124
  .e-bigger.e-small .e-calendar .e-content td.e-disabled {
@@ -350,12 +352,16 @@ ejs-calendar {
350
352
  background-color: #fff;
351
353
  border-top: none;
352
354
  cursor: default;
355
+ display: -webkit-box;
353
356
  display: -ms-flexbox;
354
357
  display: flex;
355
- -ms-flex-direction: row;
356
- flex-direction: row;
357
- -ms-flex-pack: end;
358
- justify-content: flex-end;
358
+ -webkit-box-orient: horizontal;
359
+ -webkit-box-direction: normal;
360
+ -ms-flex-direction: row;
361
+ flex-direction: row;
362
+ -webkit-box-pack: end;
363
+ -ms-flex-pack: end;
364
+ justify-content: flex-end;
359
365
  padding: 0 10px 10px 10px;
360
366
  text-align: center;
361
367
  width: 100%;
@@ -539,7 +545,8 @@ ejs-calendar {
539
545
  .e-calendar .e-btn.e-today.e-flat.e-disabled, .e-calendar .e-btn.e-today.e-flat.e-disabled:hover, .e-calendar .e-btn.e-today.e-flat.e-disabled:active, .e-calendar .e-btn.e-today.e-flat.e-disabled:focus, .e-calendar .e-btn.e-today.e-flat.e-disabled:hover:active {
540
546
  background: #fff;
541
547
  border-color: #fff;
542
- box-shadow: none;
548
+ -webkit-box-shadow: none;
549
+ box-shadow: none;
543
550
  color: #757575;
544
551
  cursor: default;
545
552
  opacity: 1;
@@ -564,7 +571,8 @@ ejs-calendar {
564
571
  .e-bigger.e-small .e-calendar {
565
572
  background-color: #fff;
566
573
  border: 1px solid #757575;
567
- box-shadow: none;
574
+ -webkit-box-shadow: none;
575
+ box-shadow: none;
568
576
  }
569
577
  .e-calendar .e-date-icon-prev, .e-calendar .e-date-icon-next,
570
578
  .e-bigger.e-small .e-calendar .e-date-icon-prev,
@@ -597,13 +605,15 @@ ejs-calendar {
597
605
  }
598
606
  .e-calendar .e-header .e-title:focus,
599
607
  .e-bigger.e-small .e-calendar .e-header .e-title:focus {
600
- box-shadow: 0 0 0 1px #fff;
608
+ -webkit-box-shadow: 0 0 0 1px #fff;
609
+ box-shadow: 0 0 0 1px #fff;
601
610
  background: none;
602
611
  text-decoration: underline;
603
612
  }
604
613
  .e-calendar .e-header .e-title:active,
605
614
  .e-bigger.e-small .e-calendar .e-header .e-title:active {
606
- box-shadow: none;
615
+ -webkit-box-shadow: none;
616
+ box-shadow: none;
607
617
  background: #fff;
608
618
  text-decoration: underline;
609
619
  }
@@ -622,7 +632,8 @@ ejs-calendar {
622
632
  .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
623
633
  .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
624
634
  .e-bigger.e-small .e-calendar .e-header .e-next:focus {
625
- box-shadow: 0 0 0 1px #fff;
635
+ -webkit-box-shadow: 0 0 0 1px #fff;
636
+ box-shadow: 0 0 0 1px #fff;
626
637
  }
627
638
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
628
639
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
@@ -668,11 +679,6 @@ ejs-calendar {
668
679
  .e-bigger.e-small .e-calendar .e-content.e-decade tr:last-child .e-cell.e-disabled:last-child span.e-day {
669
680
  color: #757575;
670
681
  }
671
- .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
672
- .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
673
- .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
674
- background-color: #ecf;
675
- }
676
682
  .e-calendar .e-content.e-year td.e-selected:hover span.e-day, .e-calendar .e-content.e-decade td.e-selected:hover span.e-day,
677
683
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,
678
684
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected:hover span.e-day {
@@ -694,7 +700,8 @@ ejs-calendar {
694
700
  background: #fff;
695
701
  border: 1px dashed #000;
696
702
  border-radius: 0;
697
- box-shadow: none;
703
+ -webkit-box-shadow: none;
704
+ box-shadow: none;
698
705
  }
699
706
  .e-calendar .e-content td.e-focused-date:hover span.e-day,
700
707
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date:hover span.e-day {
@@ -709,14 +716,16 @@ ejs-calendar {
709
716
  background: #fff;
710
717
  border: 1px solid #400074;
711
718
  border-radius: 0;
712
- box-shadow: none;
719
+ -webkit-box-shadow: none;
720
+ box-shadow: none;
713
721
  color: #400074;
714
722
  }
715
723
  .e-calendar .e-content td.e-focused-date.e-today span.e-day,
716
724
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date.e-today span.e-day {
717
725
  background: #fff;
718
726
  border: 1px dashed #000;
719
- box-shadow: none;
727
+ -webkit-box-shadow: none;
728
+ box-shadow: none;
720
729
  color: #400074;
721
730
  }
722
731
  .e-calendar .e-content td.e-today:focus span.e-day, .e-calendar .e-content td.e-focused-date.e-today:focus span.e-day,
@@ -739,7 +748,8 @@ ejs-calendar {
739
748
  .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected span.e-day {
740
749
  background-color: #400074;
741
750
  border: 1px solid #400074;
742
- box-shadow: none;
751
+ -webkit-box-shadow: none;
752
+ box-shadow: none;
743
753
  color: #fff;
744
754
  }
745
755
  .e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected.e-focused-date span.e-day,
@@ -804,9 +814,9 @@ ejs-calendar {
804
814
  .e-calendar .e-content td.e-selected span.e-day,
805
815
  .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day {
806
816
  background-color: #400074;
817
+ color: #fff;
807
818
  border: 1px solid #400074;
808
819
  border-radius: 0;
809
- color: #fff;
810
820
  }
811
821
  .e-calendar .e-content .e-footer,
812
822
  .e-bigger.e-small .e-calendar .e-content .e-footer {
@@ -832,19 +842,34 @@ ejs-calendar {
832
842
  }
833
843
 
834
844
  .e-calendar .e-zoomin {
835
- animation: animatezoom 0.3s;
845
+ -webkit-animation: animatezoom 0.3s;
846
+ animation: animatezoom 0.3s;
847
+ }
848
+
849
+ @-webkit-keyframes animatezoom {
850
+ from {
851
+ -webkit-transform: scale(0);
852
+ transform: scale(0);
853
+ }
854
+ to {
855
+ -webkit-transform: scale(1);
856
+ transform: scale(1);
857
+ }
836
858
  }
837
859
 
838
860
  @keyframes animatezoom {
839
861
  from {
840
- transform: scale(0);
862
+ -webkit-transform: scale(0);
863
+ transform: scale(0);
841
864
  }
842
865
  to {
843
- transform: scale(1);
866
+ -webkit-transform: scale(1);
867
+ transform: scale(1);
844
868
  }
845
869
  }
846
870
  .e-calendar .e-calendar-content-table .e-cell.e-focused-cell span.e-day {
847
- box-shadow: 0 0 0 1px #fff;
871
+ -webkit-box-shadow: 0 0 0 1px #fff;
872
+ box-shadow: 0 0 0 1px #fff;
848
873
  border-radius: 0;
849
874
  }
850
875
 
@@ -863,6 +888,7 @@ ejs-calendar {
863
888
 
864
889
  .e-input-group.e-control-wrapper.e-time-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
865
890
  .e-float-input.e-control-wrapper.e-input-group.e-time-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
891
+ display: -webkit-box;
866
892
  display: -ms-flexbox;
867
893
  display: flex;
868
894
  }
@@ -991,15 +1017,20 @@ ejs-calendar {
991
1017
  }
992
1018
 
993
1019
  .e-timepicker-mob-popup-wrap {
994
- -ms-flex-align: center;
995
- align-items: center;
1020
+ -webkit-box-align: center;
1021
+ -ms-flex-align: center;
1022
+ align-items: center;
1023
+ display: -webkit-box;
996
1024
  display: -ms-flexbox;
997
1025
  display: flex;
998
- -ms-flex-direction: column;
999
- flex-direction: column;
1026
+ -webkit-box-orient: vertical;
1027
+ -webkit-box-direction: normal;
1028
+ -ms-flex-direction: column;
1029
+ flex-direction: column;
1000
1030
  height: 100%;
1001
- -ms-flex-pack: center;
1002
- justify-content: center;
1031
+ -webkit-box-pack: center;
1032
+ -ms-flex-pack: center;
1033
+ justify-content: center;
1003
1034
  left: 0;
1004
1035
  max-height: 100%;
1005
1036
  position: fixed;
@@ -1024,10 +1055,12 @@ ejs-calendar {
1024
1055
  .e-datetimepicker.e-popup-expand .e-model-header {
1025
1056
  height: 10%;
1026
1057
  padding: 2.5vh 2.5vw 2.5vh 1.5vw;
1058
+ display: -webkit-box;
1027
1059
  display: -ms-flexbox;
1028
1060
  display: flex;
1029
- -ms-flex-align: center;
1030
- align-items: center;
1061
+ -webkit-box-align: center;
1062
+ -ms-flex-align: center;
1063
+ align-items: center;
1031
1064
  font-size: 2vh;
1032
1065
  border-bottom: 1px solid #757575;
1033
1066
  }
@@ -1098,7 +1131,6 @@ ejs-calendar {
1098
1131
  }
1099
1132
  }
1100
1133
  /* stylelint-enable */
1101
- /*! timepicker theme */
1102
1134
  .e-time-wrapper .e-input-group-icon.e-icons.e-active {
1103
1135
  color: #000;
1104
1136
  }
@@ -1110,7 +1142,8 @@ ejs-calendar {
1110
1142
  background-color: #fff;
1111
1143
  border: 1px solid #757575;
1112
1144
  border-radius: 0;
1113
- box-shadow: none;
1145
+ -webkit-box-shadow: none;
1146
+ box-shadow: none;
1114
1147
  }
1115
1148
  .e-timepicker.e-popup .e-list-parent.e-ul {
1116
1149
  background-color: #fff;
@@ -1158,7 +1191,6 @@ ejs-calendar {
1158
1191
  font-weight: 500;
1159
1192
  }
1160
1193
 
1161
- /* stylelint-disable property-no-vendor-prefix */
1162
1194
  /*! component icons */
1163
1195
  .e-input-group-icon.e-date-icon,
1164
1196
  *.e-control-wrapper .e-input-group-icon.e-date-icon {
@@ -1221,6 +1253,7 @@ ejs-calendar {
1221
1253
 
1222
1254
  .e-input-group.e-control-wrapper.e-date-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
1223
1255
  .e-float-input.e-control-wrapper.e-input-group.e-date-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
1256
+ display: -webkit-box;
1224
1257
  display: -ms-flexbox;
1225
1258
  display: flex;
1226
1259
  }
@@ -1270,15 +1303,20 @@ ejs-calendar {
1270
1303
  }
1271
1304
 
1272
1305
  .e-datepick-mob-popup-wrap {
1273
- -ms-flex-align: center;
1274
- align-items: center;
1306
+ -webkit-box-align: center;
1307
+ -ms-flex-align: center;
1308
+ align-items: center;
1309
+ display: -webkit-box;
1275
1310
  display: -ms-flexbox;
1276
1311
  display: flex;
1277
- -ms-flex-direction: column;
1278
- flex-direction: column;
1312
+ -webkit-box-orient: vertical;
1313
+ -webkit-box-direction: normal;
1314
+ -ms-flex-direction: column;
1315
+ flex-direction: column;
1279
1316
  height: 100%;
1280
- -ms-flex-pack: center;
1281
- justify-content: center;
1317
+ -webkit-box-pack: center;
1318
+ -ms-flex-pack: center;
1319
+ justify-content: center;
1282
1320
  left: 0;
1283
1321
  max-height: 100%;
1284
1322
  position: fixed;
@@ -1347,7 +1385,8 @@ ejs-calendar {
1347
1385
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-model-header .e-btn.e-flat.e-popup-close {
1348
1386
  background: transparent;
1349
1387
  border-color: transparent;
1350
- box-shadow: none;
1388
+ -webkit-box-shadow: none;
1389
+ box-shadow: none;
1351
1390
  font-weight: 400;
1352
1391
  padding: 0;
1353
1392
  }
@@ -1512,18 +1551,12 @@ ejs-calendar {
1512
1551
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-model-header .e-popup-close {
1513
1552
  float: left;
1514
1553
  }
1515
- }
1516
- @media screen and (orientation: landscape) {
1517
1554
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-model-header .e-day-wrapper {
1518
1555
  margin: 12vh 0 0 0;
1519
1556
  }
1520
- }
1521
- @media screen and (orientation: landscape) {
1522
1557
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-model-header .e-model-month, .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-model-header .e-model-day {
1523
1558
  font-size: 4vw;
1524
1559
  }
1525
- }
1526
- @media screen and (orientation: landscape) {
1527
1560
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-calendar .e-header.e-month .e-prev, .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-calendar .e-header.e-year .e-prev, .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-calendar .e-header.e-decade .e-prev {
1528
1561
  margin-right: 82vw;
1529
1562
  }
@@ -1559,14 +1592,10 @@ ejs-calendar {
1559
1592
  max-width: 100%;
1560
1593
  overflow: visible;
1561
1594
  }
1562
- }
1563
- @media screen and (orientation: landscape) {
1564
1595
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-calendar-cell-container {
1565
1596
  height: 70%;
1566
1597
  width: 100%;
1567
1598
  }
1568
- }
1569
- @media screen and (orientation: landscape) {
1570
1599
  .e-datepick-mob-popup-wrap .e-datepicker.e-popup-expand .e-calendar.e-device .e-month table tbody {
1571
1600
  display: table-row-group;
1572
1601
  }
@@ -1590,7 +1619,8 @@ ejs-calendar {
1590
1619
  .e-bigger.e-datepicker.e-popup-wrapper,
1591
1620
  .e-small.e-datepicker.e-popup-wrapper {
1592
1621
  border: 1px solid #757575;
1593
- box-shadow: none;
1622
+ -webkit-box-shadow: none;
1623
+ box-shadow: none;
1594
1624
  }
1595
1625
  .e-datepicker .e-calendar,
1596
1626
  .e-bigger.e-small .e-datepicker .e-calendar,
@@ -1614,7 +1644,6 @@ ejs-calendar {
1614
1644
  color: #000;
1615
1645
  }
1616
1646
 
1617
- /* stylelint-disable property-no-vendor-prefix */
1618
1647
  /*! component icons */
1619
1648
  .e-input-group-icon.e-range-icon,
1620
1649
  *.e-control-wrapper .e-input-group-icon.e-range-icon {
@@ -1679,9 +1708,9 @@ ejs-calendar {
1679
1708
  font-family: "e-icons";
1680
1709
  }
1681
1710
 
1682
- /*! daterangepicker layout */
1683
1711
  .e-input-group.e-control-wrapper.e-date-range-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
1684
1712
  .e-float-input.e-control-wrapper.e-input-group.e-date-range-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
1713
+ display: -webkit-box;
1685
1714
  display: -ms-flexbox;
1686
1715
  display: flex;
1687
1716
  }
@@ -1705,7 +1734,8 @@ ejs-calendar {
1705
1734
  .e-bigger.e-small .e-daterangepicker.e-popup {
1706
1735
  border: 1px solid #000;
1707
1736
  border-radius: 0;
1708
- box-shadow: none;
1737
+ -webkit-box-shadow: none;
1738
+ box-shadow: none;
1709
1739
  max-height: 500px;
1710
1740
  max-width: 730px;
1711
1741
  }
@@ -1738,6 +1768,7 @@ ejs-calendar {
1738
1768
  text-decoration: none;
1739
1769
  text-overflow: ellipsis;
1740
1770
  -webkit-user-select: none;
1771
+ -moz-user-select: none;
1741
1772
  -ms-user-select: none;
1742
1773
  user-select: none;
1743
1774
  white-space: nowrap;
@@ -1758,14 +1789,17 @@ ejs-calendar {
1758
1789
  margin: 0 0 15px 0;
1759
1790
  text-align: center;
1760
1791
  -webkit-user-select: none;
1792
+ -moz-user-select: none;
1761
1793
  -ms-user-select: none;
1762
1794
  user-select: none;
1763
1795
  width: 100%;
1764
1796
  }
1765
1797
  .e-daterangepicker.e-popup .e-range-header .e-start-end,
1766
1798
  .e-bigger.e-small .e-daterangepicker.e-popup .e-range-header .e-start-end {
1767
- -ms-flex-align: center;
1768
- align-items: center;
1799
+ -webkit-box-align: center;
1800
+ -ms-flex-align: center;
1801
+ align-items: center;
1802
+ display: -webkit-box;
1769
1803
  display: -ms-flexbox;
1770
1804
  display: flex;
1771
1805
  height: 35px;
@@ -1834,14 +1868,18 @@ ejs-calendar {
1834
1868
  }
1835
1869
  .e-daterangepicker.e-popup .e-footer,
1836
1870
  .e-bigger.e-small .e-daterangepicker.e-popup .e-footer {
1837
- -ms-flex-align: center;
1838
- align-items: center;
1871
+ -webkit-box-align: center;
1872
+ -ms-flex-align: center;
1873
+ align-items: center;
1839
1874
  border-top: 1px solid #757575;
1840
1875
  clear: both;
1876
+ display: -webkit-box;
1841
1877
  display: -ms-flexbox;
1842
1878
  display: flex;
1843
- -ms-flex-direction: row-reverse;
1844
- flex-direction: row-reverse;
1879
+ -webkit-box-orient: horizontal;
1880
+ -webkit-box-direction: reverse;
1881
+ -ms-flex-direction: row-reverse;
1882
+ flex-direction: row-reverse;
1845
1883
  height: 48px;
1846
1884
  }
1847
1885
  .e-daterangepicker.e-popup .e-footer .e-btn,
@@ -1867,6 +1905,7 @@ ejs-calendar {
1867
1905
  }
1868
1906
  .e-daterangepicker.e-popup .e-calendar-container,
1869
1907
  .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container {
1908
+ display: -webkit-box;
1870
1909
  display: -ms-flexbox;
1871
1910
  display: flex;
1872
1911
  }
@@ -1947,10 +1986,13 @@ ejs-calendar {
1947
1986
  }
1948
1987
  .e-daterangepicker.e-rtl .e-footer,
1949
1988
  .e-bigger.e-small .e-daterangepicker.e-rtl .e-footer {
1950
- -ms-flex-direction: row;
1951
- flex-direction: row;
1952
- -ms-flex-pack: end;
1953
- justify-content: flex-end;
1989
+ -webkit-box-orient: horizontal;
1990
+ -webkit-box-direction: normal;
1991
+ -ms-flex-direction: row;
1992
+ flex-direction: row;
1993
+ -webkit-box-pack: end;
1994
+ -ms-flex-pack: end;
1995
+ justify-content: flex-end;
1954
1996
  }
1955
1997
  .e-daterangepicker.e-rtl .e-footer .e-btn.e-cancel,
1956
1998
  .e-bigger.e-small .e-daterangepicker.e-rtl .e-footer .e-btn.e-cancel {
@@ -1997,15 +2039,19 @@ ejs-calendar {
1997
2039
  .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end,
1998
2040
  *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end,
1999
2041
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end {
2000
- -ms-flex-align: center;
2001
- align-items: center;
2042
+ -webkit-box-align: center;
2043
+ -ms-flex-align: center;
2044
+ align-items: center;
2002
2045
  cursor: pointer;
2046
+ display: -webkit-box;
2003
2047
  display: -ms-flexbox;
2004
2048
  display: flex;
2005
2049
  height: 36px;
2006
- -ms-flex-pack: center;
2007
- justify-content: center;
2050
+ -webkit-box-pack: center;
2051
+ -ms-flex-pack: center;
2052
+ justify-content: center;
2008
2053
  -webkit-user-select: none;
2054
+ -moz-user-select: none;
2009
2055
  -ms-user-select: none;
2010
2056
  user-select: none;
2011
2057
  width: 100%;
@@ -2016,7 +2062,8 @@ ejs-calendar {
2016
2062
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn,
2017
2063
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn {
2018
2064
  border: 1px solid #000;
2019
- box-shadow: none;
2065
+ -webkit-box-shadow: none;
2066
+ box-shadow: none;
2020
2067
  font-size: 16px;
2021
2068
  font-weight: normal;
2022
2069
  height: 32px;
@@ -2043,7 +2090,8 @@ ejs-calendar {
2043
2090
  *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn:hover:not([disabled]),
2044
2091
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn:hover,
2045
2092
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn:hover:not([disabled]) {
2046
- box-shadow: none;
2093
+ -webkit-box-shadow: none;
2094
+ box-shadow: none;
2047
2095
  }
2048
2096
  .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:active:not([disabled]), .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:hover, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:hover,
2049
2097
  *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active,
@@ -2058,7 +2106,8 @@ ejs-calendar {
2058
2106
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:active:not([disabled]),
2059
2107
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:hover,
2060
2108
  *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:hover {
2061
- box-shadow: none;
2109
+ -webkit-box-shadow: none;
2110
+ box-shadow: none;
2062
2111
  }
2063
2112
  .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn,
2064
2113
  *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn,
@@ -2230,15 +2279,20 @@ ejs-calendar {
2230
2279
  }
2231
2280
 
2232
2281
  .e-daterangepick-mob-popup-wrap {
2233
- -ms-flex-align: center;
2234
- align-items: center;
2282
+ -webkit-box-align: center;
2283
+ -ms-flex-align: center;
2284
+ align-items: center;
2285
+ display: -webkit-box;
2235
2286
  display: -ms-flexbox;
2236
2287
  display: flex;
2237
- -ms-flex-direction: column;
2238
- flex-direction: column;
2288
+ -webkit-box-orient: vertical;
2289
+ -webkit-box-direction: normal;
2290
+ -ms-flex-direction: column;
2291
+ flex-direction: column;
2239
2292
  height: 100%;
2240
- -ms-flex-pack: center;
2241
- justify-content: center;
2293
+ -webkit-box-pack: center;
2294
+ -ms-flex-pack: center;
2295
+ justify-content: center;
2242
2296
  left: 0;
2243
2297
  max-height: 100%;
2244
2298
  position: fixed;
@@ -2441,10 +2495,12 @@ ejs-calendar {
2441
2495
  .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header {
2442
2496
  height: 10%;
2443
2497
  padding: 2.5vh 2.5vw 2.5vh 1.5vw;
2498
+ display: -webkit-box;
2444
2499
  display: -ms-flexbox;
2445
2500
  display: flex;
2446
- -ms-flex-align: center;
2447
- align-items: center;
2501
+ -webkit-box-align: center;
2502
+ -ms-flex-align: center;
2503
+ align-items: center;
2448
2504
  font-size: 3vh;
2449
2505
  border-bottom: none;
2450
2506
  }
@@ -2500,8 +2556,6 @@ ejs-calendar {
2500
2556
  max-height: 85%;
2501
2557
  height: 85%;
2502
2558
  }
2503
- }
2504
- @media screen and (orientation: landscape) {
2505
2559
  .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header {
2506
2560
  height: 15%;
2507
2561
  font-size: 18px;
@@ -2512,8 +2566,6 @@ ejs-calendar {
2512
2566
  .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header .e-model-title {
2513
2567
  padding: 1vh 1vw;
2514
2568
  }
2515
- }
2516
- @media screen and (orientation: landscape) {
2517
2569
  .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header {
2518
2570
  width: 100%;
2519
2571
  }
@@ -2585,8 +2637,6 @@ ejs-calendar {
2585
2637
  width: calc(100% - 110px);
2586
2638
  }
2587
2639
 
2588
- /* stylelint-enable */
2589
- /*! daterangepicker theme */
2590
2640
  .e-date-range-wrapper .e-input-group-icon.e-icons.e-active {
2591
2641
  color: #000;
2592
2642
  }
@@ -2792,7 +2842,6 @@ ejs-calendar {
2792
2842
  color: #000;
2793
2843
  }
2794
2844
 
2795
- /* stylelint-disable property-no-vendor-prefix */
2796
2845
  /*! component icons */
2797
2846
  .e-datetime-wrapper .e-time-icon.e-icons::before {
2798
2847
  content: "\e97f";
@@ -2801,6 +2850,7 @@ ejs-calendar {
2801
2850
 
2802
2851
  .e-input-group.e-control-wrapper.e-datetime-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
2803
2852
  .e-float-input.e-control-wrapper.e-input-group.e-datetime-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
2853
+ display: -webkit-box;
2804
2854
  display: -ms-flexbox;
2805
2855
  display: flex;
2806
2856
  }
@@ -2813,13 +2863,15 @@ ejs-calendar {
2813
2863
  font-size: 16px;
2814
2864
  }
2815
2865
  .e-datetime-wrapper.e-control-wrapper {
2816
- box-sizing: border-box;
2866
+ -webkit-box-sizing: border-box;
2867
+ box-sizing: border-box;
2817
2868
  }
2818
2869
  .e-datetime-wrapper .e-time-icon.e-icons.e-disabled, .e-datetime-wrapper .e-date-icon.e-icons.e-disabled {
2819
2870
  pointer-events: none;
2820
2871
  }
2821
2872
  .e-datetime-wrapper .e-clear-icon {
2822
- box-sizing: content-box;
2873
+ -webkit-box-sizing: content-box;
2874
+ box-sizing: content-box;
2823
2875
  }
2824
2876
  .e-datetime-wrapper span {
2825
2877
  cursor: pointer;
@@ -2960,7 +3012,8 @@ ejs-calendar {
2960
3012
  .e-datetimepicker.e-popup {
2961
3013
  border: 1px solid #757575;
2962
3014
  border-radius: 0;
2963
- box-shadow: none;
3015
+ -webkit-box-shadow: none;
3016
+ box-shadow: none;
2964
3017
  }
2965
3018
  .e-datetimepicker.e-popup .e-list-parent.e-ul {
2966
3019
  background-color: #fff;
@@ -1,5 +1,20 @@
1
- @import 'calendar/highcontrast-light.scss';
2
- @import 'timepicker/highcontrast-light.scss';
3
- @import 'datepicker/highcontrast-light.scss';
4
- @import 'daterangepicker/highcontrast-light.scss';
5
- @import 'datetimepicker/highcontrast-light.scss';
1
+ @import 'ej2-base/styles/definition/highcontrast-light.scss';
2
+ @import 'ej2-buttons/styles/button/highcontrast-light-definition.scss';
3
+ @import 'calendar/highcontrast-light-definition.scss';
4
+ @import 'calendar/icons/highcontrast-light.scss';
5
+ @import 'calendar/all.scss';
6
+
7
+ @import 'ej2-inputs/styles/input/highcontrast-light-definition.scss';
8
+ @import 'ej2-popups/styles/popup/highcontrast-light-definition.scss';
9
+ @import 'timepicker/highcontrast-light-definition.scss';
10
+ @import 'timepicker/icons/highcontrast-light.scss';
11
+ @import 'timepicker/all.scss';
12
+ @import 'datepicker/highcontrast-light-definition.scss';
13
+ @import 'datepicker/icons/highcontrast-light.scss';
14
+ @import 'datepicker/all.scss';
15
+ @import 'daterangepicker/highcontrast-light-definition.scss';
16
+ @import 'daterangepicker/icons/highcontrast-light.scss';
17
+ @import 'daterangepicker/all.scss';
18
+ @import 'datetimepicker/highcontrast-light-definition.scss';
19
+ @import 'datetimepicker/icons/highcontrast-light.scss';
20
+ @import 'datetimepicker/all.scss';