diff --git a/assets/js/index.js b/assets/js/index.js index 7f4bfcc..24049b9 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -133,6 +133,15 @@ Source: suggestions.innerHTML = ""; suggestions.classList.remove('d-none'); + // inform user that no results were found + if (flatResults.size === 0) { + const noResultsMessage = document.createElement('div') + noResultsMessage.innerHTML = `No results for "${searchQuery}"` + noResultsMessage.classList.add("suggestion__no-results"); + suggestions.appendChild(noResultsMessage); + return; + } + // construct a list of suggestions for(const [href, doc] of flatResults) { const entry = document.createElement('div'); diff --git a/assets/scss/components/_search.scss b/assets/scss/components/_search.scss index 7395004..45ec2af 100644 --- a/assets/scss/components/_search.scss +++ b/assets/scss/components/_search.scss @@ -10,11 +10,15 @@ z-index: $zindex-dropdown; } +#suggestions a, +.suggestion__no-results { + padding: 0.75rem; + margin: 0 0.5rem; +} + #suggestions a { display: block; text-decoration: none; - padding: 0.75rem; - margin: 0 0.5rem; } #suggestions a:focus { @@ -48,7 +52,8 @@ color: $black; } -.suggestion__description { +.suggestion__description, +.suggestion__no-results { color: $gray-700; }