fix(input): give flat input and picker border-radius on focus to matc…

…h design
telerik · Apr 29, 2022 · 7a1cbdc · 7a1cbdc
1 parent 95c5a9d
commit 7a1cbdc
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 0 deletions.
diff --git a/packages/bootstrap/scss/input/_variables.scss b/packages/bootstrap/scss/input/_variables.scss
@@ -81,6 +81,8 @@ $kendo-input-outline-bg: null !default;
 $kendo-input-outline-text: $base-text !default;
 $kendo-input-outline-border: rgba( $base-text, .5 ) !default;
 
+$kendo-input-flat-border-radius: 4px 4px 0px 0px !default;
+
 $kendo-picker-bg: $kendo-button-bg !default;
 $kendo-picker-text: $kendo-button-text !default;
 $kendo-picker-border: $kendo-button-border !default;

diff --git a/packages/classic/scss/input/_variables.scss b/packages/classic/scss/input/_variables.scss
@@ -91,6 +91,8 @@ $kendo-input-flat-focus-border: null !default;
 
 $kendo-input-flat-border-radius: 4px 4px 0px 0px !default;
 
+$kendo-input-flat-border-radius: null !default;
+
 $kendo-picker-bg: $kendo-button-bg !default;
 $kendo-picker-text: $kendo-button-text !default;
 $kendo-picker-border: $kendo-button-border !default;

diff --git a/packages/default/scss/input/_layout.scss b/packages/default/scss/input/_layout.scss
@@ -347,6 +347,11 @@
             padding-left: 0 !important; // sass-lint:disable-line no-important
             padding-right: 0 !important; // sass-lint:disable-line no-important
         }
+
+        &:focus,
+        &.k-focus {
+            @include border-radius( $kendo-input-flat-border-radius !important ); // sass-lint:disable-line no-important
+        }
     }
 
     .k-input-outline {

diff --git a/packages/default/scss/input/_variables.scss b/packages/default/scss/input/_variables.scss
@@ -81,6 +81,8 @@ $kendo-input-outline-bg: null !default;
 $kendo-input-outline-text: null !default;
 $kendo-input-outline-border: rgba( $kendo-button-text, .5) !default;
 
+$kendo-input-flat-border-radius: 4px 4px 0px 0px !default;
+
 $kendo-picker-bg: $kendo-button-bg !default;
 $kendo-picker-text: $kendo-button-text !default;
 $kendo-picker-border: $kendo-button-border !default;

diff --git a/packages/material/scss/input/_variables.scss b/packages/material/scss/input/_variables.scss
@@ -81,6 +81,8 @@ $kendo-input-outline-bg: null !default;
 $kendo-input-outline-text: null !default;
 $kendo-input-outline-border: null !default;
 
+$kendo-input-flat-border-radius: null !default;
+
 $kendo-picker-bg: $kendo-input-bg !default;
 $kendo-picker-text: $kendo-input-text !default;
 $kendo-picker-border: $kendo-input-border !default;