From 3dc5d05ebdb758d3f8bd6cfd4ef063dd942ec1ed Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EB=8F=99=EC=9C=A8?= <dy9623@naver.com>
Date: Mon, 11 Nov 2024 17:12:05 +0900
Subject: [PATCH] =?UTF-8?q?[FEAT][FE]=20#134=20:=20Footer=20=EA=B5=AC?=
 =?UTF-8?q?=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/component/Layout/Footer.tsx | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)
 create mode 100644 frontend/src/component/Layout/Footer.tsx

diff --git a/frontend/src/component/Layout/Footer.tsx b/frontend/src/component/Layout/Footer.tsx
new file mode 100644
index 00000000..3638083f
--- /dev/null
+++ b/frontend/src/component/Layout/Footer.tsx
@@ -0,0 +1,24 @@
+import React from 'react';
+
+interface IFooterProps {
+  title: string;
+  onClick?: () => void;
+  active?: boolean;
+}
+
+export const Footer: React.FC<IFooterProps> = ({ title, onClick, active }) => {
+  const shadow = active ? 'shadow-float' : 'shadow-basic';
+  const fontColor = active ? 'text-gray-900' : 'text-gray-100';
+
+  return (
+    <footer className="absolute bottom-5 w-[95%] h-[6%]">
+      <button
+        className={`w-full h-full bg-white text-black p-2 rounded-lg ${shadow} ${fontColor}`}
+        type="button"
+        onClick={onClick}
+      >
+        {title}
+      </button>
+    </footer>
+  );
+};