@syncfusion/ej2-calendars 25.2.7 → 26.1.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (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 +136 -200
  6. package/dist/es6/ej2-calendars.es2015.js.map +1 -1
  7. package/dist/es6/ej2-calendars.es5.js +131 -196
  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 +21 -26
  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 -1232
package/styles/calendar/material.css CHANGED
@@ -43,6 +43,7 @@ ejs-calendar {
43
43
  display: block;
44
44
  overflow: auto;
45
45
  -webkit-user-select: none;
46
+ -moz-user-select: none;
46
47
  -ms-user-select: none;
47
48
  user-select: none;
48
49
  }
@@ -117,7 +118,8 @@ ejs-calendar {
117
118
  .e-calendar .e-content th, .e-calendar .e-content td,
118
119
  .e-bigger.e-small .e-calendar .e-content th,
119
120
  .e-bigger.e-small .e-calendar .e-content td {
120
- box-sizing: border-box;
121
+ -webkit-box-sizing: border-box;
122
+ box-sizing: border-box;
121
123
  }
122
124
  .e-calendar .e-content td.e-disabled,
123
125
  .e-bigger.e-small .e-calendar .e-content td.e-disabled {
@@ -132,7 +134,8 @@ ejs-calendar {
132
134
  }
133
135
  .e-calendar .e-content td.e-disabled.e-today span.e-day,
134
136
  .e-bigger.e-small .e-calendar .e-content td.e-disabled.e-today span.e-day {
135
- box-shadow: inset 1px 0 #e3165b, inset 0 1px #e3165b, inset -1px 0 #e3165b, inset 0 -1px #e3165b;
137
+ -webkit-box-shadow: inset 1px 0 #e3165b, inset 0 1px #e3165b, inset -1px 0 #e3165b, inset 0 -1px #e3165b;
138
+ box-shadow: inset 1px 0 #e3165b, inset 0 1px #e3165b, inset -1px 0 #e3165b, inset 0 -1px #e3165b;
136
139
  color: #ccc;
137
140
  }
138
141
  .e-calendar .e-content td,
@@ -360,12 +363,16 @@ ejs-calendar {
360
363
  background-color: #fff;
361
364
  border-top: none;
362
365
  cursor: default;
366
+ display: -webkit-box;
363
367
  display: -ms-flexbox;
364
368
  display: flex;
365
- -ms-flex-direction: row;
366
- flex-direction: row;
367
- -ms-flex-pack: end;
368
- justify-content: flex-end;
369
+ -webkit-box-orient: horizontal;
370
+ -webkit-box-direction: normal;
371
+ -ms-flex-direction: row;
372
+ flex-direction: row;
373
+ -webkit-box-pack: end;
374
+ -ms-flex-pack: end;
375
+ justify-content: flex-end;
369
376
  padding: 0 10px 10px 10px;
370
377
  text-align: center;
371
378
  width: 100%;
@@ -549,7 +556,8 @@ ejs-calendar {
549
556
  .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 {
550
557
  background: transparent;
551
558
  border-color: transparent;
552
- box-shadow: none;
559
+ -webkit-box-shadow: none;
560
+ box-shadow: none;
553
561
  color: rgba(0, 0, 0, 0.26);
554
562
  cursor: default;
555
563
  opacity: 0.35;
@@ -574,7 +582,8 @@ ejs-calendar {
574
582
  .e-bigger.e-small .e-calendar {
575
583
  background-color: #fff;
576
584
  border: 1px solid rgba(0, 0, 0, 0.12);
577
- box-shadow: none;
585
+ -webkit-box-shadow: none;
586
+ box-shadow: none;
578
587
  }
579
588
  .e-calendar .e-date-icon-prev, .e-calendar .e-date-icon-next,
580
589
  .e-bigger.e-small .e-calendar .e-date-icon-prev,
@@ -607,13 +616,15 @@ ejs-calendar {
607
616
  }
608
617
  .e-calendar .e-header .e-title:focus,
609
618
  .e-bigger.e-small .e-calendar .e-header .e-title:focus {
610
- box-shadow: 0 0 0 1px #212121;
619
+ -webkit-box-shadow: 0 0 0 1px #212121;
620
+ box-shadow: 0 0 0 1px #212121;
611
621
  background: none;
612
622
  text-decoration: none;
613
623
  }
614
624
  .e-calendar .e-header .e-title:active,
615
625
  .e-bigger.e-small .e-calendar .e-header .e-title:active {
616
- box-shadow: none;
626
+ -webkit-box-shadow: none;
627
+ box-shadow: none;
617
628
  background: #fff;
618
629
  text-decoration: none;
619
630
  }
@@ -632,7 +643,8 @@ ejs-calendar {
632
643
  .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
633
644
  .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
634
645
  .e-bigger.e-small .e-calendar .e-header .e-next:focus {
635
- box-shadow: 0 0 0 1px #212121;
646
+ -webkit-box-shadow: 0 0 0 1px #212121;
647
+ box-shadow: 0 0 0 1px #212121;
636
648
  }
637
649
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
638
650
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
@@ -678,11 +690,6 @@ ejs-calendar {
678
690
  .e-bigger.e-small .e-calendar .e-content.e-decade tr:last-child .e-cell.e-disabled:last-child span.e-day {
679
691
  color: rgba(0, 0, 0, 0.87);
680
692
  }
681
- .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
682
- .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
683
- .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
684
- background-color: #eee;
685
- }
686
693
  .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,
687
694
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,
688
695
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected:hover span.e-day {
@@ -704,7 +711,8 @@ ejs-calendar {
704
711
  background: #eee;
705
712
  border: none;
706
713
  border-radius: 50%;
707
- box-shadow: none;
714
+ -webkit-box-shadow: none;
715
+ box-shadow: none;
708
716
  }
709
717
  .e-calendar .e-content td.e-focused-date:hover span.e-day,
710
718
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date:hover span.e-day {
@@ -719,14 +727,16 @@ ejs-calendar {
719
727
  background: none;
720
728
  border: 1px solid #e3165b;
721
729
  border-radius: 50%;
722
- box-shadow: none;
730
+ -webkit-box-shadow: none;
731
+ box-shadow: none;
723
732
  color: #e3165b;
724
733
  }
725
734
  .e-calendar .e-content td.e-focused-date.e-today span.e-day,
726
735
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date.e-today span.e-day {
727
736
  background: #eee;
728
737
  border: 1px solid #e3165b;
729
- box-shadow: none;
738
+ -webkit-box-shadow: none;
739
+ box-shadow: none;
730
740
  color: #e3165b;
731
741
  }
732
742
  .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,
@@ -749,7 +759,8 @@ ejs-calendar {
749
759
  .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected span.e-day {
750
760
  background-color: #e3165b;
751
761
  border: 1px solid #e3165b;
752
- box-shadow: inset 0 0 0 2px #fff;
762
+ -webkit-box-shadow: inset 0 0 0 2px #fff;
763
+ box-shadow: inset 0 0 0 2px #fff;
753
764
  color: #fff;
754
765
  }
755
766
  .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,
@@ -814,9 +825,9 @@ ejs-calendar {
814
825
  .e-calendar .e-content td.e-selected span.e-day,
815
826
  .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day {
816
827
  background-color: #e3165b;
828
+ color: #fff;
817
829
  border: none;
818
830
  border-radius: 50%;
819
- color: #fff;
820
831
  }
821
832
  .e-calendar .e-content .e-footer,
822
833
  .e-bigger.e-small .e-calendar .e-content .e-footer {
@@ -842,18 +853,33 @@ ejs-calendar {
842
853
  }
843
854
 
844
855
  .e-calendar .e-zoomin {
845
- animation: animatezoom 0.3s;
856
+ -webkit-animation: animatezoom 0.3s;
857
+ animation: animatezoom 0.3s;
858
+ }
859
+
860
+ @-webkit-keyframes animatezoom {
861
+ from {
862
+ -webkit-transform: scale(0);
863
+ transform: scale(0);
864
+ }
865
+ to {
866
+ -webkit-transform: scale(1);
867
+ transform: scale(1);
868
+ }
846
869
  }
847
870
 
848
871
  @keyframes animatezoom {
849
872
  from {
850
- transform: scale(0);
873
+ -webkit-transform: scale(0);
874
+ transform: scale(0);
851
875
  }
852
876
  to {
853
- transform: scale(1);
877
+ -webkit-transform: scale(1);
878
+ transform: scale(1);
854
879
  }
855
880
  }
856
881
  .e-calendar .e-calendar-content-table .e-cell.e-focused-cell span.e-day {
857
- box-shadow: 0 0 0 1px #212121;
882
+ -webkit-box-shadow: 0 0 0 1px #212121;
883
+ box-shadow: 0 0 0 1px #212121;
858
884
  border-radius: 50%;
859
885
  }
package/styles/calendar/material3-dark.css CHANGED
@@ -44,7 +44,7 @@
44
44
  --color-sf-on-warning: 99, 52, 0;
45
45
  --color-sf-on-warning-container: 255, 220, 193;
46
46
  --color-sf-spreadsheet-gridline: 231, 224, 236;
47
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
47
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
48
48
  --color-sf-success-text: 0, 0, 0;
49
49
  --color-sf-warning-text: 0, 0, 0;
50
50
  --color-sf-info-text: 0, 0, 0;
@@ -53,7 +53,6 @@
53
53
  --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
54
54
  }
55
55
 
56
- /*! calendar material3 theme variables */
57
56
  /*! component icons */
58
57
  .e-calendar .e-header .e-date-icon-prev::before {
59
58
  content: "\e765";
@@ -98,6 +97,7 @@ ejs-calendar {
98
97
  display: block;
99
98
  overflow: auto;
100
99
  -webkit-user-select: none;
100
+ -moz-user-select: none;
101
101
  -ms-user-select: none;
102
102
  user-select: none;
103
103
  }
@@ -172,7 +172,8 @@ ejs-calendar {
172
172
  .e-calendar .e-content th, .e-calendar .e-content td,
173
173
  .e-bigger.e-small .e-calendar .e-content th,
174
174
  .e-bigger.e-small .e-calendar .e-content td {
175
- box-sizing: border-box;
175
+ -webkit-box-sizing: border-box;
176
+ box-sizing: border-box;
176
177
  }
177
178
  .e-calendar .e-content td.e-disabled,
178
179
  .e-bigger.e-small .e-calendar .e-content td.e-disabled {
@@ -187,7 +188,8 @@ ejs-calendar {
187
188
  }
188
189
  .e-calendar .e-content td.e-disabled.e-today span.e-day,
189
190
  .e-bigger.e-small .e-calendar .e-content td.e-disabled.e-today span.e-day {
190
- box-shadow: none;
191
+ -webkit-box-shadow: none;
192
+ box-shadow: none;
191
193
  color: rgba(var(--color-sf-on-surface), 0.38);
192
194
  }
193
195
  .e-calendar .e-content td,
@@ -417,12 +419,16 @@ ejs-calendar {
417
419
  background: transparent;
418
420
  border-top: none;
419
421
  cursor: default;
422
+ display: -webkit-box;
420
423
  display: -ms-flexbox;
421
424
  display: flex;
422
- -ms-flex-direction: row;
423
- flex-direction: row;
424
- -ms-flex-pack: end;
425
- justify-content: flex-end;
425
+ -webkit-box-orient: horizontal;
426
+ -webkit-box-direction: normal;
427
+ -ms-flex-direction: row;
428
+ flex-direction: row;
429
+ -webkit-box-pack: end;
430
+ -ms-flex-pack: end;
431
+ justify-content: flex-end;
426
432
  padding: 8px 12px 8px 12px;
427
433
  text-align: center;
428
434
  width: 100%;
@@ -556,7 +562,6 @@ ejs-calendar {
556
562
  max-width: 252px;
557
563
  min-width: 240px;
558
564
  padding: 0;
559
- min-height: 220px;
560
565
  }
561
566
  .e-small.e-calendar.e-calendar-day-header-lg,
562
567
  .e-small .e-calendar.e-calendar-day-header-lg {
@@ -607,7 +612,8 @@ ejs-calendar {
607
612
  .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 {
608
613
  background: transparent;
609
614
  border-color: transparent;
610
- box-shadow: none;
615
+ -webkit-box-shadow: none;
616
+ box-shadow: none;
611
617
  color: rgba(var(--color-sf-on-surface), 0.38);
612
618
  cursor: default;
613
619
  opacity: 0.35;
@@ -633,7 +639,8 @@ ejs-calendar {
633
639
  background: transparent;
634
640
  border-radius: 8px;
635
641
  border: 1px solid rgba(var(--color-sf-outline-variant));
636
- box-shadow: none;
642
+ -webkit-box-shadow: none;
643
+ box-shadow: none;
637
644
  }
638
645
  .e-calendar .e-date-icon-prev, .e-calendar .e-date-icon-next,
639
646
  .e-bigger.e-small .e-calendar .e-date-icon-prev,
@@ -666,13 +673,15 @@ ejs-calendar {
666
673
  }
667
674
  .e-calendar .e-header .e-title:focus,
668
675
  .e-bigger.e-small .e-calendar .e-header .e-title:focus {
669
- box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
676
+ -webkit-box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
677
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
670
678
  background: none;
671
679
  text-decoration: none;
672
680
  }
673
681
  .e-calendar .e-header .e-title:active,
674
682
  .e-bigger.e-small .e-calendar .e-header .e-title:active {
675
- box-shadow: none;
683
+ -webkit-box-shadow: none;
684
+ box-shadow: none;
676
685
  background: rgba(var(--color-sf-on-surface), 0.12);
677
686
  text-decoration: none;
678
687
  }
@@ -691,7 +700,8 @@ ejs-calendar {
691
700
  .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
692
701
  .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
693
702
  .e-bigger.e-small .e-calendar .e-header .e-next:focus {
694
- box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
703
+ -webkit-box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
704
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
695
705
  }
696
706
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
697
707
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
@@ -763,7 +773,8 @@ ejs-calendar {
763
773
  background: rgba(var(--color-sf-on-surface), 0.05);
764
774
  border: none;
765
775
  border-radius: 32px;
766
- box-shadow: none;
776
+ -webkit-box-shadow: none;
777
+ box-shadow: none;
767
778
  }
768
779
  .e-calendar .e-content td.e-focused-date:hover span.e-day,
769
780
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date:hover span.e-day {
@@ -778,14 +789,16 @@ ejs-calendar {
778
789
  background: none;
779
790
  border: 1px solid rgba(var(--color-sf-primary));
780
791
  border-radius: 32px;
781
- box-shadow: none;
792
+ -webkit-box-shadow: none;
793
+ box-shadow: none;
782
794
  color: rgba(var(--color-sf-primary));
783
795
  }
784
796
  .e-calendar .e-content td.e-focused-date.e-today span.e-day,
785
797
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date.e-today span.e-day {
786
798
  background: rgba(var(--color-sf-primary), 0.08);
787
799
  border: 1px solid rgba(var(--color-sf-primary));
788
- box-shadow: none;
800
+ -webkit-box-shadow: none;
801
+ box-shadow: none;
789
802
  color: rgba(var(--color-sf-primary));
790
803
  }
791
804
  .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,
@@ -808,7 +821,8 @@ ejs-calendar {
808
821
  .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected span.e-day {
809
822
  background: rgba(var(--color-sf-primary));
810
823
  border: 1px solid rgba(var(--color-sf-primary));
811
- box-shadow: inset 0 0 0 2px linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
824
+ -webkit-box-shadow: inset 0 0 0 2px linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
825
+ box-shadow: inset 0 0 0 2px linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
812
826
  color: rgba(var(--color-sf-on-primary));
813
827
  }
814
828
  .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,
@@ -873,9 +887,9 @@ ejs-calendar {
873
887
  .e-calendar .e-content td.e-selected span.e-day,
874
888
  .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day {
875
889
  background: rgba(var(--color-sf-primary));
890
+ color: rgba(var(--color-sf-on-primary));
876
891
  border: none;
877
892
  border-radius: 32px;
878
- color: rgba(var(--color-sf-on-primary));
879
893
  }
880
894
  .e-calendar .e-content .e-footer,
881
895
  .e-bigger.e-small .e-calendar .e-content .e-footer {
@@ -901,18 +915,33 @@ ejs-calendar {
901
915
  }
902
916
 
903
917
  .e-calendar .e-zoomin {
904
- animation: animatezoom 0.3s;
918
+ -webkit-animation: animatezoom 0.3s;
919
+ animation: animatezoom 0.3s;
920
+ }
921
+
922
+ @-webkit-keyframes animatezoom {
923
+ from {
924
+ -webkit-transform: scale(0);
925
+ transform: scale(0);
926
+ }
927
+ to {
928
+ -webkit-transform: scale(1);
929
+ transform: scale(1);
930
+ }
905
931
  }
906
932
 
907
933
  @keyframes animatezoom {
908
934
  from {
909
- transform: scale(0);
935
+ -webkit-transform: scale(0);
936
+ transform: scale(0);
910
937
  }
911
938
  to {
912
- transform: scale(1);
939
+ -webkit-transform: scale(1);
940
+ transform: scale(1);
913
941
  }
914
942
  }
915
943
  .e-calendar .e-calendar-content-table .e-cell.e-focused-cell span.e-day {
916
- box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
944
+ -webkit-box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
945
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
917
946
  border-radius: 32px;
918
947
  }
package/styles/calendar/material3.css CHANGED
@@ -100,7 +100,7 @@
100
100
  --color-sf-on-warning: 99, 52, 0;
101
101
  --color-sf-on-warning-container: 255, 220, 193;
102
102
  --color-sf-spreadsheet-gridline: 231, 224, 236;
103
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
103
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
104
104
  --color-sf-success-text: 0, 0, 0;
105
105
  --color-sf-warning-text: 0, 0, 0;
106
106
  --color-sf-info-text: 0, 0, 0;
@@ -109,7 +109,6 @@
109
109
  --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
110
110
  }
111
111
 
112
- /*! calendar material3 theme variables */
113
112
  /*! component icons */
114
113
  .e-calendar .e-header .e-date-icon-prev::before {
115
114
  content: "\e765";
@@ -154,6 +153,7 @@ ejs-calendar {
154
153
  display: block;
155
154
  overflow: auto;
156
155
  -webkit-user-select: none;
156
+ -moz-user-select: none;
157
157
  -ms-user-select: none;
158
158
  user-select: none;
159
159
  }
@@ -228,7 +228,8 @@ ejs-calendar {
228
228
  .e-calendar .e-content th, .e-calendar .e-content td,
229
229
  .e-bigger.e-small .e-calendar .e-content th,
230
230
  .e-bigger.e-small .e-calendar .e-content td {
231
- box-sizing: border-box;
231
+ -webkit-box-sizing: border-box;
232
+ box-sizing: border-box;
232
233
  }
233
234
  .e-calendar .e-content td.e-disabled,
234
235
  .e-bigger.e-small .e-calendar .e-content td.e-disabled {
@@ -243,7 +244,8 @@ ejs-calendar {
243
244
  }
244
245
  .e-calendar .e-content td.e-disabled.e-today span.e-day,
245
246
  .e-bigger.e-small .e-calendar .e-content td.e-disabled.e-today span.e-day {
246
- box-shadow: none;
247
+ -webkit-box-shadow: none;
248
+ box-shadow: none;
247
249
  color: rgba(var(--color-sf-on-surface), 0.38);
248
250
  }
249
251
  .e-calendar .e-content td,
@@ -473,12 +475,16 @@ ejs-calendar {
473
475
  background: transparent;
474
476
  border-top: none;
475
477
  cursor: default;
478
+ display: -webkit-box;
476
479
  display: -ms-flexbox;
477
480
  display: flex;
478
- -ms-flex-direction: row;
479
- flex-direction: row;
480
- -ms-flex-pack: end;
481
- justify-content: flex-end;
481
+ -webkit-box-orient: horizontal;
482
+ -webkit-box-direction: normal;
483
+ -ms-flex-direction: row;
484
+ flex-direction: row;
485
+ -webkit-box-pack: end;
486
+ -ms-flex-pack: end;
487
+ justify-content: flex-end;
482
488
  padding: 8px 12px 8px 12px;
483
489
  text-align: center;
484
490
  width: 100%;
@@ -612,7 +618,6 @@ ejs-calendar {
612
618
  max-width: 252px;
613
619
  min-width: 240px;
614
620
  padding: 0;
615
- min-height: 220px;
616
621
  }
617
622
  .e-small.e-calendar.e-calendar-day-header-lg,
618
623
  .e-small .e-calendar.e-calendar-day-header-lg {
@@ -663,7 +668,8 @@ ejs-calendar {
663
668
  .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 {
664
669
  background: transparent;
665
670
  border-color: transparent;
666
- box-shadow: none;
671
+ -webkit-box-shadow: none;
672
+ box-shadow: none;
667
673
  color: rgba(var(--color-sf-on-surface), 0.38);
668
674
  cursor: default;
669
675
  opacity: 0.35;
@@ -689,7 +695,8 @@ ejs-calendar {
689
695
  background: transparent;
690
696
  border-radius: 8px;
691
697
  border: 1px solid rgba(var(--color-sf-outline-variant));
692
- box-shadow: none;
698
+ -webkit-box-shadow: none;
699
+ box-shadow: none;
693
700
  }
694
701
  .e-calendar .e-date-icon-prev, .e-calendar .e-date-icon-next,
695
702
  .e-bigger.e-small .e-calendar .e-date-icon-prev,
@@ -722,13 +729,15 @@ ejs-calendar {
722
729
  }
723
730
  .e-calendar .e-header .e-title:focus,
724
731
  .e-bigger.e-small .e-calendar .e-header .e-title:focus {
725
- box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
732
+ -webkit-box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
733
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
726
734
  background: none;
727
735
  text-decoration: none;
728
736
  }
729
737
  .e-calendar .e-header .e-title:active,
730
738
  .e-bigger.e-small .e-calendar .e-header .e-title:active {
731
- box-shadow: none;
739
+ -webkit-box-shadow: none;
740
+ box-shadow: none;
732
741
  background: rgba(var(--color-sf-on-surface), 0.12);
733
742
  text-decoration: none;
734
743
  }
@@ -747,7 +756,8 @@ ejs-calendar {
747
756
  .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
748
757
  .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
749
758
  .e-bigger.e-small .e-calendar .e-header .e-next:focus {
750
- box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
759
+ -webkit-box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
760
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
751
761
  }
752
762
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
753
763
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
@@ -819,7 +829,8 @@ ejs-calendar {
819
829
  background: rgba(var(--color-sf-on-surface), 0.05);
820
830
  border: none;
821
831
  border-radius: 32px;
822
- box-shadow: none;
832
+ -webkit-box-shadow: none;
833
+ box-shadow: none;
823
834
  }
824
835
  .e-calendar .e-content td.e-focused-date:hover span.e-day,
825
836
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date:hover span.e-day {
@@ -834,14 +845,16 @@ ejs-calendar {
834
845
  background: none;
835
846
  border: 1px solid rgba(var(--color-sf-primary));
836
847
  border-radius: 32px;
837
- box-shadow: none;
848
+ -webkit-box-shadow: none;
849
+ box-shadow: none;
838
850
  color: rgba(var(--color-sf-primary));
839
851
  }
840
852
  .e-calendar .e-content td.e-focused-date.e-today span.e-day,
841
853
  .e-bigger.e-small .e-calendar .e-content td.e-focused-date.e-today span.e-day {
842
854
  background: rgba(var(--color-sf-primary), 0.08);
843
855
  border: 1px solid rgba(var(--color-sf-primary));
844
- box-shadow: none;
856
+ -webkit-box-shadow: none;
857
+ box-shadow: none;
845
858
  color: rgba(var(--color-sf-primary));
846
859
  }
847
860
  .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,
@@ -864,7 +877,8 @@ ejs-calendar {
864
877
  .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected span.e-day {
865
878
  background: rgba(var(--color-sf-primary));
866
879
  border: 1px solid rgba(var(--color-sf-primary));
867
- box-shadow: inset 0 0 0 2px linear-gradient(0deg, rgba(var(--color-sf-surface), 1), rgba(var(--color-sf-surface), 1)), rgba(var(--color-sf-surface));
880
+ -webkit-box-shadow: inset 0 0 0 2px linear-gradient(0deg, rgba(var(--color-sf-surface), 1), rgba(var(--color-sf-surface), 1)), rgba(var(--color-sf-surface));
881
+ box-shadow: inset 0 0 0 2px linear-gradient(0deg, rgba(var(--color-sf-surface), 1), rgba(var(--color-sf-surface), 1)), rgba(var(--color-sf-surface));
868
882
  color: rgba(var(--color-sf-on-primary));
869
883
  }
870
884
  .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,
@@ -929,9 +943,9 @@ ejs-calendar {
929
943
  .e-calendar .e-content td.e-selected span.e-day,
930
944
  .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day {
931
945
  background: rgba(var(--color-sf-primary));
946
+ color: rgba(var(--color-sf-on-primary));
932
947
  border: none;
933
948
  border-radius: 32px;
934
- color: rgba(var(--color-sf-on-primary));
935
949
  }
936
950
  .e-calendar .e-content .e-footer,
937
951
  .e-bigger.e-small .e-calendar .e-content .e-footer {
@@ -957,18 +971,33 @@ ejs-calendar {
957
971
  }
958
972
 
959
973
  .e-calendar .e-zoomin {
960
- animation: animatezoom 0.3s;
974
+ -webkit-animation: animatezoom 0.3s;
975
+ animation: animatezoom 0.3s;
976
+ }
977
+
978
+ @-webkit-keyframes animatezoom {
979
+ from {
980
+ -webkit-transform: scale(0);
981
+ transform: scale(0);
982
+ }
983
+ to {
984
+ -webkit-transform: scale(1);
985
+ transform: scale(1);
986
+ }
961
987
  }
962
988
 
963
989
  @keyframes animatezoom {
964
990
  from {
965
- transform: scale(0);
991
+ -webkit-transform: scale(0);
992
+ transform: scale(0);
966
993
  }
967
994
  to {
968
- transform: scale(1);
995
+ -webkit-transform: scale(1);
996
+ transform: scale(1);
969
997
  }
970
998
  }
971
999
  .e-calendar .e-calendar-content-table .e-cell.e-focused-cell span.e-day {
972
- box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
1000
+ -webkit-box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
1001
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
973
1002
  border-radius: 32px;
974
1003
  }