forked from crowetic/commerce
33 lines
937 B
TypeScript
33 lines
937 B
TypeScript
import cn from 'classnames'
|
|
import { FC } from 'react'
|
|
import s from './Searchbar.module.css'
|
|
|
|
interface Props {
|
|
className?: string
|
|
children?: any
|
|
}
|
|
|
|
const Searchbar: FC<Props> = ({ className }) => {
|
|
const rootClassName = cn(s.root, className)
|
|
return (
|
|
<div className={rootClassName}>
|
|
<div className="flex-1 flex justify-between px-2">
|
|
<div className={s.container}>
|
|
<input className={s.input} placeholder="Search for products..." />
|
|
<div className={s.iconContainer}>
|
|
<svg className={s.icon} fill="currentColor" viewBox="0 0 20 20">
|
|
<path
|
|
fillRule="evenodd"
|
|
clipRule="evenodd"
|
|
d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Searchbar
|