Fixed border for focused tag input
This commit is contained in:
parent
b76e4cd1af
commit
80d572622b
2 changed files with 13 additions and 2 deletions
|
@ -76,6 +76,10 @@ input[type=button]:not(:disabled):hover.highlight {
|
||||||
|
|
||||||
textarea:focus, input:focus {
|
textarea:focus, input:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
|
}
|
||||||
|
.tag-input.focused,
|
||||||
|
textarea:focus,
|
||||||
|
input:not(.tag-real-input):focus {
|
||||||
box-shadow: 0 0 0 1px #5da inset;
|
box-shadow: 0 0 0 1px #5da inset;
|
||||||
border-color: #5da;
|
border-color: #5da;
|
||||||
}
|
}
|
||||||
|
|
|
@ -30,7 +30,7 @@ App.Controls.TagInput = function(
|
||||||
|
|
||||||
var $wrapper = jQuery('<div class="tag-input">');
|
var $wrapper = jQuery('<div class="tag-input">');
|
||||||
var $tagList = jQuery('<ul class="tags">');
|
var $tagList = jQuery('<ul class="tags">');
|
||||||
var $input = jQuery('<input type="text"/>');
|
var $input = jQuery('<input class="tag-real-input" type="text"/>');
|
||||||
$wrapper.append($tagList);
|
$wrapper.append($tagList);
|
||||||
$wrapper.append($input);
|
$wrapper.append($input);
|
||||||
$wrapper.insertAfter($underlyingInput);
|
$wrapper.insertAfter($underlyingInput);
|
||||||
|
@ -40,6 +40,13 @@ App.Controls.TagInput = function(
|
||||||
});
|
});
|
||||||
$input.attr('placeholder', $underlyingInput.attr('placeholder'));
|
$input.attr('placeholder', $underlyingInput.attr('placeholder'));
|
||||||
|
|
||||||
|
$input.unbind('focus').bind('focus', function(e) {
|
||||||
|
$wrapper.addClass('focused');
|
||||||
|
});
|
||||||
|
$input.unbind('blur').bind('blur', function(e) {
|
||||||
|
$wrapper.removeClass('focused');
|
||||||
|
});
|
||||||
|
|
||||||
$input.unbind('paste').bind('paste', function(e) {
|
$input.unbind('paste').bind('paste', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
var pastedText;
|
var pastedText;
|
||||||
|
|
Loading…
Reference in a new issue