This commit is contained in:
2026-05-02 15:44:31 -07:00
parent dacab2f6ee
commit adb9e15b6c
8 changed files with 235 additions and 111 deletions

View File

@@ -139,7 +139,7 @@ export function SearchResultsPanel({
{search?.query ? (
<div className="mb-5">
<p className="text-sm text-muted-foreground">Results for</p>
<h2 className="mt-1 break-words text-xl font-semibold">{search.query}</h2>
<h2 className="mt-1 break-words text-xl font-semibold text-violet-50">{search.query}</h2>
<p className="mt-1 text-xs text-muted-foreground">
{search.results.length} result{search.results.length === 1 ? "" : "s"}
{search.latencyMs ? `${search.latencyMs} ms` : ""}
@@ -148,8 +148,8 @@ export function SearchResultsPanel({
) : null}
{(isRunning || !!search?.answerText || !!search?.answerError) && (
<section className="mb-6 rounded-xl border border-violet-400/35 bg-[hsl(276_31%_15%)] p-4">
<p className="text-xs font-semibold uppercase tracking-wide text-violet-300/90">Answer</p>
<section className="mb-6 rounded-xl border border-violet-300/24 bg-[linear-gradient(135deg,hsl(240_46%_8%_/_0.94),hsl(260_40%_12%_/_0.88))] p-4 shadow-[inset_0_1px_0_hsl(255_100%_92%_/_0.06)]">
<p className="text-xs font-semibold uppercase text-violet-300/90">Answer</p>
{(isAnswerLoading || hasAnswerText) ? (
<div className="mt-2">
<div className="relative">
@@ -172,7 +172,7 @@ export function SearchResultsPanel({
)}
</div>
{!isAnswerExpanded && (isExpandable || isAnswerLoading) ? (
<div className="pointer-events-none absolute inset-x-0 bottom-0 h-7 bg-gradient-to-t from-[hsl(276_31%_15%)] to-transparent" />
<div className="pointer-events-none absolute inset-x-0 bottom-0 h-7 bg-gradient-to-t from-[hsl(252_42%_10%)] to-transparent" />
) : null}
</div>
<div className="mt-2 h-5">
@@ -199,7 +199,7 @@ export function SearchResultsPanel({
href={citation.href}
target={openLinksInNewTab ? "_blank" : undefined}
rel={openLinksInNewTab ? "noreferrer" : undefined}
className="max-w-full truncate rounded-md border border-violet-400/40 px-2 py-1 text-xs text-violet-200 hover:bg-violet-500/20"
className="max-w-full truncate rounded-md border border-violet-300/28 bg-violet-300/8 px-2 py-1 text-xs text-violet-200 hover:bg-violet-500/20"
>
<span className="mr-1 rounded bg-violet-900/70 px-1 py-0.5 text-[10px] text-violet-100">{citation.index}</span>
{citation.label}
@@ -225,23 +225,23 @@ export function SearchResultsPanel({
<article
key={result.id}
className={cn(
"rounded-lg border border-border bg-[hsl(276_30%_13%)] px-4 py-4 shadow-sm transition-colors",
index === activeResultIndex && "border-violet-300 ring-1 ring-violet-300/80"
"rounded-lg border border-violet-300/16 bg-[linear-gradient(135deg,hsl(238_44%_7%_/_0.92),hsl(250_34%_10%_/_0.86))] px-4 py-4 shadow-sm transition-colors",
index === activeResultIndex && "border-violet-300/55 ring-1 ring-violet-300/70"
)}
>
<p className="truncate text-xs text-violet-300/85">{formatHost(result.url)}</p>
<p className="truncate text-xs text-cyan-200/85">{formatHost(result.url)}</p>
<a
href={result.url}
target={openLinksInNewTab ? "_blank" : undefined}
rel={openLinksInNewTab ? "noreferrer" : undefined}
className="mt-1 block break-words text-lg font-medium text-violet-300 hover:underline"
className="mt-1 block break-words text-lg font-medium text-violet-200 hover:underline"
>
{result.title || result.url}
</a>
{(result.publishedDate || result.author) && (
<p className="mt-1 text-xs text-muted-foreground">{[result.publishedDate, result.author].filter(Boolean).join(" • ")}</p>
)}
{result.url ? <p className="mt-2 break-all text-sm leading-6 text-violet-100/90">{result.url}</p> : null}
{result.url ? <p className="mt-2 break-all text-sm leading-6 text-violet-100/82">{result.url}</p> : null}
</article>
);
})}