From 663d374036c1ce2fa9487a3a251322630dc0a07c Mon Sep 17 00:00:00 2001 From: joneff Date: Fri, 16 Jul 2021 11:09:11 +0300 Subject: [PATCH] feat: remove bootstrap form overrides --- packages/bootstrap/scss/forms/_layout.scss | 15 -- packages/default/scss/forms/_layout.scss | 215 --------------------- 2 files changed, 230 deletions(-) diff --git a/packages/bootstrap/scss/forms/_layout.scss b/packages/bootstrap/scss/forms/_layout.scss index a6f53dc2620..4eabeb91383 100644 --- a/packages/bootstrap/scss/forms/_layout.scss +++ b/packages/bootstrap/scss/forms/_layout.scss @@ -1,18 +1,3 @@ -$twbs-font-size-base: $font-size-base !default; -$twbs-input-padding-x: $input-btn-padding-x !default; -$twbs-input-padding-y: $input-btn-padding-y !default; -$twbs-input-line-height: $line-height-base !default; - -$twbs-font-size-base-sm: $font-size-sm !default; -$twbs-input-padding-x-sm: $input-padding-x-sm !default; -$twbs-input-padding-y-sm: $input-padding-y-sm !default; -$twbs-input-line-height-sm: $input-line-height-sm !default; - -$twbs-font-size-base-lg: $font-size-lg !default; -$twbs-input-padding-x-lg: $input-padding-x-lg !default; -$twbs-input-padding-y-lg: $input-padding-y-lg !default; -$twbs-input-line-height-lg: $input-line-height-lg !default; - @import "~@progress/kendo-theme-default/scss/forms/_layout.scss"; @include exports("forms/layout/bootstrap") { diff --git a/packages/default/scss/forms/_layout.scss b/packages/default/scss/forms/_layout.scss index 3028cd8adf4..4cc684e8baf 100644 --- a/packages/default/scss/forms/_layout.scss +++ b/packages/default/scss/forms/_layout.scss @@ -473,218 +473,3 @@ } } - -@include exports("forms/integration-with-bootstrap-forms") { - $twbs-font-size-base: 1rem !default; - $twbs-input-padding-x: .75rem !default; - $twbs-input-padding-y: .5rem !default; - $twbs-input-line-height: 1.25 !default; - - $bootstrap-integration-input-height: ($twbs-input-padding-y * 2) + ($twbs-font-size-base * $twbs-input-line-height) !default; - - $twbs-font-size-base-sm: .875rem !default; - $twbs-input-padding-x-sm: .5rem !default; - $twbs-input-padding-y-sm: .25rem !default; - $twbs-input-line-height-sm: 1.5 !default; - - $bootstrap-integration-input-height-sm: ($twbs-input-padding-y-sm * 2) + ($twbs-font-size-base-sm * $twbs-input-line-height-sm) !default; - - $twbs-font-size-base-lg: 1.25rem !default; - $twbs-input-padding-x-lg: 1rem !default; - $twbs-input-padding-y-lg: .5rem !default; - $twbs-input-line-height-lg: 1.5 !default; - - $bootstrap-integration-input-height-lg: ($twbs-input-padding-y-lg * 2) + ($twbs-font-size-base-lg * $twbs-input-line-height-lg) !default; - - $numerictextbox-icon-offset-sm: 2px !default; - - .k-widget.form-control { - padding: 0; - } - - .k-widget.form-control, - .k-maskedtextbox.form-control .k-textbox, - .k-textbox.form-control { - width: 100%; - } - - .k-multiselect.form-control { - height: auto; - } - - .input-group { - .k-dateinput-wrap, - .k-dropdown-wrap, - .k-multiselect-wrap, - .k-numeric-wrap, - .k-picker-wrap, - .k-maskedtextbox .k-textbox { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - - .k-select { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - } - - .k-widget.form-control, - .k-maskedtextbox.form-control .k-textbox, - .k-textbox.form-control { - width: auto; - } - - .k-widget.form-control:not(:first-child):not(:last-child) { - .k-dateinput-wrap, - .k-dropdown-wrap, - .k-multiselect-wrap, - .k-numeric-wrap, - .k-picker-wrap, - > .k-textbox { - border-radius: 0; - } - } - } - - .input-group-prepend + .k-widget { - .k-dateinput-wrap, - .k-dropdown-wrap, - .k-multiselect-wrap, - .k-numeric-wrap, - .k-picker-wrap, - > .k-textbox { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-top-right-radius: $border-radius; - border-bottom-right-radius: $border-radius; - } - } - - // Bootstrap form-control, form-control-sm, form-control-lg - .k-widget { - &.form-control { - .k-input { - padding: $twbs-input-padding-y $twbs-input-padding-x; - height: $bootstrap-integration-input-height; - } - - &-sm { - .k-input { - padding: $twbs-input-padding-y-sm $twbs-input-padding-x-sm; - height: $bootstrap-integration-input-height-sm; - } - - .k-dateinput-wrap, - .k-dropdown-wrap, - .k-picker-wrap { - .k-select { - padding: $twbs-input-padding-y-sm; - } - } - - .k-select { - width: $bootstrap-integration-input-height-sm; - } - } - - &-lg { - .k-input { - padding: $twbs-input-padding-y-lg $twbs-input-padding-x-lg; - height: $bootstrap-integration-input-height-lg; - } - - .k-dateinput-wrap, - .k-dropdown-wrap, - .k-picker-wrap { - .k-select { - padding: $twbs-input-padding-y-lg; - } - } - - .k-select { - width: $bootstrap-integration-input-height-lg; - } - } - } - } - - .k-maskedtextbox { - &.form-control { - .k-textbox { - height: calc( #{$bootstrap-integration-input-height} + #{$input-border-width * 2} ); - padding: $twbs-input-padding-y $twbs-input-padding-x; - } - - &-sm { - .k-textbox { - height: calc( #{$bootstrap-integration-input-height-sm} + #{$input-border-width + 2} ); - padding: $twbs-input-padding-y-sm $twbs-input-padding-x-sm; - line-height: $twbs-input-line-height-sm; - } - } - - &-lg { - .k-textbox { - height: calc( #{$bootstrap-integration-input-height-lg} + #{$input-border-width * 2} ); - padding: $twbs-input-padding-y-lg $twbs-input-padding-x-lg; - line-height: $twbs-input-line-height-lg; - } - } - } - } - - .k-textbox { - &.form-control { - height: calc( #{$bootstrap-integration-input-height} + #{$input-border-width * 2} ); - padding: $twbs-input-padding-y $twbs-input-padding-x; - - &-sm { - height: calc( #{$bootstrap-integration-input-height-sm} + #{$input-border-width * 2} ); - padding: $twbs-input-padding-y-sm $twbs-input-padding-x-sm; - line-height: $twbs-input-line-height-sm; - } - - &-lg { - height: calc( #{$bootstrap-integration-input-height-lg} + #{$input-border-width * 2} ); - padding: $twbs-input-padding-y-lg $twbs-input-padding-x-lg; - line-height: $twbs-input-line-height-lg; - } - } - } - - .k-dateinput, - .k-numerictextbox { - &.form-control { - &-sm { - .k-link-increase > .k-icon { - bottom: -$numerictextbox-icon-offset-sm; - } - - .k-link-decrease > .k-icon { - top: -$numerictextbox-icon-offset-sm; - } - - .k-link { - height: ($bootstrap-integration-input-height-sm / 2); - } - } - - &-lg { - .k-link { - height: $bootstrap-integration-input-height-lg / 2; - } - } - } - } - - .k-dateinput { - &.form-control { - .k-dateinput-wrap { - .k-select { - padding-top: 0; - padding-bottom: 0; - } - } - } - } -}