From a6659bc840d7b882558bcf64c5a73a903cd9c39c Mon Sep 17 00:00:00 2001
From: kjh2064 <kjh2064@gmail.com>
Date: Sat, 15 Aug 2026 23:28:30 +0900
Subject: [PATCH] fix(fe): add width 100% to .filters - ensure filters span
 full container width

CRITICAL FIX: Filters container must explicitly set width: 100% to span
the full parent width and prevent content-based shrink-to-fit.

Without width: 100%, .filters collapses to content width, causing
filter inputs to wrap to multiple lines when parent container width
changes.

Added 'width: 100%;' to .filters in:
- ModelsList.vue
- ShadowRunQueue.vue
- ApprovalQueue.vue
- DataQualityPage.vue

Result: Filters now correctly span full width and display on single line.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 frontend/src/features/approval/pages/ApprovalQueue.vue       | 1 +
 frontend/src/features/data-quality/pages/DataQualityPage.vue | 1 +
 frontend/src/features/models/pages/ModelsList.vue            | 1 +
 frontend/src/features/shadow-run/pages/ShadowRunQueue.vue    | 1 +
 4 files changed, 4 insertions(+)

diff --git a/frontend/src/features/approval/pages/ApprovalQueue.vue b/frontend/src/features/approval/pages/ApprovalQueue.vue
index c100b3c2..321f6d42 100644
--- a/frontend/src/features/approval/pages/ApprovalQueue.vue
+++ b/frontend/src/features/approval/pages/ApprovalQueue.vue
@@ -383,6 +383,7 @@ h3 {
   display: flex;
   align-items: center;
   gap: var(--ks-space-3);
+  width: 100%;
 }
 
 .input:focus, .textarea:focus {
diff --git a/frontend/src/features/data-quality/pages/DataQualityPage.vue b/frontend/src/features/data-quality/pages/DataQualityPage.vue
index b5f1c4c0..30c6ca9f 100644
--- a/frontend/src/features/data-quality/pages/DataQualityPage.vue
+++ b/frontend/src/features/data-quality/pages/DataQualityPage.vue
@@ -145,6 +145,7 @@ const handleRetry = () => {
   display: flex;
   align-items: center;
   gap: var(--ks-space-3);
+  width: 100%;
 }
 
 .search-input {
diff --git a/frontend/src/features/models/pages/ModelsList.vue b/frontend/src/features/models/pages/ModelsList.vue
index 001f014c..224e7bad 100644
--- a/frontend/src/features/models/pages/ModelsList.vue
+++ b/frontend/src/features/models/pages/ModelsList.vue
@@ -187,6 +187,7 @@ function handleSearch() {
   display: flex;
   align-items: center;
   gap: var(--ks-space-3);
+  width: 100%;
 }
 
 .search-input {
diff --git a/frontend/src/features/shadow-run/pages/ShadowRunQueue.vue b/frontend/src/features/shadow-run/pages/ShadowRunQueue.vue
index a1916177..041ea603 100644
--- a/frontend/src/features/shadow-run/pages/ShadowRunQueue.vue
+++ b/frontend/src/features/shadow-run/pages/ShadowRunQueue.vue
@@ -221,6 +221,7 @@ h1 {
   display: flex;
   align-items: center;
   gap: var(--ks-space-3);
+  width: 100%;
 }
 
 .search-input {