From 659b77332d67f73b971c91dfefbf395d5a87f202 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EB=B0=95=EB=AF=BC=EC=9A=B0?= <alsd20177@gmail.com>
Date: Thu, 28 Mar 2024 17:56:55 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20:=20#492=20-=20FootPrintFilter?=
 =?UTF-8?q?=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EA=B2=80=EC=83=89=20?=
 =?UTF-8?q?=EB=B2=84=ED=8A=BC=20CSS=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../_Components/FootPrintFilter/FootPrintFilter.tsx   |  8 +++++---
 .../footprints/_Components/FootPrintFilter/index.scss | 11 ++++++++++-
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/app/footprints/_Components/FootPrintFilter/FootPrintFilter.tsx b/src/app/footprints/_Components/FootPrintFilter/FootPrintFilter.tsx
index 70cee616..16588bbf 100644
--- a/src/app/footprints/_Components/FootPrintFilter/FootPrintFilter.tsx
+++ b/src/app/footprints/_Components/FootPrintFilter/FootPrintFilter.tsx
@@ -1,4 +1,4 @@
-import { Dropdown } from '@/components';
+import { Dropdown, Icon } from '@/components';
 import { useGetMyPlansForFootprintQuery } from '@/hooks/apis';
 import classNames from 'classnames';
 import React, { useEffect, useMemo, useState } from 'react';
@@ -76,9 +76,11 @@ export default function FootPrintFilter({
         classNameList={['footprint-filter__dropdown--filter']}
       />
 
-      <div
+      <button
         className={classNames('footprint-filter__search-btn')}
-        onClick={handleClickSearchBtn}>{`검색`}</div>
+        onClick={handleClickSearchBtn}>
+        <Icon name={'SEARCH'} color={'white-100'} size="lg" />
+      </button>
     </div>
   );
 }
diff --git a/src/app/footprints/_Components/FootPrintFilter/index.scss b/src/app/footprints/_Components/FootPrintFilter/index.scss
index c8f42302..e1d8d3b6 100644
--- a/src/app/footprints/_Components/FootPrintFilter/index.scss
+++ b/src/app/footprints/_Components/FootPrintFilter/index.scss
@@ -1,8 +1,17 @@
 .footprint-filter {
   display: flex;
-  justify-content: space-between;
+  gap: 0.75rem;
   align-items: center;
 
   &__search-btn {
+    &:hover {
+      cursor: pointer;
+    }
+    display: flex;
+    justify-content: center;
+    padding: 0.25rem;
+    align-items: center;
+    border-radius: 10px;
+    background-color: var(--origin-primary);
   }
 }