@syncfusion/ej2-angular-calendars 20.4.38 → 20.4.40

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-angular-calendars@*",
-  "_id": "@syncfusion/ej2-angular-calendars@18.29.7",
+  "_id": "@syncfusion/ej2-angular-calendars@18.30.7",
   "_inBundle": false,
-  "_integrity": "sha512-7qsVzaANZF0kX0gfZIpAe9KehtSguiDtPk7iGA6kddpBiu7fGF9sE84K3zRtnH8p7ivHAd3Md82qwVTCozzpew==",
+  "_integrity": "sha512-XNMF+B2Te5/NtlM9JbPHQK5/detIlbGVw8MPkJ9/6W50xoGUs3C9lVljp1EB6wc1Zph1OfaBaZctj0i/yZJdrg==",
   "_location": "/@syncfusion/ej2-angular-calendars",
   "_phantomChildren": {},
   "_requested": {
@@ -19,8 +19,8 @@
   "_requiredBy": [
     "/"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-angular-release/@syncfusion/ej2-angular-calendars/-/ej2-angular-calendars-18.29.7.tgz",
-  "_shasum": "2b8f63d888f9c4d735af80b42b61aa7a8237a2f8",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-angular-hotfix/@syncfusion/ej2-angular-calendars/-/ej2-angular-calendars-18.30.7.tgz",
+  "_shasum": "28a35a514ff2058077ae51affed306039f3708ce",
   "_spec": "@syncfusion/ej2-angular-calendars@*",
   "_where": "/jenkins/workspace/ease-automation_release_19.1.0.1/ivypackages/included",
   "author": {
@@ -31,9 +31,9 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-angular-base": "~20.4.38",
-    "@syncfusion/ej2-base": "~20.4.38",
-    "@syncfusion/ej2-calendars": "20.4.38",
+    "@syncfusion/ej2-angular-base": "~20.4.40",
+    "@syncfusion/ej2-base": "~20.4.40",
+    "@syncfusion/ej2-calendars": "20.4.40",
     "tslib": "^2.3.0"
   },
   "deprecated": false,
@@ -57,42 +57,6 @@
   "fesm2020": "fesm2020/syncfusion-ej2-angular-calendars.mjs",
   "homepage": "https://github.com/syncfusion/ej2-angular-ui-components#readme",
   "keywords": [
-    "ej2",
-    "syncfusion",
-    "web-components",
-    "calendar",
-    "date",
-    "time",
-    "datetime",
-    "daterange",
-    "culture",
-    "month",
-    "year",
-    "decade",
-    "timepicker",
-    "strict-mode",
-    "step",
-    "interval",
-    "min",
-    "max",
-    "globalization",
-    "datepicker",
-    "daterangepicker",
-    "datetimepicker",
-    "enable-persistence",
-    "locale",
-    "value",
-    "format",
-    "week-number",
-    "enable-rtl",
-    "presets",
-    "min-days",
-    "max-days",
-    "start-date",
-    "end-date",
-    "time-format",
-    "rangepicker",
-    "month-picker",
     "angular",
     "ng",
     "ng-calendars",
@@ -108,5 +72,5 @@
   "schematics": "./schematics/collection.json",
   "sideEffects": false,
   "typings": "syncfusion-ej2-angular-calendars.d.ts",
-  "version": "20.4.38"
+  "version": "20.4.40"
 }

package/schematics/utils/lib-details.d.ts

@@ -1,4 +1,4 @@
 export declare const pkgName = "@syncfusion/ej2-angular-calendars";
-export declare const pkgVer = "^18.29.7";
+export declare const pkgVer = "^18.30.7";
 export declare const moduleName = "CalendarModule, DatePickerModule, TimePickerModule, DateRangePickerModule, DateTimePickerModule";
-export declare const themeVer = "~18.29.7";
+export declare const themeVer = "~18.30.7";

package/schematics/utils/lib-details.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.pkgName = '@syncfusion/ej2-angular-calendars';
-exports.pkgVer = '^20.4.38';
+exports.pkgVer = '^20.4.40';
 exports.moduleName = 'CalendarModule, DatePickerModule, TimePickerModule, DateRangePickerModule, DateTimePickerModule';
-exports.themeVer = '~20.4.38';
+exports.themeVer = '~20.4.40';

package/schematics/utils/lib-details.ts

@@ -1,4 +1,4 @@
 export const pkgName = '@syncfusion/ej2-angular-calendars';
-export const pkgVer = '^20.4.38';
+export const pkgVer = '^20.4.40';
 export const moduleName = 'CalendarModule, DatePickerModule, TimePickerModule, DateRangePickerModule, DateTimePickerModule';
-export const themeVer = '~20.4.38';
+export const themeVer = '~20.4.40';

package/styles/bootstrap-dark.css

@@ -1833,6 +1833,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/bootstrap.css

@@ -1836,6 +1836,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/bootstrap4.css

@@ -1864,6 +1864,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/bootstrap5-dark.css

@@ -686,7 +686,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #31373d;
+  background-color: #444c54;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,
@@ -1932,6 +1932,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/bootstrap5.css

@@ -1932,6 +1932,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/calendar/_fluent-definition.scss

@@ -162,7 +162,7 @@ $calendar-active-state-icon-bg-color: $secondary-border-color-pressed !default;
 
 //popup styles
 $calendar-border-style: 1px solid $border-light !default;
-$calendar-bg-color: $transparent !default;
+$calendar-bg-color: $flyout-bg-color !default;
 $calendar-week-number-bg-color: $content-bg-color-alt1 !default;
 $calendar-week-number-font-weight: 400 !default;
 $calendar-box-shadow: none !default;

package/styles/calendar/_material-definition.scss

@@ -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: $calendar-normal-month-view-height !default;
+$calendar-normal-month-view-line-height: 28px !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;
@@ -140,7 +140,7 @@ $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: $calendar-bigger-month-view-height !default;
+$calendar-bigger-month-view-line-height: 34px !default;
 $calendar-bigger-year-decade-width: $calendar-bigger-year-decade-height !default;
 $calendar-today-bg-hover-color: $grey-200 !default;
 $calendar-disable-font-color: $calendar-light-font !default;
@@ -177,7 +177,7 @@ $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: $calendar-small-month-view-height !default;
+$calendar-small-month-view-line-height: 22px !default;
 $calendar-small-date-font-size: 12px !default;
 $calendar-small-month-view-width: 24px !default;
 $calendar-small-popup-padding: 0 !default;

package/styles/calendar/_theme.scss

@@ -81,7 +81,7 @@
         }
         #{if(&, '&', '*')}.e-year td:hover span.e-day,
         #{if(&, '&', '*')}.e-decade td:hover span.e-day {
-          background-color: $calendar-yeardecade-hover-bg;
+          background-color: $calendar-hover-color;
         }
         #{if(&, '&', '*')}.e-year td.e-selected:hover span.e-day,
         #{if(&, '&', '*')}.e-decade td.e-selected:hover span.e-day {

package/styles/calendar/bootstrap5-dark.css

@@ -686,7 +686,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #31373d;
+  background-color: #444c54;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,

package/styles/calendar/fabric-dark.css

@@ -649,7 +649,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #514f4f;
+  background-color: #414040;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,

package/styles/calendar/fabric.css

@@ -650,7 +650,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #dadada;
+  background-color: #eaeaea;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,

package/styles/calendar/fluent-dark.css

@@ -188,7 +188,7 @@ ejs-calendar {
 .e-calendar .e-content td.e-week-number:hover span.e-day, .e-calendar .e-content td.e-week-number:hover,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover {
-  background-color: transparent;
+  background-color: #252423;
   cursor: default;
   background-color: #201f1e;
 }
@@ -568,7 +568,7 @@ ejs-calendar {
 
 .e-calendar,
 .e-bigger.e-small .e-calendar {
-  background-color: transparent;
+  background-color: #252423;
   border: 1px solid #292827;
   box-shadow: none;
 }
@@ -660,7 +660,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #252423;
+  background-color: #323130;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,

package/styles/calendar/fluent.css

@@ -188,7 +188,7 @@ ejs-calendar {
 .e-calendar .e-content td.e-week-number:hover span.e-day, .e-calendar .e-content td.e-week-number:hover,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover {
-  background-color: transparent;
+  background-color: #fff;
   cursor: default;
   background-color: #faf9f8;
 }
@@ -568,7 +568,7 @@ ejs-calendar {
 
 .e-calendar,
 .e-bigger.e-small .e-calendar {
-  background-color: transparent;
+  background-color: #fff;
   border: 1px solid #edebe9;
   box-shadow: none;
 }

package/styles/calendar/material.css

@@ -306,7 +306,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: 30px;
+  line-height: 28px;
 }
 .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,
@@ -451,7 +451,7 @@ ejs-calendar {
 }
 .e-bigger.e-calendar .e-content.e-month td.e-today span.e-day,
 *.e-bigger .e-calendar .e-content.e-month td.e-today span.e-day {
-  line-height: 36px;
+  line-height: 34px;
 }
 .e-bigger.e-calendar .e-content.e-month td,
 *.e-bigger .e-calendar .e-content.e-month td {
@@ -502,7 +502,7 @@ ejs-calendar {
 }
 .e-small.e-calendar .e-content.e-month td.e-today span.e-day,
 .e-small .e-calendar .e-content.e-month td.e-today span.e-day {
-  line-height: 24px;
+  line-height: 22px;
 }
 .e-small.e-calendar .e-content.e-month td,
 .e-small .e-calendar .e-content.e-month td {

package/styles/daterangepicker/_bootstrap-dark-definition.scss

@@ -135,6 +135,7 @@ $range-icon-bottom-right-radius: 3px !default;
 $range-icon-top-right-radius: 3px !default;
 $range-icon-margin: 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 150px !default;
 
 // fabric theme variable
 $range-icon-font-size: 16px !default;

package/styles/daterangepicker/_bootstrap-definition.scss

@@ -135,6 +135,7 @@ $range-icon-top-right-radius: 3px !default;
 $range-icon-margin: 0 !default;
 $range-icon-bigger-margin: 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 150px !default;
 
 // fabric theme variable
 $range-icon-font-size: 16px !default;

package/styles/daterangepicker/_bootstrap4-definition.scss

@@ -145,6 +145,7 @@ $range-bigger-icon-container-min-width: 33px !default;
 $range-icon-margin: 0 !default;
 $range-icon-bigger-margin: 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 150px !default;
 
 // fabric theme variable
 $range-icon-font-size: 14px !default;

package/styles/daterangepicker/_bootstrap5-definition.scss

@@ -101,6 +101,7 @@ $range-icon-normal-padding: 0 !default;
 $range-preset-normal-list-height: 36px !default;
 $range-preset-bigger-list-height: 48px !default;
 $range-calendar-bigger-max: 296px !default;
+$range-calendar-landscape-height: 130px !default;
 
 // new variable
 $range-icon: '\e245' !default;

package/styles/daterangepicker/_fabric-dark-definition.scss

@@ -135,6 +135,7 @@ $range-icon-bottom-right-radius: 0 !default;
 $range-icon-top-right-radius: 0 !default;
 $range-icon-margin: 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 150px !default;
 
 // fabric theme variable
 $range-icon-font-size: 16px !default;

package/styles/daterangepicker/_fabric-definition.scss

@@ -134,6 +134,7 @@ $range-icon-top-right-radius: 0 !default;
 $range-icon-margin: 0 !default;
 $range-icon-bigger-margin: 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 150px !default;
 
 // fabric theme variable
 $range-icon-font-size: 16px !default;

package/styles/daterangepicker/_fluent-definition.scss

@@ -77,6 +77,11 @@ $range-presets-width: 160px !default;
 $range-hover-start-radius: 0 !default;
 $range-hover-end-radius: 0 !default;
 $range-selected-hover-radius: 50% !default;
+$range-today-hover-line-height: 26px !default;
+$range-other-hover-line-height: 28px !default;
+$range-small-today-hover-line-height: 24px !default;
+$range-bigger-today-hover-line-height: 30px !default;
+$range-bigger-other-hover-line-height: 32px !default;
 $range-btn-height: 36px !default;
 $range-device-btn-line-height: 34px !default;
 $range-icon-hover-color: $content-bg-color-hover !default;
@@ -104,6 +109,7 @@ $range-icon-normal-padding: 0 !default;
 $range-preset-normal-list-height: 36px !default;
 $range-preset-bigger-list-height: 48px !default;
 $range-calendar-bigger-max: 296px !default;
+$range-calendar-landscape-height: 130px !default;
 
 // new variable
 $range-icon: '\e245' !default;

package/styles/daterangepicker/_fusionnew-definition.scss

@@ -101,6 +101,7 @@ $range-icon-normal-padding: 0 !default;
 $range-preset-normal-list-height: 36px !default;
 $range-preset-bigger-list-height: 48px !default;
 $range-calendar-bigger-max: 296px !default;
+$range-calendar-landscape-height: 130px !default;
 
 // new variable
 $range-icon: '\e245' !default;

package/styles/daterangepicker/_highcontrast-definition.scss

@@ -133,6 +133,7 @@ $range-icon-top-right-radius: 0 !default;
 $range-icon-margin: 0 !default;
 $range-icon-bigger-margin: 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 150px !default;
 
 // highcontrast theme variable
 $range-icon-font-size: 16px !default;

package/styles/daterangepicker/_highcontrast-light-definition.scss

@@ -134,6 +134,7 @@ $range-icon-bottom-right-radius: 0 !default;
 $range-icon-top-right-radius: 0 !default;
 $range-icon-margin: 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 150px !default;
 
 // highcontrast theme variable
 $range-icon-font-size: 16px !default;

package/styles/daterangepicker/_layout.scss

@@ -652,6 +652,12 @@
 
 
 @media screen and (orientation: landscape) {
+    .e-daterangepicker .e-calendar.e-device .e-month table{
+        display: inline-block;
+        height: $range-calendar-landscape-height;
+        overflow: auto;
+    }
+
     .e-daterangepick-mob-popup-wrap {
      @if $skin-name == 'material' {
         #{if( &, '&', '*')} .e-daterangepicker.e-popup.e-popup-expand {

package/styles/daterangepicker/_material-dark-definition.scss

@@ -139,6 +139,7 @@ $range-bigger-icon-container-min-height: 24px !default;
 $range-bigger-icon-container-min-width: 24px !default;
 $range-icon-margin: 0 0 4px 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 130px !default;
 
 // new variable
 $range-icon: '\e245' !default;

package/styles/daterangepicker/_material-definition.scss

@@ -140,6 +140,7 @@ $range-bigger-icon-container-min-width: 24px !default;
 $range-icon-margin: 0 0 4px 0 !default;
 $range-icon-bigger-margin: 0 0 2px 0 !default;
 $range-sart-end-btn-padding: 1px 6px !default;
+$range-calendar-landscape-height: 130px !default;
 
 // new variable
 $range-icon: '\e245' !default;

package/styles/daterangepicker/_material3-definition.scss

@@ -101,6 +101,7 @@ $range-icon-normal-padding: 0 !default;
 $range-preset-normal-list-height: 36px !default;
 $range-preset-bigger-list-height: 48px !default;
 $range-calendar-bigger-max: 296px !default;
+$range-calendar-landscape-height: 130px !default;
 
 // new variable
 $range-icon: '\e245' !default;

package/styles/daterangepicker/_tailwind-definition.scss

@@ -109,6 +109,7 @@ $range-small-header-label-size: $text-base !default;
 $range-bigger-indicator-label-size: $text-sm !default;
 $range-bigger-change-icon-size: 20px !default;
 $range-control-bigger-header-margin: 12px 0 !default;
+$range-calendar-landscape-height: 130px !default;
 
 // new variable
 $range-icon: '\e245' !default;

package/styles/daterangepicker/_theme.scss

@@ -322,3 +322,36 @@
     }
   }
 }
+
+.e-daterangepicker.e-popup .e-calendar .e-content.e-month .e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  @if $skin-name == 'FluentUI' {
+    line-height: $range-today-hover-line-height;
+  }
+}
+
+.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-other-month.e-range-hover span.e-day {
+  @if $skin-name == 'FluentUI' {
+    line-height: $range-other-hover-line-height;
+  }
+}
+
+.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day,
+.e-small .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  @if $skin-name == 'FluentUI' {
+    line-height: $range-small-today-hover-line-height;
+  }
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  @if $skin-name == 'FluentUI' {
+    line-height: $range-bigger-today-hover-line-height;
+  }
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  @if $skin-name == 'FluentUI' {
+    line-height: $range-bigger-other-hover-line-height;
+  }
+}

package/styles/daterangepicker/bootstrap-dark.css

@@ -636,6 +636,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/bootstrap.css

@@ -637,6 +637,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/bootstrap4.css

@@ -650,6 +650,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/bootstrap5-dark.css

@@ -650,6 +650,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/bootstrap5.css

@@ -650,6 +650,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/fabric-dark.css

@@ -636,6 +636,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/fabric.css

@@ -637,6 +637,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/fluent-dark.css

@@ -619,6 +619,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }
@@ -909,4 +916,27 @@
   background-color: #252423;
   border-color: #323130;
   color: #3b3a39;
+}
+
+.e-daterangepicker.e-popup .e-calendar .e-content.e-month .e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 26px;
+}
+
+.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-other-month.e-range-hover span.e-day {
+  line-height: 28px;
+}
+
+.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day,
+.e-small .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 24px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 30px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 32px;
 }

package/styles/daterangepicker/fluent.css

@@ -619,6 +619,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }
@@ -909,4 +916,27 @@
   background-color: #f3f2f1;
   border-color: #f3f2f1;
   color: #a19f9d;
+}
+
+.e-daterangepicker.e-popup .e-calendar .e-content.e-month .e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 26px;
+}
+
+.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-other-month.e-range-hover span.e-day {
+  line-height: 28px;
+}
+
+.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day,
+.e-small .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 24px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 30px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 32px;
 }

package/styles/daterangepicker/highcontrast-light.css

@@ -636,6 +636,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/highcontrast.css

@@ -637,6 +637,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/material-dark.css

@@ -675,6 +675,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/material.css

@@ -723,6 +723,11 @@
 }
 
 @media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-header {
     float: left;
     height: 100%;

package/styles/daterangepicker/tailwind-dark.css

@@ -669,6 +669,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/daterangepicker/tailwind.css

@@ -669,6 +669,13 @@
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/fabric-dark.css

@@ -649,7 +649,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #514f4f;
+  background-color: #414040;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,
@@ -1830,6 +1830,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/fabric.css

@@ -650,7 +650,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #dadada;
+  background-color: #eaeaea;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,
@@ -1837,6 +1837,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/fluent-dark.css

@@ -188,7 +188,7 @@ ejs-calendar {
 .e-calendar .e-content td.e-week-number:hover span.e-day, .e-calendar .e-content td.e-week-number:hover,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover {
-  background-color: transparent;
+  background-color: #252423;
   cursor: default;
   background-color: #201f1e;
 }
@@ -568,7 +568,7 @@ ejs-calendar {
 
 .e-calendar,
 .e-bigger.e-small .e-calendar {
-  background-color: transparent;
+  background-color: #252423;
   border: 1px solid #292827;
   box-shadow: none;
 }
@@ -660,7 +660,7 @@ ejs-calendar {
 .e-calendar .e-content.e-year td:hover span.e-day, .e-calendar .e-content.e-decade td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-year td:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content.e-decade td:hover span.e-day {
-  background-color: #252423;
+  background-color: #323130;
 }
 .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,
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day,
@@ -1984,6 +1984,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }
@@ -2276,6 +2283,29 @@ ejs-calendar {
   color: #3b3a39;
 }
 
+.e-daterangepicker.e-popup .e-calendar .e-content.e-month .e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 26px;
+}
+
+.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-other-month.e-range-hover span.e-day {
+  line-height: 28px;
+}
+
+.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day,
+.e-small .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 24px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 30px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 32px;
+}
+
 /* stylelint-disable property-no-vendor-prefix */
 /* stylelint-disable-line no-empty-source */
 /*! component icons */

package/styles/fluent.css

@@ -188,7 +188,7 @@ ejs-calendar {
 .e-calendar .e-content td.e-week-number:hover span.e-day, .e-calendar .e-content td.e-week-number:hover,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover span.e-day,
 .e-bigger.e-small .e-calendar .e-content td.e-week-number:hover {
-  background-color: transparent;
+  background-color: #fff;
   cursor: default;
   background-color: #faf9f8;
 }
@@ -568,7 +568,7 @@ ejs-calendar {
 
 .e-calendar,
 .e-bigger.e-small .e-calendar {
-  background-color: transparent;
+  background-color: #fff;
   border: 1px solid #edebe9;
   box-shadow: none;
 }
@@ -1984,6 +1984,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }
@@ -2276,6 +2283,29 @@ ejs-calendar {
   color: #a19f9d;
 }
 
+.e-daterangepicker.e-popup .e-calendar .e-content.e-month .e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 26px;
+}
+
+.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-today.e-range-hover span,
+.e-bigger.e-small .e-calendar .e-content.e-month td.e-today.e-other-month.e-range-hover span.e-day {
+  line-height: 28px;
+}
+
+.e-small .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day,
+.e-small .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 24px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-today.e-range-hover span.e-day {
+  line-height: 30px;
+}
+
+.e-bigger .e-calendar .e-content.e-month td.e-other-month.e-today.e-range-hover span.e-day {
+  line-height: 32px;
+}
+
 /* stylelint-disable property-no-vendor-prefix */
 /* stylelint-disable-line no-empty-source */
 /*! component icons */

package/styles/highcontrast-light.css

@@ -1841,6 +1841,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/highcontrast.css

@@ -1844,6 +1844,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 150px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/material-dark.css

@@ -1960,6 +1960,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/material.css

@@ -306,7 +306,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: 30px;
+  line-height: 28px;
 }
 .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,
@@ -451,7 +451,7 @@ ejs-calendar {
 }
 .e-bigger.e-calendar .e-content.e-month td.e-today span.e-day,
 *.e-bigger .e-calendar .e-content.e-month td.e-today span.e-day {
-  line-height: 36px;
+  line-height: 34px;
 }
 .e-bigger.e-calendar .e-content.e-month td,
 *.e-bigger .e-calendar .e-content.e-month td {
@@ -502,7 +502,7 @@ ejs-calendar {
 }
 .e-small.e-calendar .e-content.e-month td.e-today span.e-day,
 .e-small .e-calendar .e-content.e-month td.e-today span.e-day {
-  line-height: 24px;
+  line-height: 22px;
 }
 .e-small.e-calendar .e-content.e-month td,
 .e-small .e-calendar .e-content.e-month td {
@@ -2109,6 +2109,11 @@ ejs-calendar {
 }
 
 @media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-header {
     float: left;
     height: 100%;

package/styles/tailwind-dark.css

@@ -1991,6 +1991,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }

package/styles/tailwind.css

@@ -1991,6 +1991,13 @@ ejs-calendar {
   min-height: 40px;
 }
 
+@media screen and (orientation: landscape) {
+  .e-daterangepicker .e-calendar.e-device .e-month table {
+    display: inline-block;
+    height: 130px;
+    overflow: auto;
+  }
+}
 .e-outline.e-float-input.e-control-wrapper label.e-float-text.e-label-bottom span.e-float-text-content.e-float-text-overflow.e-date-time-icon {
   width: calc(100% - 80px);
 }