> .custom-file {
position: relative; // For focus state's z-index
flex: 1 1 auto;
- // Add width 1% and flex-basis auto to ensure that button will not wrap out
- // the column. Applies to IE Edge+ and Firefox. Chrome does not require this.
width: 1%;
+ min-width: 0; // https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-past-content-size
margin-bottom: 0;
+ .form-control,
> .form-control,
> .custom-select {
- &:not(:last-child) { @include border-right-radius(0); }
&:not(:first-child) { @include border-left-radius(0); }
}
align-items: center;
&:not(:last-child) .custom-file-label,
- &:not(:last-child) .custom-file-label::after { @include border-right-radius(0); }
&:not(:first-child) .custom-file-label { @include border-left-radius(0); }
}
+
+ &:not(.has-validation) {
+ > .form-control:not(:last-child),
+ > .custom-select:not(:last-child),
+ > .custom-file:not(:last-child) .custom-file-label::after {
+ @include border-right-radius(0);
+ }
+ }
+
+ &.has-validation {
+ > .form-control:nth-last-child(n + 3),
+ > .custom-select:nth-last-child(n + 3),
+ > .custom-file:nth-last-child(n + 3) .custom-file-label::after {
+ @include border-right-radius(0);
+ }
+ }
}
align-items: center;
padding: $input-padding-y $input-padding-x;
margin-bottom: 0; // Allow use of <label> elements by overriding our default margin-bottom
- font-size: $font-size-base; // Match inputs
+ @include font-size($input-font-size); // Match inputs
font-weight: $font-weight-normal;
line-height: $input-line-height;
color: $input-group-addon-color;
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn {
padding: $input-padding-y-lg $input-padding-x-lg;
- font-size: $input-font-size-lg;
+ @include font-size($input-font-size-lg);
line-height: $input-line-height-lg;
@include border-radius($input-border-radius-lg);
}
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-append > .btn {
padding: $input-padding-y-sm $input-padding-x-sm;
- font-size: $input-font-size-sm;
+ @include font-size($input-font-size-sm);
line-height: $input-line-height-sm;
@include border-radius($input-border-radius-sm);
}
.input-group-lg > .custom-select,
.input-group-sm > .custom-select {
- padding-right: ($custom-select-padding-x + $custom-select-indicator-padding);
+ padding-right: $custom-select-padding-x + $custom-select-indicator-padding;
}
.input-group > .input-group-prepend > .btn,
.input-group > .input-group-prepend > .input-group-text,
-.input-group > .input-group-append:not(:last-child) > .btn,
-.input-group > .input-group-append:not(:last-child) > .input-group-text,
+.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn,
+.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .input-group-text,
+.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn,
+.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .input-group-text,
.input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
@include border-right-radius(0);