diff --git a/src/asset/css/SearchBar.css b/src/asset/css/SearchBar.css
index 400c4d79..66a404a3 100644
--- a/src/asset/css/SearchBar.css
+++ b/src/asset/css/SearchBar.css
@@ -56,21 +56,13 @@
.search-bar__button {
all: unset;
margin-left: auto;
- background-image: url("../img/search_icon_black.svg");
- background-repeat: no-repeat;
- background-size: cover;
width: 2.8rem;
height: 2.8rem;
margin: auto;
- color: transparent;
-}
-
-.search-bar__button.submit {
- background-image: url("../img/search_icon_black.svg");
+ cursor: pointer;
}
.search-bar__button.barcode {
- background-image: url("../img/barcode.svg");
margin-right: 2rem;
}
@@ -100,9 +92,11 @@
.search-bar__wrapper.center {
padding: 0 2rem 0 2rem;
}
+
.search-bar__wrapper.long {
padding: 0 2.5rem 0 2.2rem;
}
+
.search-bar__wrapper.short {
margin-right: 1.8rem;
padding: 0 2.5rem 0 2.2rem;
diff --git a/src/component/utils/SearchBar.tsx b/src/component/utils/SearchBar.tsx
index 8ce8ae71..40098031 100644
--- a/src/component/utils/SearchBar.tsx
+++ b/src/component/utils/SearchBar.tsx
@@ -1,13 +1,15 @@
import {
- useRef,
- useState,
- useEffect,
ChangeEventHandler,
FormEventHandler,
MouseEventHandler,
+ useEffect,
+ useRef,
+ useState,
} from "react";
import { useNavigate, useSearchParams } from "react-router-dom";
import "../../asset/css/SearchBar.css";
+import BarCodeIcon from "../../asset/img/barcode.svg";
+import SearchIcon from "../../asset/img/search_icon_black.svg";
type Props = {
setQuery?: (query: string) => void;
@@ -75,12 +77,13 @@ const SearchBar = ({
type="button"
className="search-bar__button barcode"
onClick={onClickBarcodeButton}
+ aria-label="바코드"
>
- 바코드
+
) : null}
-