library-mirrors/Font-Awesome
1
0
Fork 0
mirror of https://github.com/FortAwesome/Font-Awesome.git synced 2024-11-20 11:14:28 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added feedback message when query returns no results.

Browse Source
This commit is contained in:
William Boman 2014-10-21 01:28:17 +02:00
parent d87208f277
commit 276b5a1bf0
3 changed files with 20 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/_includes/icons/filter.html
View File

@ -20,5 +20,9 @@
</div>
{% endfor %}
</div>
<div id="no-search-results">
<div class="alert alert-danger" role="alert"><i class="fa fa-ban"></i> No icons with the tag <strong>'<span></span>'</strong> were found.</div>
<div class="alert alert-info" role="alert"><i class="fa fa-exclamation-circle"></i> Tags are added by the community. Do you think your search query should return an icon? Send a pull request on <a href="https://github.com/FortAwesome/Font-Awesome">GitHub</a>!</div>
</div>
</{% if page.navbar_active == "icons" %}div{% else %}section{% endif %}>

12
src/assets/js/site.js
View File

@ -10,6 +10,7 @@ $(function() {
var $filter = $('#filter');
var $other = $('#new, #web-application, #form-control, #medical, #currency, #text-editor, #directional, #video-player, #brand, #file-type, #spinner, #payment, #chart');
var $clear = $('#filter-clear');
var $no_results = $('#no-search-results');
var $icons = $('.filter-icon', $filter);
@ -29,10 +30,21 @@ $(function() {
if(!val) return;
var resultsCount = 0;
$icons.each(function() {
var show = $(this).attr('data-filter').match(' '+val);
if( show ) resultsCount++;
$(this).toggle(!!show);
});
console.log(resultsCount);
if( resultsCount == 0 && val.length != 0 ) {
$no_results.find('span').text(val);
$no_results.show();
} else {
$no_results.hide();
}
}).trigger('keyup');
}

4
src/assets/less/site/lazy.less
View File

@ -84,3 +84,7 @@
.text-strike { text-decoration: line-through; }
.text-upper { text-transform: uppercase; }
.text-lower { text-transform: lowercase; }
#no-search-results {
display: none;
}