feat: SearchBar 디자인 추가 #106

Kernel360 · Jan 21, 2024 · 6c81b32 · 6c81b32
1 parent 50536a3
commit 6c81b32
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/components/shared/search-bar/SearchBar.module.scss b/src/components/shared/search-bar/SearchBar.module.scss
@@ -8,6 +8,10 @@
     gap: 11.5px;
     background-color: var(--tertiary-200);
 
+    &.white {
+        background-color: var(--white);
+    }
+
     input {
         flex-grow: 1;
         height: 100%;

diff --git a/src/components/shared/search-bar/SearchBar.tsx b/src/components/shared/search-bar/SearchBar.tsx
@@ -12,7 +12,7 @@ import styles from './SearchBar.module.scss';
 
 const cx = classNames.bind(styles);
 
-function SearchBar() {
+function SearchBar({ isWhite = false }:{ isWhite?:boolean }) {
   const [keyword, setKeyword] = useState<string>('');
 
   const handleSearch = () => {
@@ -22,7 +22,7 @@ function SearchBar() {
 
   return (
     <form
-      className={cx('container')}
+      className={cx('container', { white: isWhite })}
       onSubmit={(e) => {
         e.preventDefault();
         handleSearch();