fix(daterange-picker): extract daterange picker styles as a separate …

…module
telerik · Jan 7, 2022 · 02b3560 · 02b3560
1 parent 40adb09
commit 02b3560
Show file tree

Hide file tree

Showing 22 changed files with 91 additions and 17 deletions.
diff --git a/packages/bootstrap/scss/daterangepicker/_index.scss b/packages/bootstrap/scss/daterangepicker/_index.scss
@@ -0,0 +1,10 @@
+@import "../core/_index.scss";
+
+
+// Dependencies
+
+
+// Component
+@import "_variables.scss";
+@import "_layout.scss";
+@import "_theme.scss";
diff --git a/packages/bootstrap/scss/daterangepicker/_layout.scss b/packages/bootstrap/scss/daterangepicker/_layout.scss
@@ -0,0 +1 @@
+@import "~@progress/kendo-theme-default/scss/daterangepicker/_layout.scss";
diff --git a/packages/bootstrap/scss/daterangepicker/_theme.scss b/packages/bootstrap/scss/daterangepicker/_theme.scss
@@ -0,0 +1 @@
+@import "~@progress/kendo-theme-default/scss/daterangepicker/_theme.scss";
diff --git a/packages/bootstrap/scss/daterangepicker/_variables.scss b/packages/bootstrap/scss/daterangepicker/_variables.scss
@@ -0,0 +1 @@
+// Daterangepicker
diff --git a/packages/bootstrap/scss/index.scss b/packages/bootstrap/scss/index.scss
@@ -69,6 +69,7 @@
 @import "datepicker/_index.scss";
 @import "timepicker/_index.scss";
 @import "datetimepicker/_index.scss";
+@import "daterangepicker/_index.scss";
 @import "dropdowngrid/_index.scss";
 @import "dropdownlist/_index.scss";
 @import "dropdowntree/_index.scss";

diff --git a/packages/classic/scss/daterangepicker/_index.scss b/packages/classic/scss/daterangepicker/_index.scss
@@ -0,0 +1,10 @@
+@import "../core/_index.scss";
+
+
+// Dependencies
+
+
+// Component
+@import "_variables.scss";
+@import "_layout.scss";
+@import "_theme.scss";
diff --git a/packages/classic/scss/daterangepicker/_layout.scss b/packages/classic/scss/daterangepicker/_layout.scss
@@ -0,0 +1 @@
+@import "~@progress/kendo-theme-default/scss/daterangepicker/_layout.scss";
diff --git a/packages/classic/scss/daterangepicker/_theme.scss b/packages/classic/scss/daterangepicker/_theme.scss
@@ -0,0 +1 @@
+@import "~@progress/kendo-theme-default/scss/daterangepicker/_theme.scss";
diff --git a/packages/classic/scss/daterangepicker/_variables.scss b/packages/classic/scss/daterangepicker/_variables.scss
@@ -0,0 +1 @@
+// Daterangepicker
diff --git a/packages/classic/scss/index.scss b/packages/classic/scss/index.scss
@@ -69,6 +69,7 @@
 @import "datepicker/_index.scss";
 @import "timepicker/_index.scss";
 @import "datetimepicker/_index.scss";
+@import "daterangepicker/_index.scss";
 @import "dropdowngrid/_index.scss";
 @import "dropdownlist/_index.scss";
 @import "dropdowntree/_index.scss";

diff --git a/packages/default/scss/calendar/_layout.scss b/packages/default/scss/calendar/_layout.scss
@@ -430,18 +430,6 @@
 
 
 
-
-@include exports("daterangepicker/layout") {
-
-    // jQuery DateRangePicker
-    .k-widget.k-daterangepicker {
-        border: 0;
-    }
-
-}
-
-
-
 @include exports("calendar/layout/rtl") {
 
     .k-rtl .k-calendar,

diff --git a/packages/default/scss/daterangepicker/_index.scss b/packages/default/scss/daterangepicker/_index.scss
@@ -0,0 +1,10 @@
+@import "../core/_index.scss";
+
+
+// Dependencies
+
+
+// Component
+@import "_variables.scss";
+@import "_layout.scss";
+@import "_theme.scss";
diff --git a/packages/default/scss/daterangepicker/_layout.scss b/packages/default/scss/daterangepicker/_layout.scss
@@ -0,0 +1,27 @@
+@include exports( "daterangepicker/layout" ) {
+
+    // Daterange picker
+    .k-daterangepicker {
+        border: 0;
+        display: inline-flex;
+        flex-flow: row nowrap;
+        align-items: flex-start;
+        gap: map-get( $spacing, 2 );
+    }
+
+
+    // Angular specific
+    kendo-daterange {
+        // @extend .k-daterangepicker;
+    }
+
+
+    // React specific
+    .k-daterangepicker-wrap {
+        display: inherit;
+        flex-flow: inherit;
+        align-items: inherit;
+        gap: inherit;
+    }
+
+}
diff --git a/packages/default/scss/daterangepicker/_theme.scss b/packages/default/scss/daterangepicker/_theme.scss
@@ -0,0 +1,3 @@
+@include exports("daterangepicker/theme") {
+
+}
diff --git a/packages/default/scss/daterangepicker/_variables.scss b/packages/default/scss/daterangepicker/_variables.scss
@@ -0,0 +1 @@
+// Daterangepicker
diff --git a/packages/default/scss/forms/_layout.scss b/packages/default/scss/forms/_layout.scss
@@ -106,13 +106,11 @@
             padding: 0;
         }
 
-        .k-form-field,
-        .k-daterangepicker .k-textbox-container {
+        .k-form-field {
             margin-top: $form-field-margin-top;
         }
 
-        > *,
-        .k-daterangepicker .k-textbox-container {
+        > * {
             &:not(.k-hidden):first-child,
             &.k-hidden + :not(.k-hidden) {
                 margin-top: 0;
@@ -154,7 +152,6 @@
         .k-dateinput,
         .k-datepicker,
         .k-datetimepicker,
-        .k-daterangepicker-wrap,
         .k-timepicker,
         .k-numerictextbox,
         .k-maskedtextbox,
@@ -163,6 +160,11 @@
             display: inline-flex;
             width: 100%;
         }
+        .k-daterangepicker {
+            width: 100%;
+            flex-flow: column nowrap;
+            gap: 0;
+        }
     }
 
     // Form Buttons Container

diff --git a/packages/default/scss/index.scss b/packages/default/scss/index.scss
@@ -69,6 +69,7 @@
 @import "datepicker/_index.scss";
 @import "timepicker/_index.scss";
 @import "datetimepicker/_index.scss";
+@import "daterangepicker/_index.scss";
 @import "dropdowngrid/_index.scss";
 @import "dropdownlist/_index.scss";
 @import "dropdowntree/_index.scss";

diff --git a/packages/material/scss/daterangepicker/_index.scss b/packages/material/scss/daterangepicker/_index.scss
@@ -0,0 +1,10 @@
+@import "../core/_index.scss";
+
+
+// Dependencies
+
+
+// Component
+@import "_variables.scss";
+@import "_layout.scss";
+@import "_theme.scss";
diff --git a/packages/material/scss/daterangepicker/_layout.scss b/packages/material/scss/daterangepicker/_layout.scss
@@ -0,0 +1 @@
+@import "~@progress/kendo-theme-default/scss/daterangepicker/_layout.scss";
diff --git a/packages/material/scss/daterangepicker/_theme.scss b/packages/material/scss/daterangepicker/_theme.scss
@@ -0,0 +1 @@
+@import "~@progress/kendo-theme-default/scss/daterangepicker/_theme.scss";
diff --git a/packages/material/scss/daterangepicker/_variables.scss b/packages/material/scss/daterangepicker/_variables.scss
@@ -0,0 +1 @@
+// Daterangepicker
diff --git a/packages/material/scss/index.scss b/packages/material/scss/index.scss
@@ -69,6 +69,7 @@
 @import "datepicker/_index.scss";
 @import "timepicker/_index.scss";
 @import "datetimepicker/_index.scss";
+@import "daterangepicker/_index.scss";
 @import "dropdowngrid/_index.scss";
 @import "dropdownlist/_index.scss";
 @import "dropdowntree/_index.scss";