From 2ead2985ccee1016ed2326f3c851dbcf56046994 Mon Sep 17 00:00:00 2001
From: Cole Goldsmith <cole.b.goldsmith@gmail.com>
Date: Mon, 22 Sep 2025 10:43:10 -0500
Subject: [PATCH] long list of filters styles, polish filter panel

---
 frontend/components/knowledge-filter-list.tsx  |  2 +-
 frontend/components/knowledge-filter-panel.tsx | 13 ++++---------
 frontend/components/navigation.tsx             |  2 +-
 frontend/components/ui/textarea.tsx            | 10 +++++-----
 4 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/frontend/components/knowledge-filter-list.tsx b/frontend/components/knowledge-filter-list.tsx
index 134f09f1..1393a50a 100644
--- a/frontend/components/knowledge-filter-list.tsx
+++ b/frontend/components/knowledge-filter-list.tsx
@@ -117,7 +117,7 @@ export function KnowledgeFilterList({
 
   return (
     <>
-      <div className="flex flex-col items-center gap-1 px-3">
+      <div className="flex flex-col items-center gap-1 px-3 !mb-12 mt-0 h-full overflow-y-auto">
         <div className="flex items-center w-full justify-between pl-3">
           <div className="text-sm font-medium text-muted-foreground">
             Knowledge Filters
diff --git a/frontend/components/knowledge-filter-panel.tsx b/frontend/components/knowledge-filter-panel.tsx
index b44f3219..6673b337 100644
--- a/frontend/components/knowledge-filter-panel.tsx
+++ b/frontend/components/knowledge-filter-panel.tsx
@@ -281,7 +281,6 @@ export function KnowledgeFilterPanel() {
         <CardHeader className="pb-3">
           <div className="flex items-center justify-between">
             <CardTitle className="text-lg flex items-center gap-2">
-              <Settings className="h-5 w-5" />
               Knowledge Filter
             </CardTitle>
             <Button
@@ -293,9 +292,6 @@ export function KnowledgeFilterPanel() {
               <X className="h-4 w-4" />
             </Button>
           </div>
-          <CardDescription>
-            Configure your knowledge filter settings
-          </CardDescription>
         </CardHeader>
 
         <CardContent className="space-y-6">
@@ -344,7 +340,7 @@ export function KnowledgeFilterPanel() {
               </div>
             ) : (
               <div className="space-y-3">
-                <div className="flex items-start justify-between">
+                <div className="flex items-center justify-between">
                   <div className="flex-1">
                     <h3 className="font-semibold text-lg">
                       {selectedFilter.name}
@@ -382,9 +378,8 @@ export function KnowledgeFilterPanel() {
             <Label htmlFor="search-query" className="text-sm font-medium">
               Search Query
             </Label>
-            <Input
+            <Textarea
               id="search-query"
-              type="text"
               placeholder="e.g., 'financial reports from Q4'"
               value={query}
               onChange={(e) => setQuery(e.target.value)}
@@ -488,7 +483,7 @@ export function KnowledgeFilterPanel() {
             <div className="space-y-4 pt-4 border-t border-border/50">
               <div className="space-y-2">
                 <div className="flex items-center justify-between">
-                  <Label className="text-sm font-medium">Limit</Label>
+                  <Label className="text-sm font-medium text-nowrap">Response limit</Label>
                   <Input
                     type="number"
                     min="1"
@@ -518,7 +513,7 @@ export function KnowledgeFilterPanel() {
               {/* Score Threshold Control - exactly like search page */}
               <div className="space-y-2">
                 <div className="flex items-center justify-between">
-                  <Label className="text-sm font-medium">Score Threshold</Label>
+                  <Label className="text-sm font-medium text-nowrap">Score threshold</Label>
                   <Input
                     type="number"
                     min="0"
diff --git a/frontend/components/navigation.tsx b/frontend/components/navigation.tsx
index 126316ef..b651ef6a 100644
--- a/frontend/components/navigation.tsx
+++ b/frontend/components/navigation.tsx
@@ -315,7 +315,7 @@ export function Navigation() {
   ]);
 
   return (
-    <div className="space-y-4 py-4 flex flex-col h-full bg-background">
+    <div className="flex flex-col h-full bg-background">
       <div className="px-3 py-2 flex-shrink-0">
         <div className="space-y-1">
           {routes.map((route) => (
diff --git a/frontend/components/ui/textarea.tsx b/frontend/components/ui/textarea.tsx
index 79998115..91a026db 100644
--- a/frontend/components/ui/textarea.tsx
+++ b/frontend/components/ui/textarea.tsx
@@ -1,18 +1,18 @@
-import * as React from "react"
+import * as React from "react";
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils";
 
 function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
   return (
     <textarea
       data-slot="textarea"
       className={cn(
-        "primary-input !placeholder-transparent",
+        "primary-input placeholder:font-mono placeholder:text-placeholder-foreground",
         className
       )}
       {...props}
     />
-  )
+  );
 }
 
-export { Textarea }
+export { Textarea };