Add documentation search and improve mobile docs layout#913
Open
Add documentation search and improve mobile docs layout#913
Conversation
|
🚀 Deployed preview to https://eclipse-theia.github.io/theia-website-previews/pr-previews/pr-913/ |
961569a to
1b145a6
Compare
Contributor
|
Changes look great, thank you. However, the navigate to section is behaving a bit weirdly for terms that appear in the TOC or in general whe there are several occurences in a doc. Search for example for "slash commands". In both hits, you will get to the TOC only. |
Member
Author
|
Ah thanks for catching this! 👍 |
- Integrate gatsby-plugin-local-search with FlexSearch for indexing all markdown docs - Add DocSearch component with dropdown results, keyboard navigation (Ctrl+K), and match highlighting - Add dedicated /docs/search/ page for full search results with URL query parameter support - Include search widget in both desktop sidebar (DocSideBar) and mobile topic chooser (DocTopicChooser) - Add showArrows prop to DocsLayout to allow hiding arrow navigators on the search page - Increase mobile padding in docs layout to accommodate the search bar
- Add z-index: 1000 to the sticky nav container so it renders above other positioned elements - Fix lint warning regarding noopener
- Add useIsMobile hook using window.matchMedia to detect viewport width - Render DocTopicChooser on mobile and DocSideBar on desktop instead of showing both - Pass shouldRenderLogo to Nav so the Theia logo appears in the docs layout on mobile - Remove display:none media query from DocTopicChooser since visibility is now controlled by the hook
- Extract findMatchAnchor, headingToAnchor, and stripTocSection into shared search-utils module - Strip Table of Contents sections from markdown before matching to avoid false snippet hits - Prioritize direct heading matches over body matches in findMatchAnchor - Use full page load for anchor links to fix scroll positioning on image-heavy pages - Add onInitialClientRender scroll handler to correct anchor positions after images load - Use Gatsby navigate() instead of window.history.pushState for search form submission
1b145a6 to
e49b286
Compare
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What it does
How to test
/docs/search/full results page/docs/search/?q=somethingloads with pre-filled query and results