Skip to content
This repository has been archived by the owner on Nov 22, 2021. It is now read-only.

Commit

Permalink
fix(tagsInput): Fix has-success, has-warning and has-error classes
Browse files Browse the repository at this point in the history
Fix Bootstrap validation classes by removing their dependency on the
has-feedback class.
  • Loading branch information
mbenford committed Sep 2, 2014
1 parent 308d86f commit 2a09873
Show file tree
Hide file tree
Showing 2 changed files with 72 additions and 86 deletions.
120 changes: 57 additions & 63 deletions scss/bootstrap/forms.scss
Original file line number Diff line number Diff line change
@@ -1,97 +1,91 @@
@import "../mixins";
@import "variables";

tags-input.ti-input-lg {
min-height: $tags-height-lg;
tags-input {
&.ti-input-lg {
min-height: $tags-height-lg;

.tags {
border-radius: $tag-border-radius-lg;

.tag-item {
height: $tag-height-lg;
line-height: $tag-height-lg - 1px;
font-size: $tag-font-size-lg;
.tags {
border-radius: $tag-border-radius-lg;

.remove-button {
font-size: $remove-button-font-size-lg;
.tag-item {
height: $tag-height-lg;
line-height: $tag-height-lg - 1px;
font-size: $tag-font-size-lg;
border-radius: $tag-border-radius-lg;

.remove-button {
font-size: $remove-button-font-size-lg;
}
}
}

.input {
height: $tag-height-lg;
font-size: $input-font-size-lg;
.input {
height: $tag-height-lg;
font-size: $input-font-size-lg;
}
}
}
}

tags-input.ti-input-sm {
min-height: $tags-height-sm;
&.ti-input-sm {
min-height: $tags-height-sm;

.tags {
border-radius: $tag-border-radius-sm;

.tag-item {
height: $tag-height-sm;
line-height: $tag-height-sm - 1px;
font-size: $tag-font-size-sm;
.tags {
border-radius: $tag-border-radius-sm;

.remove-button {
font-size: $remove-button-font-size-sm;
.tag-item {
height: $tag-height-sm;
line-height: $tag-height-sm - 1px;
font-size: $tag-font-size-sm;
border-radius: $tag-border-radius-sm;

.remove-button {
font-size: $remove-button-font-size-sm;
}
}
}

.input {
height: $tag-height-sm;
font-size: $input-font-size-sm;
.input {
height: $tag-height-sm;
font-size: $input-font-size-sm;
}
}
}
}

.has-feedback {
tags-input {
.tags {
padding-right: 30px;
}
.has-feedback tags-input {
.tags {
padding-right: 30px;
}
}

&.has-success {
tags-input {
.tags {
border-color: $tags-border-color-success;
.has-success tags-input {
.tags {
border-color: $tags-border-color-success;

&.focused {
border-color: $tags-outline-border-color-success;
@include box-shadow($tags-outline-border-shadow-success)
}
}
&.focused {
border-color: $tags-outline-border-color-success;
@include box-shadow($tags-outline-border-shadow-success)
}
}
}

&.has-error {
tags-input {
.tags {
border-color: $tags-border-color-error;
.has-error tags-input {
.tags {
border-color: $tags-border-color-error;

&.focused {
border-color: $tags-outline-border-color-error;
@include box-shadow($tags-outline-border-shadow-error)
}
}
&.focused {
border-color: $tags-outline-border-color-error;
@include box-shadow($tags-outline-border-shadow-error)
}
}
}

&.has-warning {
tags-input {
.tags {
border-color: $tags-border-color-warning;
.has-warning tags-input {
.tags {
border-color: $tags-border-color-warning;

&.focused {
border-color: $tags-outline-border-color-warning;
@include box-shadow($tags-outline-border-shadow-warning)
}
}
&.focused {
border-color: $tags-outline-border-color-warning;
@include box-shadow($tags-outline-border-shadow-warning)
}
}
}
38 changes: 15 additions & 23 deletions scss/bootstrap/input-groups.scss
Original file line number Diff line number Diff line change
@@ -1,47 +1,39 @@
@import "forms";
@import "../mixins";
@import "variables";

.input-group {
tags-input {
padding: 0;
display: table-cell;
}
.input-group tags-input {
padding: 0;
display: table-cell;

tags-input:not(:first-child) {
.tags {
@include border-left-radius(0)
}
&:not(:first-child) .tags {
@include border-left-radius(0)
}

tags-input:not(:last-child) {
.tags {
@include border-right-radius(0)
}
&:not(:last-child) .tags {
@include border-right-radius(0)
}
}

.input-group-lg {
tags-input {
@extend .ti-input-lg;
}
.input-group-lg tags-input {
@extend .ti-input-lg;

tags-input:first-child {
&:first-child .tags {
@include border-left-radius($tag-border-radius-lg);
}

tags-input:last-child {
&:last-child .tags {
@include border-right-radius($tag-border-radius-lg);
}
}

.input-group-sm tags-input {
@extend .ti-input-sm;

tags-input:first-child {
&:first-child .tags {
@include border-left-radius($tag-border-radius-sm);
}

tags-input:last-child {
&:last-child .tags {
@include border-right-radius($tag-border-radius-sm);
}
}
}

0 comments on commit 2a09873

Please sign in to comment.