21 lines
700 B
JavaScript
21 lines
700 B
JavaScript
import { Search } from "lucide-react";
|
|
|
|
const SearchBar = () => {
|
|
return (
|
|
<div className="flex flex-1 max-w-sm mx-4">
|
|
<div className="relative w-full">
|
|
<input
|
|
type="text"
|
|
placeholder="Search products, brands..."
|
|
className="w-full h-10 pl-10 pr-4 rounded-full border border-gray-300 text-sm sm:text-base
|
|
focus:outline-none focus:ring-2 focus:ring-primary focus:border-primary
|
|
transition-shadow duration-300 shadow-sm hover:shadow-md"
|
|
/>
|
|
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400" />
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default SearchBar;
|