wyl/jsonhero-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Style improvements to Search

Browse Source
This commit is contained in:
James Ritchie
2022-04-15 10:25:26 +01:00
parent 862bf371e9
commit 9213be9690
1 changed files with 17 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/SearchPalette.tsx
+17 -9
View File
@@ -237,7 +237,7 @@ export function SearchItem({
isHighlighted ? "bg-indigo-700" : "bg-slate-100 dark:bg-slate-900" isHighlighted ? "bg-indigo-700" : "bg-slate-100 dark:bg-slate-900"
)} )}
> >
<div className="flex items-center w-full p-2 pl-4 pr-3"> <div className="flex items-center w-full py-2 pl-4 pr-3">
<ItemIcon <ItemIcon
className={classnames( className={classnames(
"h-6 w-6", "h-6 w-6",
@@ -247,7 +247,7 @@ export function SearchItem({
)} )}
></ItemIcon> ></ItemIcon>
<div className="flex flex-col ml-3"> <div className="flex flex-col ml-3">
<div className="flex w-full items-center"> <div className="flex w-full items-baseline">
<SearchPathResult <SearchPathResult
path={heroPath} path={heroPath}
searchResult={result} searchResult={result}
@@ -319,10 +319,10 @@ function SearchPathResult({
isHighlighted={isHighlighted} isHighlighted={isHighlighted}
stringValue={label} stringValue={label}
matches={labelMatches} matches={labelMatches}
textSize="text-lg" textSize="text-xl"
className={classnames( className={classnames(
"mr-4 text-lg", "mr-3 text-xl",
isHighlighted ? `text-white` : "text-slate-800 dark:text-slate-300" isHighlighted ? `text-white` : "text-slate-900 dark:text-white"
)} )}
key="label" key="label"
/> />
@@ -350,17 +350,25 @@ function SearchPathResult({
{slice.slice.slice} {slice.slice.slice}
</span> </span>
) : slice.type === "ellipsis" ? ( ) : slice.type === "ellipsis" ? (
<Body key={i} className="text-base mx-1"> <Body
key={i}
className={classnames(
"text-base",
isHighlighted
? "text-white"
: "text-slate-600 dark:text-slate-400"
)}
>
… …
</Body> </Body>
) : ( ) : (
<ChevronRightIcon <ChevronRightIcon
key={i} key={i}
className={classnames( className={classnames(
"w-3 h-3 mx-0.5", "w-3 h-3 mx-[1px] relative top-[2px]",
isHighlighted isHighlighted
? "text-white" ? "text-white"
: "text-slate-800 dark:text-slate-400" : "text-slate-600 dark:text-slate-400"
)} )}
/> />
) )
@@ -395,7 +403,7 @@ function SearchResultValue({
className ?? className ??
classnames( classnames(
"mr-2", "mr-2",
isHighlighted ? `text-white` : "text-slate-600 dark:text-slate-500" isHighlighted ? `text-white` : "text-slate-600 dark:text-slate-400"
) )
} }
> >