@syncfusion/ej2-calendars 26.1.40 → 26.2.4

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 (25) hide show
  1. package/dist/ej2-calendars.min.js +2 -2
  2. package/dist/ej2-calendars.umd.min.js +2 -2
  3. package/dist/ej2-calendars.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-calendars.es2015.js +2 -2
  5. package/dist/es6/ej2-calendars.es2015.js.map +1 -1
  6. package/dist/es6/ej2-calendars.es5.js +2 -2
  7. package/dist/es6/ej2-calendars.es5.js.map +1 -1
  8. package/dist/global/ej2-calendars.min.js +2 -2
  9. package/dist/global/ej2-calendars.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/hotfix/26.1.35_Vol2.txt +1 -0
  12. package/package.json +10 -10
  13. package/src/datepicker/datepicker.js +2 -2
  14. package/styles/calendar/_theme.scss +5 -0
  15. package/styles/calendar/fluent-dark.css +4 -0
  16. package/styles/calendar/fluent.css +4 -0
  17. package/styles/calendar/fluent2.css +14 -10
  18. package/styles/datepicker/fluent2.css +11 -11
  19. package/styles/daterangepicker/_fluent2-definition.scss +3 -3
  20. package/styles/daterangepicker/fluent2.css +16 -16
  21. package/styles/datetimepicker/fluent2.css +10 -10
  22. package/styles/fluent-dark.css +4 -0
  23. package/styles/fluent.css +4 -0
  24. package/styles/fluent2.css +21 -17
  25. package/styles/timepicker/fluent2.css +10 -10
package/dist/global/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /*!
2
2
  * filename: index.d.ts
3
- * version : 26.1.40
3
+ * version : 26.2.4
4
4
  * Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
5
5
  * Use of this code is subject to the terms of our license.
6
6
  * A copy of the current license can be obtained at any time by e-mailing
package/hotfix/26.1.35_Vol2.txt ADDED
@@ -0,0 +1 @@
1
+ hotfix/26.1.35_Vol2
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "_from": "@syncfusion/ej2-calendars@*",
3
- "_id": "@syncfusion/ej2-calendars@26.1.38",
3
+ "_id": "@syncfusion/ej2-calendars@26.1.41",
4
4
  "_inBundle": false,
5
- "_integrity": "sha512-Yb8h3d8LW4nKuQrtJQoxAredyA0M8ubHlwH30YGkZrLOZO9DnHVDb8hYUo92TXnwPM0Li0Yn/ur8Lp4hE55iDQ==",
5
+ "_integrity": "sha512-dtyCtcUTeff5+TS7Y+/R3w+UiHNB7d5KwcSZZpwhjkjEozQM6UEar2KzSrQ70n9maAvktJJo9FvxLTPcwSJnqQ==",
6
6
  "_location": "/@syncfusion/ej2-calendars",
7
7
  "_phantomChildren": {},
8
8
  "_requested": {
@@ -31,8 +31,8 @@
31
31
  "/@syncfusion/ej2-schedule",
32
32
  "/@syncfusion/ej2-vue-calendars"
33
33
  ],
34
- "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-calendars/-/ej2-calendars-26.1.38.tgz",
35
- "_shasum": "80212c65e4473c3c5a089a2fd157c5f3e0c9fe6e",
34
+ "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-calendars/-/ej2-calendars-26.1.41.tgz",
35
+ "_shasum": "5d02b42f086313df3e86a2e1ecfb3a649f646216",
36
36
  "_spec": "@syncfusion/ej2-calendars@*",
37
37
  "_where": "/jenkins/workspace/elease-automation_release_26.1.1/packages/included",
38
38
  "author": {
@@ -43,11 +43,11 @@
43
43
  },
44
44
  "bundleDependencies": false,
45
45
  "dependencies": {
46
- "@syncfusion/ej2-base": "~26.1.37",
47
- "@syncfusion/ej2-buttons": "~26.1.40",
48
- "@syncfusion/ej2-inputs": "~26.1.40",
49
- "@syncfusion/ej2-lists": "~26.1.35",
50
- "@syncfusion/ej2-popups": "~26.1.38"
46
+ "@syncfusion/ej2-base": "~26.2.4",
47
+ "@syncfusion/ej2-buttons": "~26.2.4",
48
+ "@syncfusion/ej2-inputs": "~26.2.4",
49
+ "@syncfusion/ej2-lists": "~26.2.4",
50
+ "@syncfusion/ej2-popups": "~26.2.4"
51
51
  },
52
52
  "deprecated": false,
53
53
  "description": "A complete package of date or time components with built-in features such as date formatting, inline editing, multiple (range) selection, range restriction, month and year selection, strict mode, and globalization.",
@@ -80,6 +80,6 @@
80
80
  "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
81
81
  },
82
82
  "typings": "index.d.ts",
83
- "version": "26.1.40",
83
+ "version": "26.2.4",
84
84
  "sideEffects": false
85
85
  }
package/src/datepicker/datepicker.js CHANGED
@@ -1739,13 +1739,13 @@ var DatePicker = /** @class */ (function (_super) {
1739
1739
  case 'min':
1740
1740
  if ((+this.min === +new Date(1900, 0, 1)) || dynamic) {
1741
1741
  var min = this.inputElement.getAttribute(prop);
1742
- this.setProperties(setValue(prop, this.globalize.parseDate(min), {}), !dynamic);
1742
+ this.setProperties(setValue(prop, this.globalize.parseDate(min, options), {}), !dynamic);
1743
1743
  }
1744
1744
  break;
1745
1745
  case 'max':
1746
1746
  if ((+this.max === +new Date(2099, 11, 31)) || dynamic) {
1747
1747
  var max = this.inputElement.getAttribute(prop);
1748
- this.setProperties(setValue(prop, this.globalize.parseDate(max), {}), !dynamic);
1748
+ this.setProperties(setValue(prop, this.globalize.parseDate(max, options), {}), !dynamic);
1749
1749
  }
1750
1750
  break;
1751
1751
  case 'type':
package/styles/calendar/_theme.scss CHANGED
@@ -438,6 +438,11 @@
438
438
  color: $calendar-today-focused-font-color;
439
439
  }
440
440
  }
441
+ #{if(&, '&', '*')}.e-month td.e-disabled.e-today span.e-day {
442
+ @if ($skin-name == 'FluentUI' or $skin-name == 'fluent2') {
443
+ color: $calendar-today-disabled-color;
444
+ }
445
+ }
441
446
  #{if(&, '&', '*')}.e-year td.e-selected > span.e-day,
442
447
  #{if(&, '&', '*')}.e-decade td.e-selected > span.e-day,
443
448
  #{if(&, '&', '*')}.e-year td.e-selected:hover > span.e-day,
package/styles/calendar/fluent-dark.css CHANGED
@@ -928,6 +928,10 @@ ejs-calendar {
928
928
  .e-bigger.e-small .e-calendar .e-content.e-month td.e-today span.e-day {
929
929
  color: #1b1a19;
930
930
  }
931
+ .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day,
932
+ .e-bigger.e-small .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day {
933
+ color: #484644;
934
+ }
931
935
  .e-calendar .e-content.e-year td.e-selected > span.e-day, .e-calendar .e-content.e-decade td.e-selected > span.e-day, .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,
932
936
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected > span.e-day,
933
937
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected > span.e-day,
package/styles/calendar/fluent.css CHANGED
@@ -928,6 +928,10 @@ ejs-calendar {
928
928
  .e-bigger.e-small .e-calendar .e-content.e-month td.e-today span.e-day {
929
929
  color: #fff;
930
930
  }
931
+ .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day,
932
+ .e-bigger.e-small .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day {
933
+ color: #a19f9d;
934
+ }
931
935
  .e-calendar .e-content.e-year td.e-selected > span.e-day, .e-calendar .e-content.e-decade td.e-selected > span.e-day, .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,
932
936
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected > span.e-day,
933
937
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected > span.e-day,
package/styles/calendar/fluent2.css CHANGED
@@ -47,7 +47,7 @@
47
47
  --color-sf-flyout-bg-color-pressed: #e0e0e0;
48
48
  --color-sf-flyout-bg-color-selected: #ebebeb;
49
49
  --color-sf-flyout-bg-color-focus: #f5f5f5;
50
- --color-sf-overlay-bg-color: #000;
50
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
51
51
  --color-sf-table-bg-color-hover: #f5f5f5;
52
52
  --color-sf-table-bg-color-pressed: #e0e0e0;
53
53
  --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
369
369
  --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
370
370
  --color-sf-flyout-bg-color-selected: #383838;
371
371
  --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
372
- --color-sf-overlay-bg-color: rgba($black, .4);
372
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
373
373
  --color-sf-table-bg-color-hover: #383838;
374
374
  --color-sf-table-bg-color-pressed: #2e2e2e;
375
375
  --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
711
711
  --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
712
712
  --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
713
713
  --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
714
- --color-sf-overlay-bg-color: rgba($black, .4);
715
- --color-sf-table-bg-color-hover: var(--color-sf-black);
716
- --color-sf-table-bg-color-pressed: var(--color-sf-black);
714
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
715
+ --color-sf-table-bg-color-hover: #1a3bff;
716
+ --color-sf-table-bg-color-pressed: #1a3bff;
717
717
  --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
732
732
  --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
733
733
  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
734
734
  --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
735
- --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
736
- --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
737
- --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
735
+ --color-sf-table-text-color-hover: #000;
736
+ --color-sf-table-text-color-pressed: #000;
737
+ --color-sf-table-text-color-selected: #000;
738
738
  --color-sf-icon-color: #fff;
739
- --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
740
- --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
739
+ --color-sf-icon-color-hover: #000;
740
+ --color-sf-icon-color-pressed: #000;
741
741
  --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
742
742
  --color-sf-border-light: #fff;
743
743
  --color-sf-border: var(--color-sf-border-light);
@@ -1935,6 +1935,10 @@ ejs-calendar {
1935
1935
  .e-bigger.e-small .e-calendar .e-content.e-month td.e-today span.e-day {
1936
1936
  color: var(--color-sf-primary-text-color);
1937
1937
  }
1938
+ .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day,
1939
+ .e-bigger.e-small .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day {
1940
+ color: var(--color-sf-content-text-color-disabled);
1941
+ }
1938
1942
  .e-calendar .e-content.e-year td.e-selected > span.e-day, .e-calendar .e-content.e-decade td.e-selected > span.e-day, .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,
1939
1943
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected > span.e-day,
1940
1944
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected > span.e-day,
package/styles/datepicker/fluent2.css CHANGED
@@ -47,7 +47,7 @@
47
47
  --color-sf-flyout-bg-color-pressed: #e0e0e0;
48
48
  --color-sf-flyout-bg-color-selected: #ebebeb;
49
49
  --color-sf-flyout-bg-color-focus: #f5f5f5;
50
- --color-sf-overlay-bg-color: #000;
50
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
51
51
  --color-sf-table-bg-color-hover: #f5f5f5;
52
52
  --color-sf-table-bg-color-pressed: #e0e0e0;
53
53
  --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
369
369
  --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
370
370
  --color-sf-flyout-bg-color-selected: #383838;
371
371
  --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
372
- --color-sf-overlay-bg-color: rgba($black, .4);
372
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
373
373
  --color-sf-table-bg-color-hover: #383838;
374
374
  --color-sf-table-bg-color-pressed: #2e2e2e;
375
375
  --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
711
711
  --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
712
712
  --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
713
713
  --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
714
- --color-sf-overlay-bg-color: rgba($black, .4);
715
- --color-sf-table-bg-color-hover: var(--color-sf-black);
716
- --color-sf-table-bg-color-pressed: var(--color-sf-black);
714
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
715
+ --color-sf-table-bg-color-hover: #1a3bff;
716
+ --color-sf-table-bg-color-pressed: #1a3bff;
717
717
  --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
732
732
  --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
733
733
  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
734
734
  --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
735
- --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
736
- --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
737
- --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
735
+ --color-sf-table-text-color-hover: #000;
736
+ --color-sf-table-text-color-pressed: #000;
737
+ --color-sf-table-text-color-selected: #000;
738
738
  --color-sf-icon-color: #fff;
739
- --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
740
- --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
739
+ --color-sf-icon-color-hover: #000;
740
+ --color-sf-icon-color-pressed: #000;
741
741
  --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
742
742
  --color-sf-border-light: #fff;
743
743
  --color-sf-border: var(--color-sf-border-light);
@@ -1302,7 +1302,7 @@
1302
1302
  pointer-events: auto;
1303
1303
  }
1304
1304
  .e-datepicker.e-date-modal {
1305
- background-color: rgba(var(--color-sf-overlay-bg-color), 0.4);
1305
+ background-color: var(--color-sf-overlay-bg-color);
1306
1306
  height: 100%;
1307
1307
  left: 0;
1308
1308
  opacity: 0.5;
package/styles/daterangepicker/_fluent2-definition.scss CHANGED
@@ -37,7 +37,7 @@ $range-indicator-label-width: 100% !default;
37
37
  $range-device-indicator-margin: 8px 0 0 !default;
38
38
  $range-device-indicator-height: 24px !default;
39
39
  $range-separator-height: 1px !default;
40
- $range-border-value: 1px solid $content-bg-color-alt1 !default;
40
+ $range-border-value: 1px solid $flyout-border !default;
41
41
  $range-container-border-value: none !default;
42
42
  $range-separator-margin: 0 !default;
43
43
  $range-footer-height: 47px !default;
@@ -290,11 +290,11 @@ $modal-range-tablet-font-size: 18px !default;
290
290
 
291
291
  $range-header-font-size: 16px !default;
292
292
 
293
- $footer-top-border-color :1px solid $border-light !default;
293
+ $footer-top-border-color :1px solid $flyout-border !default;
294
294
 
295
295
  /* stylelint-disable */
296
296
  .e-daterangepicker.e-popup .e-footer{
297
- border-top: 1px solid $footer-top-border-color !important;
297
+ border-top: $footer-top-border-color !important;
298
298
  }
299
299
 
300
300
  $range-icon-mouse-border-radius: 16px !default;
package/styles/daterangepicker/fluent2.css CHANGED
@@ -47,7 +47,7 @@
47
47
  --color-sf-flyout-bg-color-pressed: #e0e0e0;
48
48
  --color-sf-flyout-bg-color-selected: #ebebeb;
49
49
  --color-sf-flyout-bg-color-focus: #f5f5f5;
50
- --color-sf-overlay-bg-color: #000;
50
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
51
51
  --color-sf-table-bg-color-hover: #f5f5f5;
52
52
  --color-sf-table-bg-color-pressed: #e0e0e0;
53
53
  --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
369
369
  --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
370
370
  --color-sf-flyout-bg-color-selected: #383838;
371
371
  --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
372
- --color-sf-overlay-bg-color: rgba($black, .4);
372
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
373
373
  --color-sf-table-bg-color-hover: #383838;
374
374
  --color-sf-table-bg-color-pressed: #2e2e2e;
375
375
  --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
711
711
  --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
712
712
  --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
713
713
  --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
714
- --color-sf-overlay-bg-color: rgba($black, .4);
715
- --color-sf-table-bg-color-hover: var(--color-sf-black);
716
- --color-sf-table-bg-color-pressed: var(--color-sf-black);
714
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
715
+ --color-sf-table-bg-color-hover: #1a3bff;
716
+ --color-sf-table-bg-color-pressed: #1a3bff;
717
717
  --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
732
732
  --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
733
733
  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
734
734
  --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
735
- --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
736
- --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
737
- --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
735
+ --color-sf-table-text-color-hover: #000;
736
+ --color-sf-table-text-color-pressed: #000;
737
+ --color-sf-table-text-color-selected: #000;
738
738
  --color-sf-icon-color: #fff;
739
- --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
740
- --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
739
+ --color-sf-icon-color-hover: #000;
740
+ --color-sf-icon-color-pressed: #000;
741
741
  --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
742
742
  --color-sf-border-light: #fff;
743
743
  --color-sf-border: var(--color-sf-border-light);
@@ -1216,7 +1216,7 @@
1216
1216
  /*! calendar theme variables */
1217
1217
  /* stylelint-disable */
1218
1218
  .e-daterangepicker.e-popup .e-footer {
1219
- border-top: 1px solid 1px solid var(--color-sf-border-light) !important;
1219
+ border-top: 1px solid var(--color-sf-flyout-border) !important;
1220
1220
  }
1221
1221
 
1222
1222
  /*! component icons */
@@ -1485,7 +1485,7 @@
1485
1485
  -webkit-box-align: center;
1486
1486
  -ms-flex-align: center;
1487
1487
  align-items: center;
1488
- border-top: 1px solid var(--color-sf-content-bg-color-alt1);
1488
+ border-top: 1px solid var(--color-sf-flyout-border);
1489
1489
  clear: both;
1490
1490
  display: -webkit-box;
1491
1491
  display: -ms-flexbox;
@@ -1516,7 +1516,7 @@
1516
1516
  }
1517
1517
  .e-daterangepicker.e-popup .e-date-range-container.e-range-border,
1518
1518
  .e-bigger.e-small .e-daterangepicker.e-popup .e-date-range-container.e-range-border {
1519
- border-right: 1px solid var(--color-sf-content-bg-color-alt1);
1519
+ border-right: 1px solid var(--color-sf-flyout-border);
1520
1520
  }
1521
1521
  .e-daterangepicker.e-popup .e-calendar-container,
1522
1522
  .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container {
@@ -1531,7 +1531,7 @@
1531
1531
  }
1532
1532
  .e-daterangepicker.e-popup .e-calendar-container .e-left-container,
1533
1533
  .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container .e-left-container {
1534
- border-right: 1px solid var(--color-sf-content-bg-color-alt1);
1534
+ border-right: 1px solid var(--color-sf-flyout-border);
1535
1535
  }
1536
1536
  .e-daterangepicker.e-popup .e-presets,
1537
1537
  .e-bigger.e-small .e-daterangepicker.e-popup .e-presets {
@@ -1575,12 +1575,12 @@
1575
1575
  }
1576
1576
  .e-daterangepicker.e-rtl .e-date-range-container.e-range-border,
1577
1577
  .e-bigger.e-small .e-daterangepicker.e-rtl .e-date-range-container.e-range-border {
1578
- border-left: 1px solid var(--color-sf-content-bg-color-alt1);
1578
+ border-left: 1px solid var(--color-sf-flyout-border);
1579
1579
  border-right: 0;
1580
1580
  }
1581
1581
  .e-daterangepicker.e-rtl .e-date-range-container .e-left-container,
1582
1582
  .e-bigger.e-small .e-daterangepicker.e-rtl .e-date-range-container .e-left-container {
1583
- border-left: 1px solid var(--color-sf-content-bg-color-alt1);
1583
+ border-left: 1px solid var(--color-sf-flyout-border);
1584
1584
  border-right: 0;
1585
1585
  }
1586
1586
  .e-daterangepicker.e-rtl .e-date-range-container .e-calendar .e-next,
package/styles/datetimepicker/fluent2.css CHANGED
@@ -47,7 +47,7 @@
47
47
  --color-sf-flyout-bg-color-pressed: #e0e0e0;
48
48
  --color-sf-flyout-bg-color-selected: #ebebeb;
49
49
  --color-sf-flyout-bg-color-focus: #f5f5f5;
50
- --color-sf-overlay-bg-color: #000;
50
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
51
51
  --color-sf-table-bg-color-hover: #f5f5f5;
52
52
  --color-sf-table-bg-color-pressed: #e0e0e0;
53
53
  --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
369
369
  --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
370
370
  --color-sf-flyout-bg-color-selected: #383838;
371
371
  --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
372
- --color-sf-overlay-bg-color: rgba($black, .4);
372
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
373
373
  --color-sf-table-bg-color-hover: #383838;
374
374
  --color-sf-table-bg-color-pressed: #2e2e2e;
375
375
  --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
711
711
  --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
712
712
  --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
713
713
  --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
714
- --color-sf-overlay-bg-color: rgba($black, .4);
715
- --color-sf-table-bg-color-hover: var(--color-sf-black);
716
- --color-sf-table-bg-color-pressed: var(--color-sf-black);
714
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
715
+ --color-sf-table-bg-color-hover: #1a3bff;
716
+ --color-sf-table-bg-color-pressed: #1a3bff;
717
717
  --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
732
732
  --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
733
733
  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
734
734
  --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
735
- --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
736
- --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
737
- --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
735
+ --color-sf-table-text-color-hover: #000;
736
+ --color-sf-table-text-color-pressed: #000;
737
+ --color-sf-table-text-color-selected: #000;
738
738
  --color-sf-icon-color: #fff;
739
- --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
740
- --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
739
+ --color-sf-icon-color-hover: #000;
740
+ --color-sf-icon-color-pressed: #000;
741
741
  --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
742
742
  --color-sf-border-light: #fff;
743
743
  --color-sf-border: var(--color-sf-border-light);
package/styles/fluent-dark.css CHANGED
@@ -928,6 +928,10 @@ ejs-calendar {
928
928
  .e-bigger.e-small .e-calendar .e-content.e-month td.e-today span.e-day {
929
929
  color: #1b1a19;
930
930
  }
931
+ .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day,
932
+ .e-bigger.e-small .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day {
933
+ color: #484644;
934
+ }
931
935
  .e-calendar .e-content.e-year td.e-selected > span.e-day, .e-calendar .e-content.e-decade td.e-selected > span.e-day, .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,
932
936
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected > span.e-day,
933
937
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected > span.e-day,
package/styles/fluent.css CHANGED
@@ -928,6 +928,10 @@ ejs-calendar {
928
928
  .e-bigger.e-small .e-calendar .e-content.e-month td.e-today span.e-day {
929
929
  color: #fff;
930
930
  }
931
+ .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day,
932
+ .e-bigger.e-small .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day {
933
+ color: #a19f9d;
934
+ }
931
935
  .e-calendar .e-content.e-year td.e-selected > span.e-day, .e-calendar .e-content.e-decade td.e-selected > span.e-day, .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,
932
936
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected > span.e-day,
933
937
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected > span.e-day,
package/styles/fluent2.css CHANGED
@@ -47,7 +47,7 @@
47
47
  --color-sf-flyout-bg-color-pressed: #e0e0e0;
48
48
  --color-sf-flyout-bg-color-selected: #ebebeb;
49
49
  --color-sf-flyout-bg-color-focus: #f5f5f5;
50
- --color-sf-overlay-bg-color: #000;
50
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
51
51
  --color-sf-table-bg-color-hover: #f5f5f5;
52
52
  --color-sf-table-bg-color-pressed: #e0e0e0;
53
53
  --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
369
369
  --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
370
370
  --color-sf-flyout-bg-color-selected: #383838;
371
371
  --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
372
- --color-sf-overlay-bg-color: rgba($black, .4);
372
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
373
373
  --color-sf-table-bg-color-hover: #383838;
374
374
  --color-sf-table-bg-color-pressed: #2e2e2e;
375
375
  --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
711
711
  --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
712
712
  --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
713
713
  --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
714
- --color-sf-overlay-bg-color: rgba($black, .4);
715
- --color-sf-table-bg-color-hover: var(--color-sf-black);
716
- --color-sf-table-bg-color-pressed: var(--color-sf-black);
714
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
715
+ --color-sf-table-bg-color-hover: #1a3bff;
716
+ --color-sf-table-bg-color-pressed: #1a3bff;
717
717
  --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
732
732
  --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
733
733
  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
734
734
  --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
735
- --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
736
- --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
737
- --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
735
+ --color-sf-table-text-color-hover: #000;
736
+ --color-sf-table-text-color-pressed: #000;
737
+ --color-sf-table-text-color-selected: #000;
738
738
  --color-sf-icon-color: #fff;
739
- --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
740
- --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
739
+ --color-sf-icon-color-hover: #000;
740
+ --color-sf-icon-color-pressed: #000;
741
741
  --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
742
742
  --color-sf-border-light: #fff;
743
743
  --color-sf-border: var(--color-sf-border-light);
@@ -1935,6 +1935,10 @@ ejs-calendar {
1935
1935
  .e-bigger.e-small .e-calendar .e-content.e-month td.e-today span.e-day {
1936
1936
  color: var(--color-sf-primary-text-color);
1937
1937
  }
1938
+ .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day,
1939
+ .e-bigger.e-small .e-calendar .e-content.e-month td.e-disabled.e-today span.e-day {
1940
+ color: var(--color-sf-content-text-color-disabled);
1941
+ }
1938
1942
  .e-calendar .e-content.e-year td.e-selected > span.e-day, .e-calendar .e-content.e-decade td.e-selected > span.e-day, .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,
1939
1943
  .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected > span.e-day,
1940
1944
  .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected > span.e-day,
@@ -2607,7 +2611,7 @@ ejs-calendar {
2607
2611
  pointer-events: auto;
2608
2612
  }
2609
2613
  .e-datepicker.e-date-modal {
2610
- background-color: rgba(var(--color-sf-overlay-bg-color), 0.4);
2614
+ background-color: var(--color-sf-overlay-bg-color);
2611
2615
  height: 100%;
2612
2616
  left: 0;
2613
2617
  opacity: 0.5;
@@ -2986,7 +2990,7 @@ ejs-calendar {
2986
2990
 
2987
2991
  /* stylelint-disable */
2988
2992
  .e-daterangepicker.e-popup .e-footer {
2989
- border-top: 1px solid 1px solid var(--color-sf-border-light) !important;
2993
+ border-top: 1px solid var(--color-sf-flyout-border) !important;
2990
2994
  }
2991
2995
 
2992
2996
  /*! component icons */
@@ -3255,7 +3259,7 @@ ejs-calendar {
3255
3259
  -webkit-box-align: center;
3256
3260
  -ms-flex-align: center;
3257
3261
  align-items: center;
3258
- border-top: 1px solid var(--color-sf-content-bg-color-alt1);
3262
+ border-top: 1px solid var(--color-sf-flyout-border);
3259
3263
  clear: both;
3260
3264
  display: -webkit-box;
3261
3265
  display: -ms-flexbox;
@@ -3286,7 +3290,7 @@ ejs-calendar {
3286
3290
  }
3287
3291
  .e-daterangepicker.e-popup .e-date-range-container.e-range-border,
3288
3292
  .e-bigger.e-small .e-daterangepicker.e-popup .e-date-range-container.e-range-border {
3289
- border-right: 1px solid var(--color-sf-content-bg-color-alt1);
3293
+ border-right: 1px solid var(--color-sf-flyout-border);
3290
3294
  }
3291
3295
  .e-daterangepicker.e-popup .e-calendar-container,
3292
3296
  .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container {
@@ -3301,7 +3305,7 @@ ejs-calendar {
3301
3305
  }
3302
3306
  .e-daterangepicker.e-popup .e-calendar-container .e-left-container,
3303
3307
  .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container .e-left-container {
3304
- border-right: 1px solid var(--color-sf-content-bg-color-alt1);
3308
+ border-right: 1px solid var(--color-sf-flyout-border);
3305
3309
  }
3306
3310
  .e-daterangepicker.e-popup .e-presets,
3307
3311
  .e-bigger.e-small .e-daterangepicker.e-popup .e-presets {
@@ -3345,12 +3349,12 @@ ejs-calendar {
3345
3349
  }
3346
3350
  .e-daterangepicker.e-rtl .e-date-range-container.e-range-border,
3347
3351
  .e-bigger.e-small .e-daterangepicker.e-rtl .e-date-range-container.e-range-border {
3348
- border-left: 1px solid var(--color-sf-content-bg-color-alt1);
3352
+ border-left: 1px solid var(--color-sf-flyout-border);
3349
3353
  border-right: 0;
3350
3354
  }
3351
3355
  .e-daterangepicker.e-rtl .e-date-range-container .e-left-container,
3352
3356
  .e-bigger.e-small .e-daterangepicker.e-rtl .e-date-range-container .e-left-container {
3353
- border-left: 1px solid var(--color-sf-content-bg-color-alt1);
3357
+ border-left: 1px solid var(--color-sf-flyout-border);
3354
3358
  border-right: 0;
3355
3359
  }
3356
3360
  .e-daterangepicker.e-rtl .e-date-range-container .e-calendar .e-next,
package/styles/timepicker/fluent2.css CHANGED
@@ -47,7 +47,7 @@
47
47
  --color-sf-flyout-bg-color-pressed: #e0e0e0;
48
48
  --color-sf-flyout-bg-color-selected: #ebebeb;
49
49
  --color-sf-flyout-bg-color-focus: #f5f5f5;
50
- --color-sf-overlay-bg-color: #000;
50
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
51
51
  --color-sf-table-bg-color-hover: #f5f5f5;
52
52
  --color-sf-table-bg-color-pressed: #e0e0e0;
53
53
  --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
369
369
  --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
370
370
  --color-sf-flyout-bg-color-selected: #383838;
371
371
  --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
372
- --color-sf-overlay-bg-color: rgba($black, .4);
372
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
373
373
  --color-sf-table-bg-color-hover: #383838;
374
374
  --color-sf-table-bg-color-pressed: #2e2e2e;
375
375
  --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
711
711
  --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
712
712
  --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
713
713
  --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
714
- --color-sf-overlay-bg-color: rgba($black, .4);
715
- --color-sf-table-bg-color-hover: var(--color-sf-black);
716
- --color-sf-table-bg-color-pressed: var(--color-sf-black);
714
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
715
+ --color-sf-table-bg-color-hover: #1a3bff;
716
+ --color-sf-table-bg-color-pressed: #1a3bff;
717
717
  --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
732
732
  --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
733
733
  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
734
734
  --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
735
- --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
736
- --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
737
- --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
735
+ --color-sf-table-text-color-hover: #000;
736
+ --color-sf-table-text-color-pressed: #000;
737
+ --color-sf-table-text-color-selected: #000;
738
738
  --color-sf-icon-color: #fff;
739
- --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
740
- --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
739
+ --color-sf-icon-color-hover: #000;
740
+ --color-sf-icon-color-pressed: #000;
741
741
  --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
742
742
  --color-sf-border-light: #fff;
743
743
  --color-sf-border: var(--color-sf-border-light);