diff --git a/javascript/src/Main.js b/javascript/src/Main.js index 09f5df8a4124a6081538158cbc1561cc5c33e8b9..5eee8227a54bd1ca012dc4ef014e1a8fddd05936 100644 --- a/javascript/src/Main.js +++ b/javascript/src/Main.js @@ -58,5 +58,28 @@ $(document).ready( function () { } }); + $('.qfq-clear-me').each(function() { + var myInput = $(this); + if(!myInput.is("input,textarea")) { + return; + } + var closeButton = $("<span>", { + class: "qfq-clear-me-button hidden" + }); + closeButton.on("click", function(e) { + myInput.val(''); + closeButton.addClass("hidden"); + }); + $(this).after(closeButton); + $(this).on("input", function() { + if(myInput.val() != '') { + closeButton.removeClass("hidden"); + } else { + closeButton.addClass("hidden"); + } + }); + + }); + })(QfqNS); }); \ No newline at end of file diff --git a/less/qfq-bs.css.less b/less/qfq-bs.css.less index 775cca991e0d99d6cb2aea6d9937184a65ae67d0..968645c2f7ddb7862f5a93f5ce0a82c7ebda0d01 100644 --- a/less/qfq-bs.css.less +++ b/less/qfq-bs.css.less @@ -1063,7 +1063,31 @@ select.qfq-locked:invalid { } span.qfq-more-text { - display: none + display: none; +} + +.qfq-clear-me-button { + display: block; + content: '\f00d'; + font-family: FontAwesome; + right:21px; + width: 30px; + height: 30px; + top: 2px; + position:absolute; + cursor: pointer; +} +.qfq-clear-me-button:before { + content: '\f00d'; + font-family: FontAwesome; + position: absolute; + color: #aaa; + font-size: 21px; + left: 12px; +} + +input.qfq-clear-me { + padding-right: 28px; } // Droplets