Skip to content

Conversation

@waxzce
Copy link
Member

@waxzce waxzce commented Aug 7, 2025

This PR replaces the theme’s built-in search UI with Algolia DocSearch as a proof of concept. The existing theme search wrapper is hidden, and a DocSearch trigger is rendered in the header and styled to resemble the previous input. Functionally, it opens the DocSearch modal and supports common shortcuts (/ and Cmd/Ctrl+K). Initialization is made resilient with deferred loading and prefill logic.

Why
I was frustrated by the limited quality of the current client-side search in our documentation. This PoC demonstrates a working DocSearch integration that can be refined visually and made cleaner in terms of templating.

Scope and Notes

  • Hides the theme’s search wrapper (.search-wrapper).
  • Renders DocSearch (#docsearch) next to the hidden wrapper in the header.
  • Styles the DocSearch button to match the previous look & feel.
  • Keeps DocSearch params configured via Hugo (appId, apiKey, indexName).
  • Enables the theme search so the header slot/layout remains intact.

Caveats / Known Issues

  • Visual polish still needed to fully match the previous control (spacing, hover/focus, dark mode fine-tuning).
  • This is not a final integration—there may be a better Hugo-templating approach to avoid “violating” any theme conventions. I’m not fully familiar with Hextra/Hugo’s templating internals, so I opted for the least invasive path that achieves a working result quickly.
  • We may want to introduce a config-driven selector or a theme hook to make the placement cleaner.

Questions

  • Do we want to pursue this DocSearch approach?
  • If yes, I’ll follow up with a small pass on visual polish and refactor the injection to a cleaner partial/hook if needed.

Next Steps (if accepted)

  • Align the visual details (exact colors, spacing, icons).
  • Move any ad-hoc logic into a more canonical Hugo partial/override.
  • Remove leftover/unused theme search markup if we standardize on DocSearch.

waxzce added 2 commits August 8, 2025 03:14
Hide theme search wrapper; render DocSearch button styled like the theme.
– Inject #docsearch next to the original wrapper
– Style DocSearch button for similar look & feel
– Keyboard shortcuts (/ and Cmd/Ctrl+K), deferred init, prefill
– Keep DocSearch params in config; enable theme search for header slot

This is a proof of concept; visual polish and template-friendly integration still needed.
@github-actions
Copy link

github-actions bot commented Aug 7, 2025

✅ Review app deployed

Check how your changes look like!

ℹ️ Name 🔗 Infos & links
🌱 Latest deployed commit 34710c0
👁️ Preview https://documentation-PR-755.cleverapps.io/developers

@davlgd
Copy link
Collaborator

davlgd commented Aug 7, 2025

I pushed some commits to:

  • Fix Hugo config
  • Clean header menu integration
  • Use dedicated files for CSS/JS rather than layout embed

CSS need more work but it could be a solution to get better results

@davlgd davlgd marked this pull request as draft August 7, 2025 23:34
@waxzce
Copy link
Member Author

waxzce commented Aug 15, 2025

So, chat do we do about this ? We have a meeting or something ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants