diff --git a/src/component/Select.jsx b/src/component/Select.jsx new file mode 100644 index 0000000..19291e3 --- /dev/null +++ b/src/component/Select.jsx @@ -0,0 +1,27 @@ +//Select.jsx + +import PropTypes from "prop-types"; +import "./styles/Select.scss"; + +const Select = ({ options, onChange, placeholder }) => { + return ( + + ); +}; + +Select.propTypes = { + options: PropTypes.arrayOf(PropTypes.string).isRequired, + onChange: PropTypes.func.isRequired, + placeholder: PropTypes.string.isRequired, +}; + +export default Select; diff --git a/src/component/styles/Select.scss b/src/component/styles/Select.scss new file mode 100644 index 0000000..8c7e632 --- /dev/null +++ b/src/component/styles/Select.scss @@ -0,0 +1,16 @@ +.custom-select { + width: 430px; + padding: 10px; + margin-bottom: 10px; + border: 1px solid #ccc; + border-radius: 4px; + background-color: white; + font-size: 16px; + color: #3d3d3d; + font-family: "Goorm Sans", sans-serif; + + @media (max-width: 767px) { + width: 200px; + font-size: 10px; + } +} diff --git a/src/containers/SignupForm.jsx b/src/containers/SignupForm.jsx index f72893b..18c5eae 100644 --- a/src/containers/SignupForm.jsx +++ b/src/containers/SignupForm.jsx @@ -2,7 +2,7 @@ import { useNavigate } from "react-router-dom"; import Sidebar from "./SideForm"; import Button from "../component/Button"; import Input from "../component/Input"; -import MemberCard from "../component/MemberCard"; +import Select from "../component/Select"; import ProfileUpload from "../component/ProfileUpload"; import "./styles/SignupForm.scss"; @@ -17,6 +17,11 @@ const SignupForm = () => { navigate("/kakaosignup"); }; + const handleFieldChange = (e) => { + console.log("Selected field:", e.target.value); + // 여기에 선택된 필드를 처리하는 로직을 추가할 수 있습니다. + }; + return (
+ 아이디로 로그인 +