feat: policy button 구현

Author: Rose4tune

src/components/Policy/PolicyButton.tsx

@@ -0,0 +1,19 @@
+import { usePolicyState } from '../../stores/policyStore';
+
+const PolicyButton = () => {
+  const { check } = usePolicyState();
+
+  const onClick = () => {
+    console.log(check);
+  };
+
+  return (
+    <div className="absolute bottom-12 w-full max-w-5xl">
+      <button type={'submit'} onClick={onClick} className="btn btn-outline btn-primary display m-auto">
+        동의하기
+      </button>
+    </div>
+  );
+};
+
+export default PolicyButton;

src/layouts/PolicyPageLayout.tsx

@@ -1,4 +1,5 @@
 import { FC, ReactNode } from 'react';
+import PolicyButton from '../components/Policy/PolicyButton';
 import HistoryBackButton from '../components/common/HistoryBackButton';
 
 interface Props {
@@ -8,11 +9,12 @@ interface Props {
 
 const PolicyPageLayout: FC<Props> = ({ children, title }) => {
   return (
-    <main className={'m-auto h-screen w-fit p-8'}>
+    <main className={'relative m-auto h-screen w-fit p-8'}>
       <HistoryBackButton />
       <h2 className="my-5 text-xl font-semibold">{title}</h2>
-
-      <div className="card h-5/6 max-w-5xl bg-white">{children}</div>
+      {/* <div className="card h-5/6 max-w-5xl bg-white">{children}</div> */}
+      <div className="card h-3/4 max-w-5xl bg-white">{children}</div>
+      <PolicyButton />
     </main>
   );
 };

src/stores/policyStore.ts

@@ -0,0 +1,13 @@
+import { create } from 'zustand';
+
+interface PolicyState {
+  check: string;
+
+  checkHandler: (check: string) => void;
+}
+
+export const usePolicyState = create<PolicyState>()((set) => ({
+  check: '확인',
+
+  checkHandler: (check: string) => set((state) => ({ ...state, check })),
+}));