| tags-input { |
| box-shadow: none; |
| border: none; |
| padding: 0; |
| min-height: 34px; |
| } |
| tags-input .host { |
| margin: 0; |
| } |
| tags-input .tags { |
| -moz-appearance: none; |
| -webkit-appearance: none; |
| border: 1px solid #cccccc; |
| border-radius: 4px; |
| -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); |
| -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); |
| box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); |
| -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; |
| -moz-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; |
| transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; |
| } |
| tags-input .tags .tag-item { |
| margin-right: 3px; |
| color: white; |
| background: #428bca; |
| border: 1px solid #357ebd; |
| border-radius: 4px; |
| } |
| tags-input .tags .tag-item.selected { |
| color: white; |
| background: #d9534f; |
| border: 1px solid #d43f3a; |
| } |
| tags-input .tags .tag-item .remove-button:hover { |
| text-decoration: none; |
| } |
| tags-input .tags.focused { |
| border: 1px solid #66afe9; |
| -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); |
| -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); |
| box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); |
| } |
| tags-input .autocomplete { |
| border-radius: 4px; |
| } |
| tags-input .autocomplete .suggestion-item.selected { |
| color: #262626; |
| background-color: whitesmoke; |
| } |
| tags-input .autocomplete .suggestion-item.selected em { |
| color: #262626; |
| background-color: whitesmoke; |
| } |
| tags-input .autocomplete .suggestion-item em { |
| color: black; |
| background-color: white; |
| } |
| tags-input.ng-invalid .tags { |
| border-color: #843534; |
| -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; |
| -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; |
| box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; |
| } |
| |
| .input-group tags-input { |
| padding: 0; |
| display: table-cell; |
| } |
| .input-group tags-input:not(:first-child) .tags { |
| border-top-left-radius: 0; |
| border-bottom-left-radius: 0; |
| } |
| .input-group tags-input:not(:last-child) .tags { |
| border-top-right-radius: 0; |
| border-bottom-right-radius: 0; |
| } |
| |
| .input-group-lg tags-input:first-child .tags { |
| border-top-left-radius: 6px; |
| border-bottom-left-radius: 6px; |
| } |
| .input-group-lg tags-input:last-child .tags { |
| border-top-right-radius: 6px; |
| border-bottom-right-radius: 6px; |
| } |
| |
| .input-group-sm tags-input:first-child .tags { |
| border-top-left-radius: 3px; |
| border-bottom-left-radius: 3px; |
| } |
| .input-group-sm tags-input:last-child .tags { |
| border-top-right-radius: 3px; |
| border-bottom-right-radius: 3px; |
| } |
| |
| tags-input.ti-input-lg, .input-group-lg tags-input { |
| min-height: 46px; |
| } |
| tags-input.ti-input-lg .tags, .input-group-lg tags-input .tags { |
| border-radius: 6px; |
| } |
| tags-input.ti-input-lg .tags .tag-item, .input-group-lg tags-input .tags .tag-item { |
| height: 38px; |
| line-height: 37px; |
| font-size: 18px; |
| border-radius: 6px; |
| } |
| tags-input.ti-input-lg .tags .tag-item .remove-button, .input-group-lg tags-input .tags .tag-item .remove-button { |
| font-size: 20px; |
| } |
| tags-input.ti-input-lg .tags .input, .input-group-lg tags-input .tags .input { |
| height: 38px; |
| font-size: 18px; |
| } |
| tags-input.ti-input-sm, .input-group-sm tags-input { |
| min-height: 30px; |
| } |
| tags-input.ti-input-sm .tags, .input-group-sm tags-input .tags { |
| border-radius: 3px; |
| } |
| tags-input.ti-input-sm .tags .tag-item, .input-group-sm tags-input .tags .tag-item { |
| height: 22px; |
| line-height: 21px; |
| font-size: 12px; |
| border-radius: 3px; |
| } |
| tags-input.ti-input-sm .tags .tag-item .remove-button, .input-group-sm tags-input .tags .tag-item .remove-button { |
| font-size: 16px; |
| } |
| tags-input.ti-input-sm .tags .input, .input-group-sm tags-input .tags .input { |
| height: 22px; |
| font-size: 12px; |
| } |
| |
| .has-feedback tags-input .tags { |
| padding-right: 30px; |
| } |
| |
| .has-success tags-input .tags { |
| border-color: #3c763d; |
| } |
| .has-success tags-input .tags.focused { |
| border-color: #2b542c; |
| -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; |
| -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; |
| box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; |
| } |
| |
| .has-error tags-input .tags { |
| border-color: #a94442; |
| } |
| .has-error tags-input .tags.focused { |
| border-color: #843534; |
| -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; |
| -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; |
| box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; |
| } |
| |
| .has-warning tags-input .tags { |
| border-color: #8a6d3b; |
| } |
| .has-warning tags-input .tags.focused { |
| border-color: #66512c; |
| -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; |
| -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; |
| box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; |
| } |
