initial code to add the search functionnality onto the a small viewport

[Kampouse]

What is it?

• Feature / enhancement
• Bug
• Docs / tests / types / typos
• Infra

Description

I was able to achieve decent behavior by utilizing the QwikUI modal component. The current implementation resulted in the component being partially hidden (off-screen) above pictue. Additionally, the implementation is missing a proper search button icon
I'm sharing this here to gather feedback on my progress so far.

Related issue: #6949

Please feel free to review and provide any suggestions or improvements.

Checklist:

• My code follows the developer guidelines of this project
• I have performed a self-review of my own code
• I have ran pnpm change and documented my changes
• I have made corresponding changes to the Qwik docs
• Added new tests to cover the fix / functionality

[changeset-bot]

⚠️ No Changeset found

Latest commit: c109ea1

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

built with Refined Cloudflare Pages Action

⚡ Cloudflare Pages Deployment

Name	Status	Preview	Last Commit
qwik-docs	✅ Ready (View Log)	Visit Preview	c109ea1

[wmertens]

Nice start. Can't you reuse the search icon from the desktop view?

[wmertens]

Actually if you feel up to it, it would be cool to change the docsearchmodal so it uses sync$ instead of all those noSerialize things and then the search box will be instantly available

[Kampouse]

the noSerialize scope over some variables (state) and from what I read that a no good? i am missing something 👀

[Kampouse]

Added the icon back and made it possible to control the Modal from An external controller
The Current search button that is internal to the Component. The normal behaviour to closing and opening work fine the internal controller had some extra wiring that unsure what is for but the base behaviour work