@syncfusion/ej2-calendars 32.1.22 → 32.1.24

package/styles/datepicker/fabric.css

@@ -29,6 +29,22 @@
   font-family: "e-icons";
 }
 
+.e-datepicker.e-popup-wrapper,
+.e-small.e-datepicker.e-popup-wrapper {
+  border: 1px solid #eaeaea;
+  -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
+          box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
+}
+.e-datepicker .e-calendar,
+.e-small.e-datepicker .e-calendar {
+  background-color: #fff;
+  border: none;
+}
+
+*.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
+  border: 1px solid #0078d6;
+}
+
 .e-input-group.e-control-wrapper.e-date-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
 .e-float-input.e-control-wrapper.e-input-group.e-date-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
   display: -webkit-box;
@@ -383,22 +399,6 @@
   }
 }
 /* stylelint-enable */
-.e-datepicker.e-popup-wrapper,
-.e-small.e-datepicker.e-popup-wrapper {
-  border: 1px solid #eaeaea;
-  -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
-          box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
-}
-.e-datepicker .e-calendar,
-.e-small.e-datepicker .e-calendar {
-  background-color: #fff;
-  border: none;
-}
-
-*.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
-  border: 1px solid #0078d6;
-}
-
 .e-bigger .e-content-placeholder.e-datepicker.e-placeholder-datepicker,
 .e-bigger.e-content-placeholder.e-datepicker.e-placeholder-datepicker {
   background-size: 250px 40px;

package/styles/datepicker/fabric.scss

@@ -4,5 +4,5 @@
 @use '../calendar/fabric-definition' as *;
 @use 'fabric-definition' as *;
 @use 'icons/fabric' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.fabric' as *;
+@use 'bigger.fabric' as *;

package/styles/datepicker/fluent-dark.css

@@ -38,6 +38,29 @@
   content: "\e7df";
 }
 
+.e-datepicker.e-popup-wrapper,
+.e-small.e-datepicker.e-popup-wrapper {
+  border: 0 solid #292827;
+  -webkit-box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
+          box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
+}
+.e-datepicker .e-calendar,
+.e-small.e-datepicker .e-calendar {
+  background-color: #252423;
+  border: none;
+}
+
+*.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
+  border: none;
+}
+
+.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
+  color: #a19f9d;
+}
+.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
+  color: #a19f9d;
+}
+
 .e-input-group.e-control-wrapper.e-date-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
 .e-float-input.e-control-wrapper.e-input-group.e-date-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
   display: -webkit-box;
@@ -392,29 +415,6 @@
   }
 }
 /* stylelint-enable */
-.e-datepicker.e-popup-wrapper,
-.e-small.e-datepicker.e-popup-wrapper {
-  border: 0 solid #292827;
-  -webkit-box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
-          box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
-}
-.e-datepicker .e-calendar,
-.e-small.e-datepicker .e-calendar {
-  background-color: #252423;
-  border: none;
-}
-
-*.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
-  border: none;
-}
-
-.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
-  color: #a19f9d;
-}
-.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
-  color: #a19f9d;
-}
-
 .e-bigger .e-content-placeholder.e-datepicker.e-placeholder-datepicker,
 .e-bigger.e-content-placeholder.e-datepicker.e-placeholder-datepicker {
   background-size: 250px 40px;

package/styles/datepicker/fluent-dark.scss

@@ -4,5 +4,5 @@
 @use '../calendar/fluent-dark-definition' as *;
 @use 'fluent-dark-definition' as *;
 @use 'icons/fluent-dark' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.fluent-dark' as *;
+@use 'bigger.fluent-dark' as *;

package/styles/datepicker/fluent.css

@@ -38,6 +38,29 @@
   content: "\e7df";
 }
 
+.e-datepicker.e-popup-wrapper,
+.e-small.e-datepicker.e-popup-wrapper {
+  border: 0 solid #edebe9;
+  -webkit-box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
+          box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
+}
+.e-datepicker .e-calendar,
+.e-small.e-datepicker .e-calendar {
+  background-color: #fff;
+  border: none;
+}
+
+*.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
+  border: none;
+}
+
+.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
+  color: #605e5c;
+}
+.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
+  color: #605e5c;
+}
+
 .e-input-group.e-control-wrapper.e-date-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
 .e-float-input.e-control-wrapper.e-input-group.e-date-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
   display: -webkit-box;
@@ -392,29 +415,6 @@
   }
 }
 /* stylelint-enable */
-.e-datepicker.e-popup-wrapper,
-.e-small.e-datepicker.e-popup-wrapper {
-  border: 0 solid #edebe9;
-  -webkit-box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
-          box-shadow: 0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108);
-}
-.e-datepicker .e-calendar,
-.e-small.e-datepicker .e-calendar {
-  background-color: #fff;
-  border: none;
-}
-
-*.e-input-group.e-date-wrapper.e-dateinput-active:active:not(.e-success):not(.e-warning):not(.e-error) {
-  border: none;
-}
-
-.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
-  color: #605e5c;
-}
-.e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
-  color: #605e5c;
-}
-
 .e-bigger .e-content-placeholder.e-datepicker.e-placeholder-datepicker,
 .e-bigger.e-content-placeholder.e-datepicker.e-placeholder-datepicker {
   background-size: 250px 40px;

package/styles/datepicker/fluent.scss

@@ -4,5 +4,5 @@
 @use '../calendar/fluent-definition' as *;
 @use 'fluent-definition' as *;
 @use 'icons/fluent' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.fluent' as *;
+@use 'bigger.fluent' as *;