Improve search palette styling with better section rendering and padding (#2195)

* Improve search palette styling with better section rendering and padding

Co-Authored-By: [email protected] <[email protected]>

* Update search palette padding and add hover/selection highlighting

Co-Authored-By: [email protected] <[email protected]>

* Trigger CI re-run

Co-Authored-By: [email protected] <[email protected]>

---------

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: [email protected] <[email protected]>

Author: devin-ai-integration[bot]

apps/web/src/components/search.tsx

@@ -334,7 +334,7 @@ function SearchCommandPalette({
               onValueChange={setQuery}
             />
             <div className="border-t border-neutral-100" />
-            <CommandList className="max-h-[400px]">
+            <CommandList className="max-h-[400px] px-1">
               {isLoading && (
                 <div className="py-6 text-center text-sm text-neutral-500">
                   Searching...
@@ -344,13 +344,16 @@ function SearchCommandPalette({
                 <CommandEmpty>No results found.</CommandEmpty>
               )}
               {!isLoading && results.length > 0 && (
-                <CommandGroup heading="Documentation">
+                <CommandGroup
+                  heading="Documentation"
+                  className="[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-2 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-semibold [&_[cmdk-group-heading]]:text-neutral-500 [&_[cmdk-group-heading]]:uppercase [&_[cmdk-group-heading]]:tracking-wider"
+                >
                   {results.map((result, index) => (
                     <CommandItem
                       key={`${result.url}-${index}`}
                       value={result.url}
                       onSelect={() => handleSelect(result.url)}
-                      className="flex items-start gap-3 py-3 cursor-pointer"
+                      className="flex items-start gap-3 px-2 py-3 cursor-pointer rounded-md hover:bg-neutral-100 data-[selected=true]:bg-neutral-100"
                     >
                       <FileText
                         size={16}