fix: always pass value to border-*-radius mixins

telerik · Aug 3, 2020 · efffbe8 · efffbe8
1 parent cc024cf
commit efffbe8
Show file tree

Hide file tree

Showing 27 changed files with 63 additions and 98 deletions.
diff --git a/packages/bootstrap/scss/combobox/_layout.scss b/packages/bootstrap/scss/combobox/_layout.scss
@@ -9,13 +9,5 @@
                 transition: $transition;
             }
         }
-
-        &[dir="rtl"],
-        .k-rtl & {
-            .k-select {
-                @include border-radius( $border-radius 0 0 $border-radius );
-                border-width: 0 1px 0 0;
-            }
-        }
     }
 }
diff --git a/packages/default/scss/autocomplete/_layout.scss b/packages/default/scss/autocomplete/_layout.scss
@@ -112,10 +112,6 @@
             padding-right: 0;
             text-align: right;
 
-            .k-select {
-                @include border-left-radius-only();
-            }
-
             .k-clear-value,
             .k-i-loading {
                 right: auto;

diff --git a/packages/default/scss/avatar/_layout.scss b/packages/default/scss/avatar/_layout.scss
@@ -9,21 +9,21 @@
     }
 
     .k-avatar-circle {
-        @include border-radius(50%);
+        @include border-radius( 50% );
 
         &.k-avatar-image {
             > * {
-                @include border-radius(50%);
+                @include border-radius( 50% );
             }
         }
     }
 
     .k-avatar-rounded {
-        @include border-radius($avatar-rounded-radius);
+        @include border-radius( $avatar-rounded-radius );
 
         &.k-avatar-image {
             > * {
-                @include border-radius($avatar-rounded-radius);
+                @include border-radius( $avatar-rounded-radius );
             }
         }
     }

diff --git a/packages/default/scss/button/_layout.scss b/packages/default/scss/button/_layout.scss
@@ -197,11 +197,11 @@
         &[dir="rtl"] {
             // k-button
             > .k-button:first-child {
-                @include border-left-radius(0);
+                @include border-left-radius( 0 );
                 @include border-right-radius( $button-border-radius );
             }
             > .k-button:last-child {
-                @include border-right-radius(0);
+                @include border-right-radius( 0 );
                 @include border-left-radius( $button-border-radius );
             }
         }
@@ -298,7 +298,7 @@
 
     // Button overlay
     .k-button-overlay {
-        @include border-radius(inherit);
+        @include border-radius( inherit );
         content: "";
         background: currentColor;
         opacity: 0;

diff --git a/packages/default/scss/calendar/_layout.scss b/packages/default/scss/calendar/_layout.scss
@@ -82,7 +82,7 @@
             z-index: 2;
 
             .k-link {
-                @include border-radius();
+                @include border-radius( $border-radius );
                 padding: $calendar-header-padding-y-sm;
                 display: flex;
                 flex-direction: row;

diff --git a/packages/default/scss/card/_layout.scss b/packages/default/scss/card/_layout.scss
@@ -435,11 +435,11 @@
         flex: 0 0 auto;
 
         .k-card {
-            @include border-radius(0);
+            @include border-radius( 0 );
             flex: 0 0 auto;
 
             > .k-card-header {
-                @include border-radius(0);
+                @include border-radius( 0 );
             }
         }
         .k-card + .k-card {

diff --git a/packages/default/scss/chat/_layout.scss b/packages/default/scss/chat/_layout.scss
@@ -166,7 +166,7 @@
 
         // Avatar
         .k-avatar {
-            @include border-radius(100%);
+            @include border-radius( 100% );
             width: $chat-avatar-size;
             height: $chat-avatar-size;
             margin: 0;

diff --git a/packages/default/scss/colorpicker/_layout.scss b/packages/default/scss/colorpicker/_layout.scss
@@ -112,7 +112,7 @@
             }
 
             .k-select {
-                @include border-right-radius-only();
+                @include border-right-radius-only( $input-border-radius );
                 padding: $picker-select-padding-y $picker-select-padding-x;
                 border-width: 0;
                 border-style: solid;
@@ -143,7 +143,7 @@
 
             .k-picker-wrap {
                 .k-select {
-                    @include border-left-radius-only();
+                    @include border-left-radius-only( $input-border-radius );
                 }
             }
         }
@@ -162,7 +162,7 @@
 @include exports( "flatcolorpicker/layout" ) {
 
     .k-flatcolorpicker {
-        @include border-radius();
+        @include border-radius( $input-border-radius );
         border-width: $colorpicker-border-width;
         border-style: solid;
         box-sizing: border-box;

diff --git a/packages/default/scss/combobox/_layout.scss b/packages/default/scss/combobox/_layout.scss
@@ -87,7 +87,7 @@
 
             // Select
             .k-select {
-                @include border-right-radius-only();
+                @include border-right-radius-only( $input-border-radius );
                 padding: $combobox-select-padding-y $combobox-select-padding-x;
                 width: if($use-picker-select-width, $combobox-select-width, auto);
                 border-width: 0 0 0 $combobox-select-border-width;
@@ -120,7 +120,8 @@
             text-align: right;
 
             .k-select {
-                @include border-left-radius-only();
+                @include border-left-radius-only( $input-border-radius );
+                border-width: 0 $combobox-select-border-width 0 0;
             }
 
             .k-clear-value {

diff --git a/packages/default/scss/common/_base.scss b/packages/default/scss/common/_base.scss
@@ -107,7 +107,7 @@ $widget-border-width: 1px !default;
     .k-block,
     .k-panel {
         @extend .k-text-selection !optional;
-        @include border-radius();
+        @include border-radius( $border-radius );
         @include fill(
             $panel-text,
             $panel-bg,
@@ -119,7 +119,7 @@ $widget-border-width: 1px !default;
         box-sizing: border-box;
 
         > .k-header {
-            @include border-top-radius();
+            @include border-top-radius( $border-radius );
             @include fill(
                 $header-text,
                 $header-bg,

diff --git a/packages/default/scss/dataviz/_layout.scss b/packages/default/scss/dataviz/_layout.scss
@@ -72,7 +72,7 @@
     }
 
     .k-chart-tooltip {
-        @include border-radius();
+        @include border-radius( $border-radius );
         font-size: $chart-tooltip-font-size;
         line-height: $line-height;
         padding: $tooltip-padding-y $tooltip-padding-x;
@@ -200,7 +200,7 @@
     }
 
     .k-navigator-hint .k-scroll {
-        @include border-radius();
+        @include border-radius( $border-radius );
         position: absolute;
         height: 4px;
     }

diff --git a/packages/default/scss/datetime/_layout.scss b/packages/default/scss/datetime/_layout.scss
@@ -60,7 +60,7 @@
             }
 
             .k-select {
-                @include border-right-radius-only();
+                @include border-right-radius-only( $input-border-radius );
                 padding: 0;
                 border-width: 0;
                 box-sizing: border-box;
@@ -81,7 +81,7 @@
             text-align: right;
 
             .k-select {
-                @include border-left-radius-only();
+                @include border-left-radius-only( $input-border-radius );
             }
         }
 
@@ -122,7 +122,7 @@
 
         .k-dateinput-wrap {
             border: 0;
-            @include border-left-radius-only();
+            @include border-left-radius-only( $input-border-radius );
         }
 
         .k-picker-wrap {

diff --git a/packages/default/scss/dropdownlist/_layout.scss b/packages/default/scss/dropdownlist/_layout.scss
@@ -51,7 +51,7 @@
             }
 
             .k-select {
-                @include border-right-radius-only();
+                @include border-right-radius-only( $input-border-radius );
                 padding: $picker-select-padding-y $picker-select-padding-x;
                 width: if($use-picker-select-width, $button-inner-calc-size, null);
                 border-width: 0;
@@ -107,7 +107,7 @@
         text-align: right;
 
         .k-select {
-            @include border-left-radius-only();
+            @include border-left-radius-only( $input-border-radius );
         }
 
         .k-dropdown-wrap .k-clear-value {

diff --git a/packages/default/scss/editor/_layout.scss b/packages/default/scss/editor/_layout.scss
@@ -43,7 +43,7 @@
 
     // Inline editor
     .k-editor-inline {
-        @include border-radius();
+        @include border-radius( $border-radius );
         padding: $padding-y-sm $padding-x-sm;
         border: 1px solid transparent;
         word-wrap: break-word;
@@ -385,7 +385,7 @@
             white-space: nowrap;
             overflow: hidden;
             cursor: pointer;
-            @include border-radius();
+            @include border-radius( $border-radius );
 
             .k-i-file,
             .k-i-folder {

diff --git a/packages/default/scss/gantt/_layout.scss b/packages/default/scss/gantt/_layout.scss
@@ -377,7 +377,7 @@
     // Single task
     .k-single-wrap {}
     .k-task-single {
-        @include border-radius();
+        @include border-radius( $border-radius );
         border-width: $gantt-task-border-width;
         border-style: solid;
         cursor: default;
@@ -409,7 +409,7 @@
         }
     }
     .k-task-complete {
-        @include border-radius();
+        @include border-radius( $border-radius );
         width: 20%;
         position: absolute;
         z-index: 1;
@@ -524,22 +524,6 @@
 
     .k-rtl {
 
-        .k-gantt-views {
-            float: left;
-
-            li:first-child + li { @include border-right-radius-only(); }
-            li:last-child { @include border-left-radius-only(); }
-        }
-
-        .k-gantt-actions {
-            float: right;
-
-            .k-button + .k-button {
-                margin-left: 0;
-                margin-right: $toolbar-padding-x;
-            }
-        }
-
         .k-gantt-rows,
         .k-gantt-columns {
             left: auto;

diff --git a/packages/default/scss/maskedtextbox/_layout.scss b/packages/default/scss/maskedtextbox/_layout.scss
@@ -42,10 +42,6 @@
         .k-rtl & {
             text-align: right;
 
-            .k-select {
-                @include border-left-radius-only();
-            }
-
             .k-i-warning {
                 right: auto;
                 left: $padding-x;

diff --git a/packages/default/scss/mixins/_border-radius.scss b/packages/default/scss/mixins/_border-radius.scss
@@ -1,57 +1,57 @@
 // Border radius
-@mixin border-radius( $radius: $border-radius ) {
+@mixin border-radius( $radius: null ) {
     @if $enable-rounded {
         border-radius: $radius;
     }
 }
 
-@mixin border-top-radius( $radius: $border-radius ) {
+@mixin border-top-radius( $radius: null ) {
     @if $enable-rounded {
         border-top-left-radius: $radius;
         border-top-right-radius: $radius;
     }
 }
 
-@mixin border-right-radius( $radius: $border-radius ) {
+@mixin border-right-radius( $radius: null ) {
     @if $enable-rounded {
         border-top-right-radius: $radius;
         border-bottom-right-radius: $radius;
     }
 }
 
-@mixin border-bottom-radius( $radius: $border-radius ) {
+@mixin border-bottom-radius( $radius: null ) {
     @if $enable-rounded {
         border-bottom-right-radius: $radius;
         border-bottom-left-radius: $radius;
     }
 }
 
-@mixin border-left-radius( $radius: $border-radius ) {
+@mixin border-left-radius( $radius: null ) {
     @if $enable-rounded {
         border-top-left-radius: $radius;
         border-bottom-left-radius: $radius;
     }
 }
 
-@mixin border-top-radius-only( $radius: $border-radius ) {
+@mixin border-top-radius-only( $radius: null ) {
     @if $enable-rounded {
         border-radius: $radius $radius 0 0;
     }
 }
 
-@mixin border-right-radius-only( $radius: $border-radius ) {
+@mixin border-right-radius-only( $radius: null ) {
     @if $enable-rounded {
         border-radius: 0 $radius $radius 0;
     }
 }
 
-@mixin border-bottom-radius-only( $radius: $border-radius ) {
+@mixin border-bottom-radius-only( $radius: null ) {
     @if $enable-rounded {
         border-radius: 0 0 $radius $radius;
     }
 }
 
-@mixin border-left-radius-only( $radius: $border-radius ) {
+@mixin border-left-radius-only( $radius: null ) {
     @if $enable-rounded {
         border-radius: $radius 0 0 $radius;
     }

diff --git a/packages/default/scss/multiselect/_layout.scss b/packages/default/scss/multiselect/_layout.scss
@@ -3,7 +3,7 @@
 
     // Base
     .k-multiselect {
-        @include border-radius();
+        @include border-radius( $input-border-radius );
         width: $multiselect-width;
         border-width: 0;
         box-sizing: border-box;
@@ -199,10 +199,6 @@
                 }
             }
 
-            .k-select {
-                @include border-left-radius-only();
-            }
-
             .k-clear-value,
             .k-i-loading {
                 right: auto;