@syncfusion/ej2-calendars 27.2.2 → 28.1.33

package/styles/fluent-lite.css

@@ -295,6 +295,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: transparent;
   border-top: 0 solid #edebe9;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -307,7 +308,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -2377,6 +2377,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/fluent.css

@@ -295,6 +295,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: transparent;
   border-top: 0 solid #edebe9;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -307,7 +308,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1424,6 +1424,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background-color: transparent;
   border-top: 0 solid #edebe9;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1436,7 +1437,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3810,6 +3810,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/fluent2-lite.css

@@ -5,6 +5,10 @@
 
 
 /*! calendar theme variables */
+.e-small:not(.e-bigger) .e-calendar.e-week-number {
+  min-width: 230px;
+}
+
 /*! component icons */
 .e-calendar .e-header .e-date-icon-prev::before {
   content: "\e7df";
@@ -234,7 +238,7 @@ ejs-calendar {
   min-width: 540px;
 }
 .e-calendar.e-week-number {
-  min-width: 262px;
+  min-width: 280px;
 }
 .e-calendar.e-week {
   max-width: 294px;
@@ -305,6 +309,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background: var(--color-sf-content-bg-color-alt1);
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -317,7 +322,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 8px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1611,6 +1615,10 @@ ejs-calendar {
   color: var(--color-sf-icon-color);
 }
 
+.e-bigger.e-daterangepicker .e-calendar.e-week-number {
+  max-width: 350px;
+}
+
 /*! component icons */
 .e-input-group-icon.e-range-icon,
 *.e-control-wrapper .e-input-group-icon.e-range-icon {
@@ -2455,6 +2463,8 @@ ejs-calendar {
 .e-datetime-wrapper .e-clear-icon {
   -webkit-box-sizing: content-box;
           box-sizing: content-box;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
 }
 .e-datetime-wrapper span {
   cursor: pointer;
@@ -2474,6 +2484,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/fluent2.css

@@ -5,6 +5,10 @@
 
 
 /*! calendar theme variables */
+.e-small:not(.e-bigger) .e-calendar.e-week-number {
+  min-width: 230px;
+}
+
 /*! component icons */
 .e-calendar .e-header .e-date-icon-prev::before {
   content: "\e7df";
@@ -234,7 +238,7 @@ ejs-calendar {
   min-width: 540px;
 }
 .e-calendar.e-week-number {
-  min-width: 262px;
+  min-width: 280px;
 }
 .e-calendar.e-week {
   max-width: 294px;
@@ -305,6 +309,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background: var(--color-sf-content-bg-color-alt1);
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -317,7 +322,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 8px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -740,8 +744,8 @@ ejs-calendar {
 
 .e-bigger.e-calendar,
 *.e-bigger .e-calendar {
-  max-width: 280px;
-  min-width: 280px;
+  max-width: 300px;
+  min-width: 300px;
   padding: 0;
 }
 .e-bigger.e-calendar.e-calendar-day-header-lg,
@@ -756,7 +760,7 @@ ejs-calendar {
 }
 .e-bigger.e-calendar.e-week-number,
 *.e-bigger .e-calendar.e-week-number {
-  min-width: 300px;
+  min-width: 335px;
 }
 .e-bigger.e-calendar .e-header .e-title,
 *.e-bigger .e-calendar .e-header .e-title {
@@ -1316,7 +1320,7 @@ ejs-calendar {
   min-width: 540px;
 }
 .e-bigger.e-small .e-calendar.e-week-number {
-  min-width: 262px;
+  min-width: 280px;
 }
 .e-bigger.e-small .e-calendar.e-week {
   max-width: 294px;
@@ -1387,6 +1391,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background: var(--color-sf-content-bg-color-alt1);
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1399,7 +1404,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 8px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -2369,6 +2373,10 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-bigger.e-daterangepicker .e-calendar.e-week-number {
+  max-width: 350px;
+}
+
 /*! component icons */
 .e-input-group-icon.e-range-icon,
 *.e-control-wrapper .e-input-group-icon.e-range-icon {
@@ -3318,7 +3326,7 @@ ejs-calendar {
 .e-bigger .e-daterangepicker .e-calendar,
 *.e-bigger.e-daterangepicker .e-calendar,
 *.e-device.e-daterangepicker .e-calendar {
-  max-width: 296px;
+  max-width: 320px;
   padding: 0 16px 12px;
 }
 .e-bigger .e-daterangepicker .e-calendar .e-content table,
@@ -3869,6 +3877,8 @@ ejs-calendar {
 .e-datetime-wrapper .e-clear-icon {
   -webkit-box-sizing: content-box;
           box-sizing: content-box;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
 }
 .e-datetime-wrapper span {
   cursor: pointer;
@@ -3888,6 +3898,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/highcontrast-light-lite.css

@@ -282,6 +282,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #fff;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -294,7 +295,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -2127,6 +2127,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/highcontrast-light.css

@@ -282,6 +282,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #fff;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -294,7 +295,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1163,6 +1163,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background-color: #fff;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1175,7 +1176,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3413,6 +3413,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/highcontrast-lite.css

@@ -291,6 +291,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #000;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -303,7 +304,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -2136,6 +2136,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/highcontrast.css

@@ -291,6 +291,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #000;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -303,7 +304,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1180,6 +1180,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background-color: #000;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1192,7 +1193,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3430,6 +3430,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material-dark-lite.css

@@ -290,6 +290,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #303030;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -302,7 +303,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 10px 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -2213,6 +2213,12 @@ ejs-calendar {
   margin: 0 6px 4px 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material-dark.css

@@ -290,6 +290,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #303030;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -302,7 +303,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 10px 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1179,6 +1179,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background-color: #303030;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1191,7 +1192,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 10px 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3558,6 +3558,12 @@ ejs-calendar {
   margin: 0 6px 4px 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material-lite.css

@@ -291,6 +291,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #fff;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -303,7 +304,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -2243,6 +2243,12 @@ ejs-calendar {
   margin: 0 6px 4px 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material.css

@@ -291,6 +291,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background-color: #fff;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -303,7 +304,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1180,6 +1180,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background-color: #fff;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1192,7 +1193,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 0 10px 10px 10px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3593,6 +3593,12 @@ ejs-calendar {
   margin: 0 6px 4px 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material3-dark-lite.css

@@ -294,6 +294,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background: transparent;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -306,7 +307,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 12px 8px 12px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -2258,6 +2258,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material3-dark.css

@@ -294,6 +294,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background: transparent;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -306,7 +307,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 12px 8px 12px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1193,6 +1193,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background: transparent;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1205,7 +1206,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 12px 8px 12px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3620,6 +3620,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material3-lite.css

@@ -296,6 +296,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background: transparent;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -308,7 +309,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 12px 8px 12px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -2260,6 +2260,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;

package/styles/material3.css

@@ -296,6 +296,7 @@ ejs-calendar {
 .e-calendar .e-footer-container {
   background: transparent;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -308,7 +309,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 12px 8px 12px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-calendar,
@@ -1195,6 +1195,7 @@ ejs-calendar {
 .e-bigger.e-small .e-calendar .e-footer-container {
   background: transparent;
   border-top: none;
+  text-align: center;
   cursor: default;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -1207,7 +1208,6 @@ ejs-calendar {
       -ms-flex-pack: end;
           justify-content: flex-end;
   padding: 8px 12px 8px 12px;
-  text-align: center;
   width: 100%;
 }
 .e-small.e-bigger.e-calendar .e-content.e-year span.e-day,
@@ -3622,6 +3622,12 @@ ejs-calendar {
   margin: 0;
 }
 
+.e-control.e-datetimepicker.e-popup-wrapper.e-popup-container.e-popup-expand.e-popup.e-popup-open .e-datetime-mob-popup-wrap {
+  -webkit-box-align: normal;
+      -ms-flex-align: normal;
+          align-items: normal;
+}
+
 .e-datetime-mob-popup-wrap {
   -webkit-box-align: center;
       -ms-flex-align: center;