kotovalexarian-likes-github/twbs--bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00
Code Releases Activity

Use $input-btn-border-width for both .form-control and .btn borders; fixes #18424

Browse source 
Both widgets need to use the same border width because of input groups.
Thus:
$btn-border-width   => $input-btn-border-width
$input-border-width => $input-btn-border-width

[skip sauce]
This commit is contained in:
Chris Rebert 2015-12-07 02:07:35 -08:00
parent ed0e6be863
commit 9dacdce42c
6 changed files with 12 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
scss/_button-group.scss
View file

@ -27,7 +27,7 @@
.btn + .btn-group, .btn + .btn-group,
.btn-group + .btn, .btn-group + .btn,
.btn-group + .btn-group { .btn-group + .btn-group {
margin-left: -$btn-border-width; margin-left: -$input-btn-border-width;
} }
} }
@ -167,7 +167,7 @@
> .btn + .btn-group, > .btn + .btn-group,
> .btn-group + .btn, > .btn-group + .btn,
> .btn-group + .btn-group { > .btn-group + .btn-group {
margin-top: -$btn-border-width; margin-top: -$input-btn-border-width;
margin-left: 0; margin-left: 0;
} }
} }

2
scss/_buttons.scss
View file

@ -10,7 +10,7 @@
vertical-align: middle; vertical-align: middle;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
border: $btn-border-width solid transparent; border: $input-btn-border-width solid transparent;
@include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $line-height, $btn-border-radius); @include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $line-height, $btn-border-radius);
@include transition(all .2s ease-in-out); @include transition(all .2s ease-in-out);

6
scss/_custom-forms.scss
View file

@ -138,7 +138,7 @@
background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC) no-repeat right .75rem center; background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC) no-repeat right .75rem center;
background-image: none \9; background-image: none \9;
background-size: 8px 10px; background-size: 8px 10px;
border: $input-border-width solid $input-border-color; border: $input-btn-border-width solid $input-border-color;
// Use vendor prefixes as `appearance` isn't part of the CSS spec. // Use vendor prefixes as `appearance` isn't part of the CSS spec.
-moz-appearance: none; -moz-appearance: none;
-webkit-appearance: none; -webkit-appearance: none;
@ -195,7 +195,7 @@
color: #555; color: #555;
user-select: none; user-select: none;
background-color: #fff; background-color: #fff;
border: $input-border-width solid #ddd; border: $input-btn-border-width solid #ddd;
border-radius: .25rem; border-radius: .25rem;
@include box-shadow(inset 0 .2rem .4rem rgba(0,0,0,.05)); @include box-shadow(inset 0 .2rem .4rem rgba(0,0,0,.05));
} }
@ -215,7 +215,7 @@
color: #555; color: #555;
content: "Browse"; content: "Browse";
background-color: #eee; background-color: #eee;
border: $input-border-width solid #ddd; border: $input-btn-border-width solid #ddd;
border-radius: 0 .25rem .25rem 0; border-radius: 0 .25rem .25rem 0;
} }

2
scss/_forms.scss
View file

@ -14,7 +14,7 @@
background-color: $input-bg; background-color: $input-bg;
// Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214. // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214.
background-image: none; background-image: none;
border: $input-border-width solid $input-border-color; border: $input-btn-border-width solid $input-border-color;
// Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS. // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
@include border-radius($input-border-radius); @include border-radius($input-border-radius);
@include box-shadow($input-box-shadow); @include box-shadow($input-box-shadow);

8
scss/_input-group.scss
View file

@ -91,7 +91,7 @@
color: $input-color; color: $input-color;
text-align: center; text-align: center;
background-color: $input-group-addon-bg; background-color: $input-group-addon-bg;
border: $input-border-width solid $input-group-addon-border-color; border: $input-btn-border-width solid $input-group-addon-border-color;
@include border-radius($border-radius); @include border-radius($border-radius);
// Sizing // Sizing
@ -160,7 +160,7 @@
> .btn { > .btn {
position: relative; position: relative;
+ .btn { + .btn {
margin-left: (-$btn-border-width); margin-left: (-$input-btn-border-width);
} }
// Bring the "active" button to the front // Bring the "active" button to the front
@include hover-focus-active { @include hover-focus-active {
@ -172,14 +172,14 @@
&:first-child { &:first-child {
> .btn, > .btn,
> .btn-group { > .btn-group {
margin-right: (-$btn-border-width); margin-right: (-$input-btn-border-width);
} }
} }
&:last-child { &:last-child {
> .btn, > .btn,
> .btn-group { > .btn-group {
z-index: 2; z-index: 2;
margin-left: (-$btn-border-width); margin-left: (-$input-btn-border-width);
// Because specificity // Because specificity
@include hover-focus-active { @include hover-focus-active {
z-index: 3; z-index: 3;

3
scss/_variables.scss
View file

@ -224,7 +224,6 @@ $table-border-color: $gray-lighter !default;
$btn-padding-x: 1rem !default; $btn-padding-x: 1rem !default;
$btn-padding-y: .375rem !default; $btn-padding-y: .375rem !default;
$btn-font-weight: normal !default; $btn-font-weight: normal !default;
$btn-border-width: $border-width !default;
$btn-primary-color: #fff !default; $btn-primary-color: #fff !default;
$btn-primary-bg: $brand-primary !default; $btn-primary-bg: $brand-primary !default;
@ -274,7 +273,7 @@ $input-bg-disabled: $gray-lighter !default;
$input-color: $gray !default; $input-color: $gray !default;
$input-border-color: #ccc !default; $input-border-color: #ccc !default;
$input-border-width: $border-width !default; $input-btn-border-width: $border-width !default; // For form controls and buttons
$input-box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !default; $input-box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !default;
$input-border-radius: $border-radius !default; $input-border-radius: $border-radius !default;