diff --git a/src/components/SearchBox/index.js b/src/components/SearchBox/index.js
index 6958029..236984c 100644
--- a/src/components/SearchBox/index.js
+++ b/src/components/SearchBox/index.js
@@ -3,15 +3,7 @@ import React, { useState } from "react";
import search from "./search-normal.svg";
import zarbedar from "./zarbedar-icon.svg";
-const SearchBox = ({
- cancleIcon,
- searchIcon,
- borderClr,
- backgroundColor,
- inputWidth,
- placeHolderColor,
- placeholder,
-}) => {
+const SearchBox = ({ cancleIcon, searchIcon, placeholder, className }) => {
const [activeSearchBox, setActiveSearchBox] = useState(false);
return (
@@ -35,12 +27,7 @@ const SearchBox = ({
// onBlur={() => setActiveSearchBox(false)}
type="text"
placeholder={placeholder}
- className={``}
- style={{
- backgroundColor: backgroundColor,
- borderColor: borderClr,
- width: inputWidth,
- }}
+ className={`${className} focus:outline-none border border-[#B5D6FF] focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20`}
/>
);
@@ -51,8 +38,9 @@ export default SearchBox;
SearchBox.defaultProps = {
cancleIcon: zarbedar,
searchIcon: search,
+
placeholder: "دنبال چه چیزی هستید",
className:
- "w-[15%] text-xs text-blue-400 bg-[#F9FBFF] rounded placeholder-blue-300 focus:outline-none border border-[#B5D6FF] focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20",
+ "w-[15%] text-xs text-blue-400 bg-[#F9FBFF] rounded placeholder-blue-300",
};