feat(docs): expose the search in the 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: 88cd406

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	88cd406

[wmertens]

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

[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

[wmertens]

It looks really good to me, some small things left!

[pkg-pr-new]

Open in Stackblitz

npm i https://pkg.pr.new/@builder.io/qwik@6966

npm i https://pkg.pr.new/@builder.io/qwik-city@6966

npm i https://pkg.pr.new/eslint-plugin-qwik@6966

npm i https://pkg.pr.new/create-qwik@6966

commit: 88cd406

[wmertens]

@Kampouse you added 250 commits from somewhere and now your PR has 440 changed files 😬

If you have a Mac I recommend using https://gitup.co to fix this, otherwise see if you can cherry pick your own commits on a fresh branch?

[Kampouse]

Alright this is much better did not know about cherry-pick thank you!

[wmertens]

😁🐕