diff options
Diffstat (limited to 'themes/simple/layouts/partials')
| -rw-r--r-- | themes/simple/layouts/partials/navigation.html | 6 | ||||
| -rw-r--r-- | themes/simple/layouts/partials/search.html | 11 |
2 files changed, 10 insertions, 7 deletions
diff --git a/themes/simple/layouts/partials/navigation.html b/themes/simple/layouts/partials/navigation.html index f6e5a66..44c6059 100644 --- a/themes/simple/layouts/partials/navigation.html +++ b/themes/simple/layouts/partials/navigation.html | |||
| @@ -9,11 +9,11 @@ | |||
| 9 | 9 | ||
| 10 | <!-- Search button --> | 10 | <!-- Search button --> |
| 11 | <span class="hidden lg:block"> | 11 | <span class="hidden lg:block"> |
| 12 | <span class="search-button flex gap-1 items-center text-gray-500 bg-gray-100 hover:bg-gray-200 rounded px-2 py-1 text-xs cursor-pointer mr-2 hidden" onclick="showSearchModal()"> | 12 | <span class="search-button flex gap-2 items-center text-gray-500 bg-gray-100 hover:bg-gray-200 rounded px-2 py-1 text-xs cursor-pointer mr-2 hidden" onclick="showSearchModal()"> |
| 13 | <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="3" stroke="currentColor" class="w-4 h-4"> | 13 | <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="4" stroke="currentColor" class="w-3 h-3"> |
| 14 | <path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z" /> | 14 | <path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z" /> |
| 15 | </svg> | 15 | </svg> |
| 16 | <span class="search-button-text uppercase font-bold"></span> | 16 | <span class="search-button-text font-bold"></span> |
| 17 | </span> | 17 | </span> |
| 18 | </span> | 18 | </span> |
| 19 | 19 | ||
diff --git a/themes/simple/layouts/partials/search.html b/themes/simple/layouts/partials/search.html index 5a76384..7978000 100644 --- a/themes/simple/layouts/partials/search.html +++ b/themes/simple/layouts/partials/search.html | |||
| @@ -7,6 +7,7 @@ | |||
| 7 | <script> | 7 | <script> |
| 8 | (async function() { | 8 | (async function() { |
| 9 | const debounceDelay = 700; | 9 | const debounceDelay = 700; |
| 10 | const maxSearchResults = 10; | ||
| 10 | 11 | ||
| 11 | // Fetch search index generated by Hugo. | 12 | // Fetch search index generated by Hugo. |
| 12 | const req = await fetch('/index.json'); | 13 | const req = await fetch('/index.json'); |
| @@ -41,9 +42,9 @@ | |||
| 41 | const searchButtonElement = document.querySelector('.search-button'); | 42 | const searchButtonElement = document.querySelector('.search-button'); |
| 42 | const searchButtonTextElement = document.querySelector('.search-button-text'); | 43 | const searchButtonTextElement = document.querySelector('.search-button-text'); |
| 43 | if (searchButtonElement) { | 44 | if (searchButtonElement) { |
| 44 | let searchButtonText = 'ctrl+k'; | 45 | let searchButtonText = 'Ctrl+K'; |
| 45 | if (navigator.platform.toUpperCase().indexOf('MAC') >= 0) { | 46 | if (navigator.platform.toUpperCase().indexOf('MAC') >= 0) { |
| 46 | searchButtonText = 'cmd+k'; | 47 | searchButtonText = '⌘+K'; |
| 47 | } | 48 | } |
| 48 | searchButtonTextElement.innerText = searchButtonText; | 49 | searchButtonTextElement.innerText = searchButtonText; |
| 49 | searchButtonElement.classList.remove('hidden'); | 50 | searchButtonElement.classList.remove('hidden'); |
| @@ -75,6 +76,8 @@ | |||
| 75 | searchResults.classList.add('hidden'); | 76 | searchResults.classList.add('hidden'); |
| 76 | } | 77 | } |
| 77 | } | 78 | } |
| 79 | } else { | ||
| 80 | searchInput.focus(); | ||
| 78 | } | 81 | } |
| 79 | } | 82 | } |
| 80 | 83 | ||
| @@ -136,7 +139,7 @@ | |||
| 136 | searchInput.addEventListener('keyup', debounce((evt)=> { | 139 | searchInput.addEventListener('keyup', debounce((evt)=> { |
| 137 | const query = evt.target.value.trim().toLowerCase(); | 140 | const query = evt.target.value.trim().toLowerCase(); |
| 138 | if (query.length && query != cachedSearchTerm) { | 141 | if (query.length && query != cachedSearchTerm) { |
| 139 | const results = searchIndex.search(query); | 142 | const results = searchIndex.search(`*${query}*`); |
| 140 | 143 | ||
| 141 | if (results.length == 0) { | 144 | if (results.length == 0) { |
| 142 | if (!searchResults.classList.contains('hidden')) { | 145 | if (!searchResults.classList.contains('hidden')) { |
| @@ -147,7 +150,7 @@ | |||
| 147 | searchResults.classList.remove('hidden'); | 150 | searchResults.classList.remove('hidden'); |
| 148 | cachedSearchTerm = query; | 151 | cachedSearchTerm = query; |
| 149 | 152 | ||
| 150 | results.forEach(resultItem => { | 153 | results.slice(0, maxSearchResults).forEach(resultItem => { |
| 151 | const item = window.searchDocuments.find(doc => doc.permalink === resultItem.ref); | 154 | const item = window.searchDocuments.find(doc => doc.permalink === resultItem.ref); |
| 152 | 155 | ||
| 153 | const link = document.createElement('a'); | 156 | const link = document.createElement('a'); |
