1
0
mirror of https://github.com/ryanoasis/nerd-fonts.git synced 2024-12-19 20:12:52 +02:00

Hide scrollbar and parent element if no results, minor fixes

This commit is contained in:
Ryan L McIntyre 2020-12-05 06:44:04 -08:00
parent f406ae3bf8
commit 921769c278
2 changed files with 19 additions and 6 deletions

View File

@ -107,12 +107,16 @@ a.nerd-font-button:before {
max-height: 480px; max-height: 480px;
overflow-x: hidden; overflow-x: hidden;
overflow-y: scroll; overflow-y: scroll;
padding-top: 20px; margin-top: 40px;
max-width: none; max-width: none;
justify-content: center; justify-content: center;
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
margin-bottom: 60px; margin-bottom: 60px;
visibility: hidden; /* don't show any by default */
&.has-results {
visibility: visible;
}
} }
#glyphCheatSheet .column { #glyphCheatSheet .column {

19
site.js
View File

@ -169,11 +169,12 @@ document.addEventListener('DOMContentLoaded', function () {
} }
function searchGlyphs() { function searchGlyphs() {
var filter = elementGlyphSearch.value.toLowerCase(); const filter = elementGlyphSearch.value.toLowerCase();
var i = 0; const elements = elementGlyphCheatSheet.querySelectorAll('.column');
var elements = elementGlyphCheatSheet.querySelectorAll('.column'); const length = elements.length;
var length = elements.length; let i = 0;
var elementClassName, elementCodePoint; let elementClassName, elementCodePoint;
let anyVisibleColumns = false;
for (; i < length; i++) { for (; i < length; i++) {
elementClassName = elements[i].querySelector('div.class-name'); elementClassName = elements[i].querySelector('div.class-name');
@ -188,11 +189,19 @@ document.addEventListener('DOMContentLoaded', function () {
.indexOf(filter) > -1 .indexOf(filter) > -1
) { ) {
elementClassName.parentNode.classList.add('is-visible'); elementClassName.parentNode.classList.add('is-visible');
anyVisibleColumns = true;
} else { } else {
elementClassName.parentNode.classList.remove('is-visible'); elementClassName.parentNode.classList.remove('is-visible');
} }
} }
} }
if (anyVisibleColumns) {
elementGlyphCheatSheet.classList.add('has-results');
}
else {
elementGlyphCheatSheet.classList.remove('has-results');
}
} }
// extremely basic filtering on load: // extremely basic filtering on load: