From 7a1cbdc9a4168b55f9b94d973b6ca2a9d875488e Mon Sep 17 00:00:00 2001
From: Emil Petrov <emil.petrov@progress.com>
Date: Fri, 25 Mar 2022 15:36:42 +0200
Subject: [PATCH] fix(input): give flat input and picker border-radius on focus
 to match design

---
 packages/bootstrap/scss/input/_variables.scss | 2 ++
 packages/classic/scss/input/_variables.scss   | 2 ++
 packages/default/scss/input/_layout.scss      | 5 +++++
 packages/default/scss/input/_variables.scss   | 2 ++
 packages/material/scss/input/_variables.scss  | 2 ++
 5 files changed, 13 insertions(+)

diff --git a/packages/bootstrap/scss/input/_variables.scss b/packages/bootstrap/scss/input/_variables.scss
index 2564d8994b9..f09e53d1ad3 100644
--- 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
index 8fa144d3b7e..b4c8cb0033c 100644
--- 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
index e0fee5274b7..50472d298ed 100644
--- 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
index c3a821916ec..82efd177142 100644
--- 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
index 2c2ee9a6906..cb468a854ab 100644
--- 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;