-
Notifications
You must be signed in to change notification settings - Fork 10.6k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added support for search within the template as suggested in #581. I decided to go with a client side search based on [Ninja keys](https://github.com/ssleptsov/ninja-keys), but using [deepdub's fork](https://github.com/deepdub-ai/ninja-keys) as basis since it supports fuzzy search. Had to do a bunch of changes to their code to make it work without using node to install everything. Also changed to use some colors defined in our side and using both pages' titles and descriptions for search. Also had to increase the template max width to better accomodate the new item in navigation bar. Missing implementations: - [ ] One thing I'd love to do (but currently have no idea how) would be to change the text next to the search button depending on the platform. For example, if the user is accessing the site on a mac they should use ⌘k instead of ctrl k. - [x] Test how this looks like (and how it is supposed to work) on devices with smaller screens - [x] Support for offline mode Some screenshots: --- ## Dark version ![Screenshot from 2024-05-13 16-30-12](https://github.com/alshedivat/al-folio/assets/31376482/535acec5-dd7a-48cb-a17f-a295da98b5d3) ![Screenshot from 2024-05-13 16-30-26](https://github.com/alshedivat/al-folio/assets/31376482/6b2d94bb-3981-4252-ae2b-53994b514491) ![Screenshot from 2024-05-13 16-30-36](https://github.com/alshedivat/al-folio/assets/31376482/66262b56-2744-475d-b09f-2cb65210017b) --- ## Light version ![Screenshot from 2024-05-13 16-30-44](https://github.com/alshedivat/al-folio/assets/31376482/a0eec50c-e7ac-4b52-aee8-2050bff05d54) ![Screenshot from 2024-05-13 16-30-50](https://github.com/alshedivat/al-folio/assets/31376482/41d72066-3e68-4ec3-bf3d-140da621f67b) ![Screenshot from 2024-05-13 16-30-55](https://github.com/alshedivat/al-folio/assets/31376482/613fd56e-7180-4373-ab7a-dfed184b5a18) --------- Signed-off-by: George Araujo <george.gcac@gmail.com> Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
- Loading branch information
1 parent
eef62a3
commit 92cebc9
Showing
43 changed files
with
1,603 additions
and
3 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
{% if site.search_enabled %} | ||
<script type="module" src="{{ '/assets/js/search/ninja-keys.min.js' | relative_url | bust_file_cache }}"></script> | ||
<ninja-keys hideBreadcrumbs noAutoLoadMdIcons placeholder="Type to start searching"></ninja-keys> | ||
<script src="{{ '/assets/js/search-data.js' | relative_url | bust_file_cache }}"></script> | ||
<script> | ||
let theme = determineComputedTheme(); | ||
const ninjaKeys = document.querySelector('ninja-keys'); | ||
if (theme === 'dark') { | ||
ninjaKeys.classList.add('dark'); | ||
} else { | ||
ninjaKeys.classList.remove('dark'); | ||
} | ||
const openSearchModal = () => { | ||
// collapse navbarNav if expanded on mobile | ||
const navbarNav = document.querySelector('.navbar-collapse'); | ||
if (navbarNav.classList.contains('show')) { | ||
navbarNav.classList.remove('show'); | ||
} | ||
ninjaKeys.open(); | ||
}; | ||
</script> | ||
{% endif %} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.