diff --git a/src/components/ui/modal/Modal.tsx b/src/components/ui/modal/Modal.tsx index 140afd2..f2e4e6d 100644 --- a/src/components/ui/modal/Modal.tsx +++ b/src/components/ui/modal/Modal.tsx @@ -9,6 +9,7 @@ import { useEffect } from "react"; import { useModal } from "@hooks/useModal"; import TurnWaiting from "../modalContents/TurnWaiting"; import GameWaiting from "../modalContents/GameWaiting"; +import SelectTurn from "../modalContents/SelectTurn"; const modalComponents: Record = { firstSelect: , @@ -18,6 +19,7 @@ const modalComponents: Record = { selectWhiteBlack: , turnWaiting: , gameWaiting: , + selectTurn: , }; export default function Modal() { diff --git a/src/components/ui/modal/SelectDeckModal.tsx b/src/components/ui/modal/SelectDeckModal.tsx deleted file mode 100644 index 0d08fda..0000000 --- a/src/components/ui/modal/SelectDeckModal.tsx +++ /dev/null @@ -1,3 +0,0 @@ -export default function SelectDeckModal() { - return
SelectDeckModal
; -} diff --git a/src/components/ui/modalContents/SelectTurn.tsx b/src/components/ui/modalContents/SelectTurn.tsx new file mode 100644 index 0000000..eebcb6c --- /dev/null +++ b/src/components/ui/modalContents/SelectTurn.tsx @@ -0,0 +1,19 @@ +import Button from "../button/Button"; +import * as S from "./selectTurnStyle"; + +export default function SelectTurn() { + //버튼에 onClick이벤트 만들면 됩니다. + return ( + + 턴 종료 No, 계속 맞출거면 Yes + + + + + + ); +} diff --git a/src/components/ui/modalContents/selectTurnStyle.ts b/src/components/ui/modalContents/selectTurnStyle.ts new file mode 100644 index 0000000..b439dbc --- /dev/null +++ b/src/components/ui/modalContents/selectTurnStyle.ts @@ -0,0 +1,22 @@ +import styled from "styled-components"; + +export const container = styled.div` + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + gap: 40px; +`; + +export const title = styled.div` + font-weight: 500; + font-size: 24px; + color: var(--color-gray-999); + text-align: center; +`; + +export const buttonContainer = styled.div` + display: flex; + width: 100%; + gap: 40px; +`; diff --git a/src/pages/testpage/Testpage.tsx b/src/pages/testpage/Testpage.tsx index 17d1fed..837dcaf 100644 --- a/src/pages/testpage/Testpage.tsx +++ b/src/pages/testpage/Testpage.tsx @@ -3,7 +3,7 @@ import { useModal } from "../../hooks/useModal"; export default function TestPage() { const { openModal } = useModal(); const onClickModal = () => { - openModal("guessNumber", "blue"); + openModal("selectTurn", "blue"); }; return (
ㅁㄴㅇㄹㅁㄴㅇㄹㅁㄴㅇㄹㅁㄴㅇㄹㅁㄴㅇㄹ