Search UI tweaks (#13903)

This commit is contained in:
Josh Hawkins 2024-09-23 07:39:20 -05:00 committed by GitHub
parent 12e2c04486
commit fe57f7f489
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 8 deletions

View File

@ -445,7 +445,7 @@ export default function InputWithTags({
onFocus={handleInputFocus} onFocus={handleInputFocus}
onBlur={handleInputBlur} onBlur={handleInputBlur}
onKeyDown={handleInputKeyDown} onKeyDown={handleInputKeyDown}
className="text-md h-10 pr-24" className="text-md h-9 pr-24"
placeholder="Search..." placeholder="Search..."
/> />
<div className="absolute right-3 top-0 flex h-full flex-row items-center justify-center gap-5"> <div className="absolute right-3 top-0 flex h-full flex-row items-center justify-center gap-5">

View File

@ -22,6 +22,7 @@ import useKeyboardListener, {
} from "@/hooks/use-keyboard-listener"; } from "@/hooks/use-keyboard-listener";
import scrollIntoView from "scroll-into-view-if-needed"; import scrollIntoView from "scroll-into-view-if-needed";
import InputWithTags from "@/components/input/InputWithTags"; import InputWithTags from "@/components/input/InputWithTags";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
type SearchViewProps = { type SearchViewProps = {
search: string; search: string;
@ -276,6 +277,8 @@ export default function SearchView({
)} )}
{hasExistingSearch && ( {hasExistingSearch && (
<ScrollArea className="w-full whitespace-nowrap lg:ml-[35%]">
<div className="flex flex-row">
<SearchFilterGroup <SearchFilterGroup
className={cn( className={cn(
"w-full justify-between md:justify-start lg:justify-end", "w-full justify-between md:justify-start lg:justify-end",
@ -283,6 +286,9 @@ export default function SearchView({
filter={searchFilter} filter={searchFilter}
onUpdateFilter={onUpdateFilter} onUpdateFilter={onUpdateFilter}
/> />
<ScrollBar orientation="horizontal" className="h-0" />
</div>
</ScrollArea>
)} )}
</div> </div>