From 26fbde6b6231ed8b4304c052747518f0e427cd59 Mon Sep 17 00:00:00 2001
From: William Guinaudie <william.guinaudie@gmail.com>
Date: Thu, 9 Oct 2025 11:04:44 +0200
Subject: [PATCH] fix(core): quick search modal on mobile device (#13694)

When searching on a mobile device, the search modal is wider than the
screen, making it hard to use
<img width="345" height="454" alt="Screenshot 2025-10-04 at 17 43 54"
src="https://github.com/user-attachments/assets/10594459-86c5-470b-a22f-578363694383"
/>

Now with the fix applied, it is  usable

<img width="350" height="454" alt="Screenshot 2025-10-04 at 17 44 14"
src="https://github.com/user-attachments/assets/eb783f5b-e3b6-4b7d-8f31-0d876911d95f"
/>


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **Style**
- Improved mobile responsiveness of the Quick Search modal. On screens
520px wide or smaller, the modal content now adapts its width instead of
enforcing a minimum, reducing overflow and improving readability on
small devices.
- No visual or behavioral changes on larger screens; existing layouts
and interactions remain unchanged.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../frontend/core/src/modules/quicksearch/views/modal.css.ts | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/packages/frontend/core/src/modules/quicksearch/views/modal.css.ts b/packages/frontend/core/src/modules/quicksearch/views/modal.css.ts
index a33a1d98f4..9de75a80a6 100644
--- a/packages/frontend/core/src/modules/quicksearch/views/modal.css.ts
+++ b/packages/frontend/core/src/modules/quicksearch/views/modal.css.ts
@@ -62,4 +62,9 @@ export const modalContent = style({
       animationFillMode: 'forwards',
     },
   },
+  '@media': {
+    'screen and (max-width: 520px)': {
+      minWidth: 'auto',
+    },
+  },
 });