npm - @syncfusion/ej2-angular-calendars - Versions diffs - 21.2.10 → 22.1.34 - Mend

@syncfusion/ej2-angular-calendars 21.2.10 → 22.1.34

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 (500) hide show

package/styles/calendar/_bootstrap-dark-definition.scss CHANGED Viewed

@@ -111,7 +111,7 @@ $calendar-decade-title-left-margin-style: 15px !default;
 // end year decade
 //other months
-$calendar-other-month-display-style: block !default;
+$calendar-other-month-display-style: inline-block !default;
 $calendar-other-month-row-display-style: none !default;
 $calendar-other-month-date: $grey-lighter !default;
 $calendar-other-month-date-hover-bg: $grey-lighter !default;

package/styles/calendar/_bootstrap4-definition.scss CHANGED Viewed

@@ -67,7 +67,7 @@ $calendar-normal-min-width: 256px !default;
 $calendar-small-max-width: $calendar-normal-max-width !default;
 $calendar-small-min-width: $calendar-normal-min-width !default;
 $calendar-bigger-max-width: 310px !default;
-$calendar-bigger-min-width: 306px !default;
+$calendar-bigger-min-width: 300px !default;
 $calendar-weeknumber-min-width: 300px !default;
 $calendar-weeknumber-bigger-width: 325px !default;
 $calendar-border-style: 1px solid rgba($black, .15) !default;

package/styles/calendar/_layout.scss CHANGED Viewed

@@ -233,10 +233,19 @@
   //normal style
   #{&}.e-calendar,
   .e-bigger.e-small #{&}.e-calendar {
-    border-spacing: 0;
-    max-width: $calendar-normal-max-width;
-    min-width: $calendar-normal-min-width;
-    padding: $calendar-popup-padding;
+    @if $skin-name != 'Material3' {
+      border-spacing: 0;
+      max-width: $calendar-normal-max-width;
+      min-width: $calendar-normal-min-width;
+      padding: $calendar-popup-padding;
+    }
+    @else {
+      border-spacing: 0;
+      max-width: $calendar-normal-max-width;
+      min-width: $calendar-normal-min-width;
+      padding: $calendar-popup-padding;
+      min-height: $calendar-normal-min-height;
+    }
     #{if(&, '&', '*')}.e-calendar-day-header-lg {
       max-width: $calendar-lg-day-header-format-max-width;
@@ -313,15 +322,30 @@
     }
     #{if(&, '&', '*')} .e-content.e-year td,
     #{if(&, '&', '*')} .e-content.e-decade td {
-      height: $calendar-normal-year-decade-height;
-      padding: $calendar-normal-year-decade-padding;
+      @if $skin-name != 'Material3' {
+        height: $calendar-normal-year-decade-height;
+        padding: $calendar-normal-year-decade-padding;
+      }
+      @else {
+        height: $calendar-normal-year-decade-height;
+        padding: $calendar-normal-year-decade-padding;
+        width: $calendar-normal-year-decade-width;
+      }
     }
     #{if(&, '&', '*')} .e-content.e-year td > span.e-day,
     #{if(&, '&', '*')} .e-content.e-decade td > span.e-day {
-      font-weight: $calendar-yeardecade-font-weight;
-      height: $calendar-normal-year-decade-height;
-      line-height: $calendar-normal-year-decade-height;
-      width: $calendar-normal-year-decade-width;
+      @if $skin-name != 'Material3' {
+        font-weight: $calendar-yeardecade-font-weight;
+        height: $calendar-normal-year-decade-height;
+        line-height: $calendar-normal-year-decade-height;
+        width: $calendar-normal-year-decade-width;
+      }
+      @else {
+        font-weight: $calendar-yeardecade-font-weight;
+        height: $calendar-normal-year-decade-height-inside;
+        line-height: $calendar-normal-year-decade-height-inside;
+        width: $calendar-normal-year-decade-width;
+      }
     }
     #{if(&, '&', '*')} .e-content.e-year td.e-selected:not(.e-focused-date) > span.e-day,
     #{if(&, '&', '*')} .e-content.e-decade td.e-selected:not(.e-focused-date) > span.e-day,
@@ -545,14 +569,28 @@
     }
     #{if(&, '&', '*')} .e-content.e-year td,
     #{if(&, '&', '*')} .e-content.e-decade td {
-      height: $calendar-bigger-year-decade-height;
-      padding: $calendar-bigger-year-decade-padding;
+      @if $skin-name != 'Material3' {
+        height: $calendar-bigger-year-decade-height;
+        padding: $calendar-bigger-year-decade-padding;
+      }
+      @else {
+        height: $calendar-bigger-year-decade-height;
+        padding: $calendar-bigger-year-decade-padding;
+        width: $calendar-bigger-year-decade-width;
+      }
     }
     #{if(&, '&', '*')} .e-content.e-year td > span.e-day,
     #{if(&, '&', '*')} .e-content.e-decade td > span.e-day {
-      height: $calendar-bigger-year-decade-height;
-      line-height: $calendar-bigger-year-decade-height;
-      width: $calendar-bigger-year-decade-width;
+      @if $skin-name != 'Material3' {
+        height: $calendar-bigger-year-decade-height;
+        line-height: $calendar-bigger-year-decade-height;
+        width: $calendar-bigger-year-decade-width;
+      }
+      @else {
+        height: $calendar-bigger-year-decade-height-inside;
+        line-height: $calendar-bigger-year-decade-height-inside;
+        width: $calendar-bigger-year-decade-width;
+      }
     }
     #{if(&, '&', '*')} .e-header .e-icon-container {
       #{if(&, '&', '*')} .e-prev,
@@ -587,10 +625,17 @@
   // Mouse small style
   .e-small#{&}.e-calendar,
   .e-small #{&}.e-calendar {
-    max-width: $calendar-small-max-width;
-    min-width: $calendar-small-min-width;
-    padding: $calendar-small-popup-padding;
+    @if $skin-name != 'Material3' or $skin-name != 'Material3-dark' {
+      max-width: $calendar-small-max-width;
+      min-width: $calendar-small-min-width;
+      padding: $calendar-small-popup-padding;
+      min-height: 220px;
+    }
+    @else {
+      max-width: $calendar-small-max-width;
+      min-width: $calendar-small-min-width;
+      padding: $calendar-small-popup-padding;
+    }
     #{if(&, '&', '*')} .e-footer-container {
       @if $skin-name == 'tailwind' {
         padding: $calendar-small-footer-container-padding;

package/styles/calendar/_material-definition.scss CHANGED Viewed

@@ -61,7 +61,7 @@ $calendar-small-min-width: $calendar-normal-min-width !default;
 $calendar-weeknumber-min-width: 262px !default;
 $calendar-weeknumber-bigger-width: 320px !default;
 $calendar-normal-month-view-height: 30px !default;
-$calendar-normal-month-view-line-height: 28px !default;
+$calendar-normal-month-view-line-height: $calendar-normal-month-view-height !default;
 $calendar-normal-day-header-height: $calendar-normal-month-view-height !default;
 $calendar-normal-day-header-text: none !default;
 $calendar-normal-year-decade-height: 45px !default;

package/styles/calendar/_material3-dark-definition.scss ADDED Viewed

	@@ -0,0 +1 @@
1	+ @import './material3-definition.scss';

package/styles/calendar/_material3-definition.scss ADDED Viewed

@@ -0,0 +1,195 @@
+/*! calendar material3 theme variables */
+$calendar-title-hover-color: rgba($content-text-color) !default;
+$calendar-icon-hover-color: rgba($icon-color) !default;
+$calendar-default-border-color: none !default;
+$calendar-icon-hover-border-color: none !default;
+$calendar-light-font: rgba($content-text-color) !default;
+$calendar-bg-color: transparent !default;
+$calendar-active-font-color: rgba($primary-text-color) !default;
+$calendar-active-hover-font-color: rgba($primary) !default;
+$calendar-active-today-font-color: rgba($primary-text-color) !default;
+$calendar-active-today-hover-font-color: rgba($primary-text-color) !default;
+$calendar-active-bg-color: rgba($primary) !default;
+$calendar-active-bg-border-color: 1px solid rgba($primary) !default;
+$calendar-active-bg-box-shadow: none !default;
+$calendar-hover-color: $flyout-bg-color-hover !default;
+$calendar-header-font-color: rgba($content-text-color) !default;
+$calendar-header-icon-color: rgba($icon-color) !default;
+$calendar-week-header-font-color: rgba($content-text-color-alt1) !default;
+$calendar-title-font-color: rgba($content-text-color) !default;
+$calendar-title-decoration-style: none !default;
+$calendar-icon-font-color: rgba($icon-color) !default;
+$calendar-active-icon-color: $calendar-icon-font-color !default;
+$calendar-active-state-icon-bg-color: rgba($content-text-color, .12) !default;
+$calendar-icon-hover-bg-color: rgba($content-text-color, .08) !default;
+$calendar-device-icon-hover-bg-color: none !default;
+$calendar-focus-date-color: rgba($flyout-text-color) !default;
+$calendar-other-month-date: rgba($content-text-color-alt1, .6) !default;
+$calendar-text-color: rgba($content-text-color) !default;
+$calendar-hover-text: $calendar-text-color !default;
+$calendar-text-color-focus: rgba($primary-text-color) !default;
+$calendar-focus-bg-color: rgba($primary) !default;
+$calendar-border-style: 1px solid rgba($border-light) !default;
+$calendar-box-shadow: none !default;
+$calendar-none-style: none !default;
+$calendar-cursor-default-style: default !default;
+$calendar-cursor-pointer-style: pointer !default;
+$calendar-block-style: block !default;
+$calendar-inline-block-style: inline-block !default;
+$calendar-display-style: flex !default;
+$calendar-wrapper-border-radius: 2px !default;
+$calendar-full-width: 100% !default;
+$calendar-lg-day-header-format-max-width: 100% !default;
+$calendar-lg-day-header-format-min-width: 540px !default;
+$calendar-header-font-size: 13px !default;
+$calendar-title-font-size: 14px !default;
+$calendar-focused-state-color: rgba($primary) !default;
+$calendar-bigger-header-padding: 10px 10px 0 16px !default;
+$calendar-bigger-icon-size: 48px !default;
+$calendar-icon-line-height: 16px !default;
+$calendar-bigger-max-width: 296px !default;
+$calendar-bigger-min-width: 296px !default;
+$calendar-bigger-month-view-height: 36px !default;
+$calendar-bigger-day-header-height: $calendar-bigger-month-view-height !default;
+$calendar-bigger-year-decade-height: 72px !default;
+$calendar-bigger-year-decade-height-inside: 40px !default;
+$calendar-bigger-header-height: 48px !default;
+$calendar-bigger-today-button-height: 48px !default;
+$calendar-normal-header-padding: 10px 10px 0 10px !default;
+$calendar-normal-max-width: 252px !default;
+$calendar-normal-min-height: 336px !default;
+$calendar-normal-min-width: 240px !default;
+$calendar-small-max-width: $calendar-normal-max-width !default;
+$calendar-small-min-width: $calendar-normal-min-width !default;
+$calendar-weeknumber-min-width: 262px !default;
+$calendar-weeknumber-bigger-width: 320px !default;
+$calendar-normal-month-view-height: 32px !default;
+$calendar-normal-month-view-line-height: 30px !default;
+$calendar-normal-day-header-height: $calendar-normal-month-view-height !default;
+$calendar-normal-day-header-text: none !default;
+$calendar-normal-year-decade-height: 56px !default;
+$calendar-normal-header-height: 40px !default;
+$calendar-normal-icon-size: 36px !default;
+$calendar-normal-today-button-height: 36px !default;
+$calendar-border-radius: 32px !default;
+$calendar-pointer-events: initial !default;
+$calendar-float-right-style: right !default;
+$calendar-icon-padding-top: 0 !default;
+$calendar-float-left-style: left !default;
+$calendar-table-padding: 0 10px 10px !default;
+$calendar-zero-value: 0 !default;
+$calendar-next-prev-icon-size: 16px !default;
+$calendar-prev-icon: '\e910' !default;
+$calendar-next-icon: '\e916' !default;
+$calendar-date-font-size: 13px !default;
+$calendar-yeardecade-bg-color: transparent !default;
+$calendar-yeardecade-hover-color: rgba($content-bg-color) !default;
+$calendar-title-font-weight-style: $font-weight-medium !default;
+$calendar-spanicon-font-weight-style: 500 !default;
+$calendar-title-margin-left-style: 5px !default;
+$calendar-decade-title-left-margin-style: 5px !default;
+$calendar-normal-year-decade-padding: 1px !default;
+$calendar-icon-font-size-style: 15px !default;
+$calendar-link-font-weight-style: normal !default;
+$calendar-yeardeacde-span-padding: 2px !default;
+$calendar-yeardecade-padding: 10px !default;
+$calendar-focused-date-bg-style: $flyout-bg-color-hover !default;
+$calendar-focused-today-bg-style: rgba($primary-bg-color, .08) !default;
+$calendar-focused-today-border-style: 1px solid rgba($primary-bg-color) !default;
+$calendar-focused-today-box-shadow: none !default;
+$calendar-yeardecade-header-padding: 10px 10px 0 10px !default;
+$calendar-week-header-bg-style: none !default;
+$calendar-today-bg-style: none !default;
+$calendar-disable-font-weight-style: normal !default;
+$calendar-other-month-display-style: inline-block !default;
+$calendar-other-month-row-display-style: none !default;
+$calendar-week-number-font-style: italic !default;
+$calendar-week-number-font-color: rgba($content-text-color-alt1) !default;
+$calendar-week-number-color-style: rgba($content-text-color-alt1) !default;
+$calendar-week-number-font-size-style: 12px !default;
+$calendar-normal-month-cell-padding: 2px !default;
+$calendar-bigger-table-month-padding: 0 10px 10px !default;
+$calendar-bigger-table-yeardecade-padding: 0 10px 10px !default;
+$calendar-bigger-header-font-size: 16px !default;
+$calendar-bigger-month-font-size: 13px !default;
+$calendar-bigger-yeardecade-header-padding: 10px 10px 0 16px !default;
+$calendar-bigger-year-decade-padding: 2px !default;
+$calendar-yeardecade-hover-bg: $calendar-hover-color !default;
+$calendar-bigger-yeardecade-font-size: $calendar-bigger-month-font-size !default;
+$calendar-bigger-icon-font-size: 16px !default;
+$calendar-bigger-yeardecade-font-weight: normal !default;
+$calendar-normal-day-header-font-weight: normal !default;
+$calendar-other-month-date-hover-bg: rgba($flyout-text-color-hover) !default;
+$calendar-yeardecade-selected-hover-bg: $calendar-active-bg-color !default;
+$calendar-bigger-day-font-size: 13px !default;
+$calendar-yeardecade-font-weight: normal !default;
+$calendar-today-color: rgba($primary) !default;
+$calendar-today-focused-font-color: rgba($primary-bg-color) !default;
+$calendar-today-focus-color: rgba($primary-bg-color) !default;
+$calendar-bigger-month-view-padding: 2px !default;
+$calendar-bigger-week-header-font-size: 14px !default;
+$calendar-today-border-color: 1px solid rgba($primary-bg-color) !default;
+$calendar-today-box-shadow: none !default;
+$calendar-disabled-today-box-shadow: none !default;
+$calendar-disabled-today-font-color: $primary-text-disabled !default;
+$calendar-focus-border-color: none !default;
+$calendar-focus-box-shadow: none !default;
+$calendar-hover-border-color: none !default;
+$calendar-normal-month-view-width: $calendar-normal-month-view-height !default;
+$calendar-normal-year-decade-width: $calendar-normal-year-decade-height !default;
+$calendar-normal-year-decade-height-inside: 32px !default;
+$calendar-popup-padding: 0 !default;
+$calendar-popup-bigger-padding: 0 !default;
+$calendar-thead-padding: 0 !default;
+$calendar-week-normal-max-width: $calendar-normal-max-width !default;
+$calendar-week-normal-min-width: $calendar-normal-min-width !default;
+$calendar-week-bigger-max-width: $calendar-bigger-max-width !default;
+$calendar-week-bigger-min-width: $calendar-bigger-min-width !default;
+$calendar-bigger-month-view-width: $calendar-bigger-month-view-height !default;
+$calendar-bigger-month-view-line-height: 34px !default;
+$calendar-bigger-year-decade-width: 68px !default;
+$calendar-today-bg-hover-color: rgba($primary-bg-color, .08) !default;
+$calendar-disable-font-color: $calendar-light-font !default;
+$calendar-disable-opacity: .35 !default;
+$calendar-active-hover-bg-color: rgba($primary) !default;
+$calendar-other-decade-cell-color: $calendar-other-month-date !default;
+$calendar-icon-padding: 10px !default;
+$calendar-icon-button-margin: 0 !default;
+$calendar-bigger-icon-padding: 15px !default;
+$calendar-bigger-icon-margin: 0 !default;
+$calendar-selected-box-shadow: inset 0 0 0 2px $flyout-bg-color !default;
+$calendar-selected-border-color: none !default;
+$calendar-week-number-font-weight: 500 !default;
+$calendar-bigger-year-decade-width: 69px !default;
+$calendar-normar-year-decade-width: 56px !default;
+//today
+$calendar-footer-container-padding: 8px 12px 8px 12px !default;
+$calendar-footer-border: none !default;
+$calendar-footer-background: $calendar-bg-color !default;
+$calendar-bigger-footer-container-padding: 0 10px 10px 10px !default;
+$calendar-bigger-footer-border: none !default;
+$calendar-today-disabled-background-style: $transparent !default;
+$calendar-today-disabled-border-style: $transparent !default;
+$calendar-today-disabled-box-shadow: none !default;
+$calendar-today-disabled-color: $primary-text-disabled !default;
+//table related styles
+$calendar-rtl-text-indent: 4px !default;
+// small size
+$calendar-small-icon-size: 28px !default;
+$calendar-small-icon-font-size-style: 14px !default;
+$calendar-small-title-font-size: 12px !default;
+$calendar-small-icon-padding: 6px !default;
+$calendar-small-header-height: 32px !default;
+$calendar-small-day-header-height: 24px !default;
+$calendar-small-month-view-height: 24px !default;
+$calendar-small-month-view-line-height: 23px !default;
+$calendar-small-date-font-size: 11px !default;
+$calendar-small-month-view-width: 24px !default;
+$calendar-small-popup-padding: 0 !default;
+$calendar-small-title-font-color: rgba($content-text-color) !default;
+$calendar-bigger-small-table-padding: 0 10px 10px !default;
+$calendar-bigger-small-yeardecade-font-size: 14px !default;
+$calendar-small-font-size: $text-xs !default;

package/styles/calendar/_theme.scss CHANGED Viewed

@@ -270,13 +270,14 @@
         #{if(&, '&', '*')} td:focus span.e-day {
           @if $skin-name != 'Material3' {
             background-color: $calendar-focus-bg-color;
+            color: $calendar-text-color;
           }
           @if $skin-name == 'Material3' {
             background: $calendar-focus-bg-color;
+            color: $calendar-text-color-focus;
           }
           border: $calendar-focus-border-color;
           border-radius: $calendar-border-radius;
-          color: $calendar-text-color;
           @if ($skin-name == 'FluentUI') {
             border-radius: $calendar-border-selected-radius;
           }

package/styles/calendar/bootstrap-dark.css CHANGED Viewed

@@ -158,7 +158,7 @@ ejs-calendar {
 .e-calendar .e-content td.e-other-month > span.e-day, .e-calendar .e-content td.e-other-year > span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-other-month > span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-other-year > span.e-day {
-  display: block;
+  display: inline-block;
   font-weight: normal;
 }
 .e-calendar .e-content tr.e-month-hide,
@@ -484,6 +484,7 @@ ejs-calendar {
   max-width: 262px;
   min-width: 256px;
   padding: 10px;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -767,9 +768,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #484848;
+  color: #f0f0f0;
   border: none;
   border-radius: 4px;
-  color: #f0f0f0;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/bootstrap.css CHANGED Viewed

@@ -485,6 +485,7 @@ ejs-calendar {
   max-width: 262px;
   min-width: 256px;
   padding: 10px;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -768,9 +769,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #e6e6e6;
+  color: #333;
   border: none;
   border-radius: 4px;
-  color: #333;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/bootstrap4.css CHANGED Viewed

@@ -368,7 +368,7 @@ ejs-calendar {
 .e-bigger.e-calendar,
 *.e-bigger .e-calendar {
   max-width: 310px;
-  min-width: 306px;
+  min-width: 300px;
   padding: 0;
 }
 .e-bigger.e-calendar.e-calendar-day-header-lg,
@@ -485,6 +485,7 @@ ejs-calendar {
   max-width: 262px;
   min-width: 256px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -768,9 +769,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #f2f4f6;
+  color: #212529;
   border: none;
   border-radius: 4px;
-  color: #212529;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/bootstrap5-dark.css CHANGED Viewed

@@ -509,6 +509,7 @@ ejs-calendar {
   max-width: 200px;
   min-width: 200px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -805,9 +806,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #31373d;
+  color: #fff;
   border: none;
   border-radius: 4px;
-  color: #fff;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/bootstrap5.css CHANGED Viewed

@@ -509,6 +509,7 @@ ejs-calendar {
   max-width: 200px;
   min-width: 200px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -805,9 +806,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #e9ecef;
+  color: #212529;
   border: none;
   border-radius: 4px;
-  color: #212529;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/fabric-dark.css CHANGED Viewed

@@ -494,6 +494,7 @@ ejs-calendar {
   max-width: 232px;
   min-width: 232px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -773,9 +774,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #414040;
+  color: #dadada;
   border: none;
   border-radius: 0;
-  color: #dadada;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/fabric.css CHANGED Viewed

@@ -495,6 +495,7 @@ ejs-calendar {
   max-width: 232px;
   min-width: 232px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -778,9 +779,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #deecf9;
+  color: #333;
   border: none;
   border-radius: 0;
-  color: #333;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/fluent-dark.css CHANGED Viewed

@@ -508,6 +508,7 @@ ejs-calendar {
   max-width: 194px;
   min-width: 194px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -817,9 +818,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #3b3a39;
+  color: #f3f2f1;
   border: none;
   border-radius: 0;
-  color: #f3f2f1;
   border-radius: 50%;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,

package/styles/calendar/fluent.css CHANGED Viewed

@@ -508,6 +508,7 @@ ejs-calendar {
   max-width: 194px;
   min-width: 194px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -817,9 +818,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #edebe9;
+  color: #201f1e;
   border: none;
   border-radius: 0;
-  color: #201f1e;
   border-radius: 50%;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,

package/styles/calendar/highcontrast-light.css CHANGED Viewed

@@ -485,6 +485,7 @@ ejs-calendar {
   max-width: 232px;
   min-width: 232px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -768,9 +769,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #ccc;
+  color: #000;
   border: 1px dashed #000;
   border-radius: 0;
-  color: #000;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/highcontrast.css CHANGED Viewed

@@ -495,6 +495,7 @@ ejs-calendar {
   max-width: 232px;
   min-width: 232px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -778,9 +779,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #333;
+  color: #fff;
   border: 1px dashed #fff;
   border-radius: 0;
-  color: #fff;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/icons/_material3-dark.scss ADDED Viewed

	@@ -0,0 +1 @@
1	+ @import './material3.scss';

package/styles/calendar/material-dark.css CHANGED Viewed

@@ -495,6 +495,7 @@ ejs-calendar {
   max-width: 246px;
   min-width: 240px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -778,9 +779,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: rgba(255, 255, 255, 0.1);
+  color: #fff;
   border: none;
   border-radius: 50%;
-  color: #fff;
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,

package/styles/calendar/material.css CHANGED Viewed

@@ -315,7 +315,7 @@ ejs-calendar {
 }
 .e-calendar .e-content.e-month td.e-today span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-month td.e-today span.e-day {
-  line-height: 28px;
+  line-height: 30px;
 }
 .e-calendar .e-content.e-year table, .e-calendar .e-content.e-decade table,
 .e-bigger.e-small .e-calendar .e-content.e-year table,
@@ -496,6 +496,7 @@ ejs-calendar {
   max-width: 246px;
   min-width: 240px;
   padding: 0;
+  min-height: 220px;
 }
 .e-small.e-calendar.e-calendar-day-header-lg,
 .e-small .e-calendar.e-calendar-day-header-lg {
@@ -779,9 +780,9 @@ ejs-calendar {
 .e-calendar .e-content td:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td:focus span.e-day {
   background-color: #eee;
+  color: rgba(0, 0, 0, 0.87);
   border: none;
   border-radius: 50%;
-  color: rgba(0, 0, 0, 0.87);
 }
 .e-calendar .e-content td.e-disabled span.e-day, .e-calendar .e-content td.e-disabled:hover span.e-day, .e-calendar .e-content td.e-disabled:focus span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-disabled span.e-day,