Make the homepage search bar consistent with media outlet search bars

Update the homepage search bar component to match the UI and functionality of search bars found on media outlet pages, including the addition of a search input field and placeholder text.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9a264234-c5d7-4dcc-adf3-a954b149b30d
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/9a264234-c5d7-4dcc-adf3-a954b149b30d/IfFFLfD
This commit is contained in:
kimjaehyeon0101
2025-10-15 07:42:41 +00:00
parent bdb8369ae9
commit 673fb746ca

View File

@ -109,20 +109,20 @@ export default function Home() {
<div className="flex items-center space-x-4"> <div className="flex items-center space-x-4">
<div <div
className="relative cursor-pointer" className="relative cursor-pointer flex items-center"
onClick={() => setIsSearchModalOpen(true)} onClick={() => setIsSearchModalOpen(true)}
data-testid="search-container" data-testid="search-container"
> >
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400 pointer-events-none" /> <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400 pointer-events-none" />
<Input <div className="pl-10 pr-16 py-1.5 bg-gray-50 border border-gray-200 rounded-md flex items-center space-x-2 hover:bg-gray-100 transition-colors">
type="text" <span className="text-sm text-gray-500">search in</span>
placeholder="Search the website" <img
className="w-80 pl-10 bg-gray-50 border-gray-200 cursor-pointer" src="/attached_assets/logo_black_1759162717640.png"
data-testid="input-search" alt="SAPIENS"
readOnly className="h-2 w-auto"
onClick={() => setIsSearchModalOpen(true)}
/> />
</div> </div>
</div>
<Button <Button
variant="ghost" variant="ghost"