@syncfusion/ej2-calendars 25.2.5 → 26.1.35

package/styles/daterangepicker/fluent2.scss

@@ -0,0 +1,7 @@
+@import 'ej2-base/styles/definition/fluent2.scss';
+@import 'ej2-inputs/styles/input/fluent2-definition.scss';
+@import 'ej2-popups/styles/popup/fluent2-definition.scss';
+@import '../calendar/fluent2-definition.scss';
+@import 'fluent2-definition.scss';
+@import 'icons/fluent2.scss';
+@import 'all.scss';

package/styles/daterangepicker/highcontrast-light.css

@@ -63,9 +63,9 @@
   font-family: "e-icons";
 }
 
-/*! daterangepicker layout */
 .e-input-group.e-control-wrapper.e-date-range-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
 .e-float-input.e-control-wrapper.e-input-group.e-date-range-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
 }
@@ -89,7 +89,8 @@
 .e-bigger.e-small .e-daterangepicker.e-popup {
   border: 1px solid #000;
   border-radius: 0;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   max-height: 500px;
   max-width: 730px;
 }
@@ -122,6 +123,7 @@
   text-decoration: none;
   text-overflow: ellipsis;
   -webkit-user-select: none;
+     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   white-space: nowrap;
@@ -142,14 +144,17 @@
   margin: 0 0 15px 0;
   text-align: center;
   -webkit-user-select: none;
+     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   width: 100%;
 }
 .e-daterangepicker.e-popup .e-range-header .e-start-end,
 .e-bigger.e-small .e-daterangepicker.e-popup .e-range-header .e-start-end {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   height: 35px;
@@ -218,14 +223,18 @@
 }
 .e-daterangepicker.e-popup .e-footer,
 .e-bigger.e-small .e-daterangepicker.e-popup .e-footer {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
   border-top: 1px solid #757575;
   clear: both;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-direction: row-reverse;
-      flex-direction: row-reverse;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: reverse;
+      -ms-flex-direction: row-reverse;
+          flex-direction: row-reverse;
   height: 48px;
 }
 .e-daterangepicker.e-popup .e-footer .e-btn,
@@ -251,6 +260,7 @@
 }
 .e-daterangepicker.e-popup .e-calendar-container,
 .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
 }
@@ -331,10 +341,13 @@
 }
 .e-daterangepicker.e-rtl .e-footer,
 .e-bigger.e-small .e-daterangepicker.e-rtl .e-footer {
-  -ms-flex-direction: row;
-      flex-direction: row;
-  -ms-flex-pack: end;
-      justify-content: flex-end;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+  -webkit-box-pack: end;
+      -ms-flex-pack: end;
+          justify-content: flex-end;
 }
 .e-daterangepicker.e-rtl .e-footer .e-btn.e-cancel,
 .e-bigger.e-small .e-daterangepicker.e-rtl .e-footer .e-btn.e-cancel {
@@ -381,15 +394,19 @@
 .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end,
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
   cursor: pointer;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   height: 36px;
-  -ms-flex-pack: center;
-      justify-content: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
   -webkit-user-select: none;
+     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   width: 100%;
@@ -400,7 +417,8 @@
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn {
   border: 1px solid #000;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   font-size: 16px;
   font-weight: normal;
   height: 32px;
@@ -427,7 +445,8 @@
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn:hover:not([disabled]),
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn:hover,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn:hover:not([disabled]) {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:active:not([disabled]), .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:hover, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:hover,
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active,
@@ -442,7 +461,8 @@
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:active:not([disabled]),
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:hover,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:hover {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn,
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn,
@@ -614,15 +634,20 @@
 }
 
 .e-daterangepick-mob-popup-wrap {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-direction: column;
-      flex-direction: column;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
   height: 100%;
-  -ms-flex-pack: center;
-      justify-content: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
   left: 0;
   max-height: 100%;
   position: fixed;
@@ -825,10 +850,12 @@
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header {
   height: 10%;
   padding: 2.5vh 2.5vw 2.5vh 1.5vw;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
   font-size: 3vh;
   border-bottom: none;
 }
@@ -884,8 +911,6 @@
     max-height: 85%;
     height: 85%;
   }
-}
-@media screen and (orientation: landscape) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header {
     height: 15%;
     font-size: 18px;
@@ -896,8 +921,6 @@
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header .e-model-title {
     padding: 1vh 1vw;
   }
-}
-@media screen and (orientation: landscape) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header {
     width: 100%;
   }
@@ -969,8 +992,6 @@
   width: calc(100% - 110px);
 }
 
-/* stylelint-enable */
-/*! daterangepicker theme */
 .e-date-range-wrapper .e-input-group-icon.e-icons.e-active {
   color: #000;
 }

package/styles/daterangepicker/highcontrast.css

@@ -64,9 +64,9 @@
   font-family: "e-icons";
 }
 
-/*! daterangepicker layout */
 .e-input-group.e-control-wrapper.e-date-range-wrapper.e-non-edit.e-input-focus .e-input:focus ~ .e-clear-icon,
 .e-float-input.e-control-wrapper.e-input-group.e-date-range-wrapper.e-non-edit.e-input-focus input:focus ~ .e-clear-icon {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
 }
@@ -90,7 +90,8 @@
 .e-bigger.e-small .e-daterangepicker.e-popup {
   border: 1px solid #fff;
   border-radius: 0;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   max-height: 500px;
   max-width: 730px;
 }
@@ -123,6 +124,7 @@
   text-decoration: none;
   text-overflow: ellipsis;
   -webkit-user-select: none;
+     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   white-space: nowrap;
@@ -143,14 +145,17 @@
   margin: 0 0 15px 0;
   text-align: center;
   -webkit-user-select: none;
+     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   width: 100%;
 }
 .e-daterangepicker.e-popup .e-range-header .e-start-end,
 .e-bigger.e-small .e-daterangepicker.e-popup .e-range-header .e-start-end {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   height: 35px;
@@ -219,14 +224,18 @@
 }
 .e-daterangepicker.e-popup .e-footer,
 .e-bigger.e-small .e-daterangepicker.e-popup .e-footer {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
   border-top: 1px solid #969696;
   clear: both;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-direction: row-reverse;
-      flex-direction: row-reverse;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: reverse;
+      -ms-flex-direction: row-reverse;
+          flex-direction: row-reverse;
   height: 48px;
 }
 .e-daterangepicker.e-popup .e-footer .e-btn,
@@ -252,6 +261,7 @@
 }
 .e-daterangepicker.e-popup .e-calendar-container,
 .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
 }
@@ -332,10 +342,13 @@
 }
 .e-daterangepicker.e-rtl .e-footer,
 .e-bigger.e-small .e-daterangepicker.e-rtl .e-footer {
-  -ms-flex-direction: row;
-      flex-direction: row;
-  -ms-flex-pack: end;
-      justify-content: flex-end;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+  -webkit-box-pack: end;
+      -ms-flex-pack: end;
+          justify-content: flex-end;
 }
 .e-daterangepicker.e-rtl .e-footer .e-btn.e-cancel,
 .e-bigger.e-small .e-daterangepicker.e-rtl .e-footer .e-btn.e-cancel {
@@ -382,15 +395,19 @@
 .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end,
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
   cursor: pointer;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   height: 36px;
-  -ms-flex-pack: center;
-      justify-content: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
   -webkit-user-select: none;
+     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   width: 100%;
@@ -401,7 +418,8 @@
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn {
   border: 1px solid #fff;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   font-size: 16px;
   font-weight: normal;
   height: 32px;
@@ -428,7 +446,8 @@
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn:hover:not([disabled]),
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn:hover,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn:hover:not([disabled]) {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:active:not([disabled]), .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:hover, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:hover,
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active,
@@ -443,7 +462,8 @@
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:active:not([disabled]),
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn.e-active:hover,
 *.e-device.e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn.e-active:hover {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn, .e-bigger .e-daterangepicker.e-popup .e-range-header .e-start-end .e-end-btn,
 *.e-bigger.e-daterangepicker.e-popup .e-range-header .e-start-end .e-start-btn,
@@ -615,15 +635,20 @@
 }
 
 .e-daterangepick-mob-popup-wrap {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-direction: column;
-      flex-direction: column;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
   height: 100%;
-  -ms-flex-pack: center;
-      justify-content: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
   left: 0;
   max-height: 100%;
   position: fixed;
@@ -826,10 +851,12 @@
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header {
   height: 10%;
   padding: 2.5vh 2.5vw 2.5vh 1.5vw;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
   font-size: 3vh;
   border-bottom: none;
 }
@@ -885,8 +912,6 @@
     max-height: 85%;
     height: 85%;
   }
-}
-@media screen and (orientation: landscape) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header {
     height: 15%;
     font-size: 18px;
@@ -897,8 +922,6 @@
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-range-mob-popup-wrap .e-model-header .e-model-title {
     padding: 1vh 1vw;
   }
-}
-@media screen and (orientation: landscape) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header {
     width: 100%;
   }
@@ -970,8 +993,6 @@
   width: calc(100% - 110px);
 }
 
-/* stylelint-enable */
-/*! daterangepicker theme */
 .e-date-range-wrapper .e-input-group-icon.e-icons.e-active {
   color: #fff;
 }

package/styles/daterangepicker/icons/_bootstrap5.3.scss

@@ -0,0 +1,92 @@
+@include export-module('daterangepicker-bootstrap5-icons') {
+
+  /*! component icons */
+  .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-control-wrapper .e-input-group-icon.e-range-icon {
+    border-bottom-right-radius: $range-icon-bottom-right-radius;
+    border-right: $range-control-border-right;
+    border-top-right-radius: $range-icon-top-right-radius;
+    font-size: $range-icon-font-size;
+    margin: $range-icon-margin;
+    min-height: $range-icon-container-min-height;
+    min-width: $range-icon-container-min-width;
+    outline: none;
+
+    #{if(&, '&', '*')}::before {
+      content: '\e74c';
+      font-family: 'e-icons';
+    }
+
+    #{if(&, '&', '*')}:focus {
+      background: $range-icon-hover-color;
+      border-radius: $range-icon-border-radius;
+    }
+  }
+
+  .e-daterangepicker {
+    #{if(&, '&', '*')} .e-calendar .e-header .e-date-icon-next::before {
+      content: '\e748';
+    }
+    #{if(&, '&', '*')} .e-calendar .e-header .e-date-icon-prev::before {
+      content: '\e765';
+    }
+    #{if(&, '&', '*')} .e-change-icon::before {
+      content: '\e7f9';
+    }
+    #{if(&, '&', '*')} .e-calendar.e-rtl .e-header .e-date-icon-next::before {
+      content: '\e765';
+    }
+    #{if(&, '&', '*')} .e-calendar.e-rtl .e-header .e-date-icon-prev::before {
+      content: '\e748';
+    }
+    #{if(&, '&', '*')}.e-rtl .e-start-end .e-change-icon::before {
+      content: '\e773';
+    }
+  }
+
+  .e-bigger {
+    #{if(&, '&', '*')} .e-input-group-icon.e-range-icon,
+    #{if(&, '&', '*')}.e-control-wrapper .e-input-group-icon.e-range-icon,
+    #{if(&, '&', '*')} .e-control-wrapper .e-input-group-icon.e-range-icon {
+      font-size: $range-bigger-icon-font-size;
+      margin: $range-icon-bigger-margin;
+      min-height: $range-bigger-icon-container-min-height;
+      min-width: $range-bigger-icon-container-min-width;
+      outline: none;
+    }
+  }
+
+  // mouse small icon
+  .e-small .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-control-wrapper.e-small .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-small .e-control-wrapper .e-input-group-icon.e-range-icon {
+    font-size: $range-small-icon-font-size;
+  }
+
+  // Touch small icon
+  .e-small.e-bigger .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-control-wrapper.e-small.e-bigger .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-small.e-bigger .e-control-wrapper .e-input-group-icon.e-range-icon {
+    font-size: $range-bigger-small-icon-font-size;
+  }
+
+  .e-daterangepick-mob-popup-wrap {
+    
+    #{if(&, '&', '*')} .e-daterangepicker.e-popup-expand {
+  
+      #{if(&, '&', '*')} .e-range-header,
+      #{if(&, '&', '*')} .e-model-header {
+  
+        #{if(&, '&', '*')} .e-popup-close::before {
+          content: '\e7e7';
+          font-family: 'e-icons';
+        }
+
+        #{if(&, '&', '*')} .e-apply::before {
+          content: '\e774';
+          font-family: 'e-icons';
+        }
+      }
+    }
+  }
+}

package/styles/daterangepicker/icons/_fluent2.scss

@@ -0,0 +1,132 @@
+@include export-module('daterangepicker-fluent2-icons') {
+
+  /*! component icons */
+  .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-control-wrapper .e-input-group-icon.e-range-icon {
+    font-size: $range-icon-font-size;
+    margin: $range-icon-margin;
+    min-height: $range-icon-container-min-height;
+    min-width: $range-icon-container-min-width;
+    outline: none;
+    border-radius: $range-icon-mouse-border-radius;
+  
+    #{if(&, '&', '*')}::before {
+      content: '\e7da';
+      font-family: 'e-icons';
+    }
+  
+    #{if(&, '&', '*')}:focus {
+      background: $range-icon-hover-color;
+      border-radius: $range-icon-border-radius;
+    }
+  }
+  
+  .e-daterangepicker {
+    #{if(&, '&', '*')} .e-calendar .e-header .e-date-icon-next::before {
+      content: '\e7d8';
+    }
+    #{if(&, '&', '*')} .e-calendar .e-header .e-date-icon-prev::before {
+      content: '\e7df';
+    }
+    #{if(&, '&', '*')} .e-change-icon::before {
+      content: '\e7f9';
+    }
+    #{if(&, '&', '*')} .e-calendar.e-rtl .e-header .e-date-icon-next::before {
+      content: '\e7df';
+    }
+    #{if(&, '&', '*')} .e-calendar.e-rtl .e-header .e-date-icon-prev::before {
+      content: '\e7d8';
+    }
+    #{if(&, '&', '*')}.e-rtl .e-start-end .e-change-icon::before {
+      content: '\e773';
+    }
+  }
+  
+  .e-bigger {
+    #{if(&, '&', '*')} .e-input-group-icon.e-range-icon,
+    #{if(&, '&', '*')}.e-control-wrapper .e-input-group-icon.e-range-icon,
+    #{if(&, '&', '*')} .e-control-wrapper .e-input-group-icon.e-range-icon {
+      font-size: $range-bigger-icon-font-size;
+      margin: $range-icon-bigger-margin;
+      padding: $zero-value;
+      min-height: $range-icon-bigger-container-min-height;
+      min-width: $range-icon-bigger-container-min-width;
+      outline: none;
+      border-radius: $range-icon-bigger-border-radius;
+    }
+  }
+  
+  // mouse small icon
+  .e-small .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-control-wrapper.e-small .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-small .e-control-wrapper .e-input-group-icon.e-range-icon {
+    font-size: $range-small-icon-font-size;
+    min-width: $range-small-icon-container-min-width;
+    min-height: $range-small-icon-container-min-height;
+    border-radius: $range-small-icon-border-radius;
+    margin: 0;
+    padding: $zero-value;
+  }
+  
+  // Touch small icon
+  .e-small.e-bigger .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-control-wrapper.e-small.e-bigger .e-input-group-icon.e-range-icon,
+  #{if(&, '&', '*')}.e-small.e-bigger .e-control-wrapper .e-input-group-icon.e-range-icon {
+    font-size: $range-bigger-small-icon-font-size;
+    min-width: $range-bigger-small-icon-container-min-width;
+    min-height: $range-bigger-small-icon-container-min-height;
+    border-radius: $range-bigger-small-icon-border-radius;
+    margin: $zero-value;
+    padding: $zero-value;
+  }
+  
+  // Outline textbox configuration
+  
+  .e-date-range-wrapper.e-outline .e-input-group-icon.e-range-icon,
+  .e-date-range-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-range-icon {
+    min-height: $zero-value;
+    min-width: 20px;
+  }
+  
+  .e-bigger .e-date-range-wrapper.e-outline .e-input-group-icon.e-range-icon,
+  .e-date-range-wrapper.e-control-wrapper.e-bigger.e-outline .e-input-group-icon.e-range-icon,
+  .e-bigger .e-date-range-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-range-icon {
+    min-height: $zero-value;
+    min-width: 24px;
+  }
+  
+  .e-small .e-date-range-wrapper.e-outline .e-input-group-icon.e-range-icon,
+  .e-date-range-wrapper.e-control-wrapper.e-small.e-outline .e-input-group-icon.e-range-icon,
+  .e-small .e-date-range-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-range-icon {
+    min-height: $zero-value;
+    min-width: 18px;
+  }
+  
+  .e-bigger.e-small .e-outline.e-date-range-wrapper .e-input-group-icon.e-range-icon,
+  .e-bigger.e-small.e-outline.e-date-range-wrapper .e-input-group-icon.e-range-icon,
+  .e-date-range-wrapper.e-control-wrapper.e-bigger.e-small.e-outline .e-input-group-icon.e-range-icon,
+  .e-bigger.e-small .e-date-range-wrapper.e-control-wrapper.e-outline .e-input-group-icon.e-range-icon {
+    min-height: $zero-value;
+    min-width: 20px;
+  }
+  
+  .e-daterangepick-mob-popup-wrap {
+      
+    #{if(&, '&', '*')} .e-daterangepicker.e-popup-expand {
+    
+      #{if(&, '&', '*')} .e-range-header,
+      #{if(&, '&', '*')} .e-model-header {
+    
+        #{if(&, '&', '*')} .e-popup-close::before {
+          content: '\e7e7';
+          font-family: 'e-icons';
+        }
+  
+        #{if(&, '&', '*')} .e-apply::before {
+          content: '\e774';
+          font-family: 'e-icons';
+        }
+      }
+    }
+  }
+}