diff --git a/src/pages/onboarding/components/TitleBox.tsx b/src/pages/onboarding/components/TitleBox.tsx new file mode 100644 index 00000000..1cd6254e --- /dev/null +++ b/src/pages/onboarding/components/TitleBox.tsx @@ -0,0 +1,32 @@ +import styled from '@emotion/styled'; + +interface TitleBoxProps { + title: string; + description: string; +} + +const TitleBox = ({ title, description }: TitleBoxProps) => { + return ( + + {title} + {description} + + ); +}; + +export default TitleBox; + +const Wrapper = styled.div` + display: flex; + flex-direction: column; + gap: 0.5rem; +`; + +const Heading1 = styled.h1` + ${({ theme }) => theme.fonts.Head1_B_20}; +`; + +const Description = styled.p` + ${({ theme }) => theme.fonts.Body1_M_14}; + color: ${({ theme }) => theme.colors.grayScaleMG2}; +`; diff --git a/src/pages/onboarding/constants.ts b/src/pages/onboarding/constants.ts new file mode 100644 index 00000000..8d0db6e9 --- /dev/null +++ b/src/pages/onboarding/constants.ts @@ -0,0 +1,77 @@ +export const SENIOR_ONBOARDING_STEPS = [ + { + title: '아래 약관을 확인해 주세요', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '선약을 시작해 볼까요?', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '학교를 선택해주세요', + description: '졸업하신 학교를 입력해주세요', + }, + { + title: '전공 계열을 알려주세요', + description: '자신의 주 전공과 맞는 계열을 골라주세요.', + }, + { + title: '학과를 선택해주세요', + description: '주전공과 부전공을 선택해주세요 ! ( 최대 3개 )', + }, + { + title: '졸업 사실을 인증해주세요', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '재직 사실을 인증해주세요', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '회사 재직 기간을 알려 주세요', + description: '선배님의 직무와 연차를 선택해주세요', + }, + { + title: '직무를 알려 주세요', + description: '선배님의 직무와 연차를 선택해주세요', + }, + { + title: '직무를 알려 주세요', + description: '선배님의 직무와 연차를 선택해주세요', + }, + { + title: '휴대전화 번호를 입력해 주세요', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, +]; + +export const JUNIOR_ONBOARDING_STEPS = [ + { + title: '아래 약관을 확인해 주세요', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '선약을 시작해 볼까요?', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '휴대전화 번호를 입력해 주세요', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '학교를 선택해주세요', + description: '재학중이신 학교를 입력해주세요', + }, + { + title: '학교 메일을 입력해 주세요', + description: '개인정보는 안전하게 보관되어 누구에게도 공개되지 않아요.', + }, + { + title: '전공 계열을 알려주세요', + description: '자신의 주 전공과 맞는 계열을 골라주세요.', + }, + { + title: '학과를 선택해주세요', + description: '주전공과 부전공을 선택해주세요 ! ( 최대 3개 )', + }, +]; diff --git a/src/pages/onboarding/seniorOnboarding/SeniorOnboardingPage.tsx b/src/pages/onboarding/seniorOnboarding/SeniorOnboardingPage.tsx index ba047aee..cd7f0795 100644 --- a/src/pages/onboarding/seniorOnboarding/SeniorOnboardingPage.tsx +++ b/src/pages/onboarding/seniorOnboarding/SeniorOnboardingPage.tsx @@ -1,8 +1,11 @@ +import TitleBox from '../components/TitleBox'; +import { SENIOR_ONBOARDING_STEPS } from '../constants'; import { Caption, InnerButton, InputBox, TextBox } from '../components/TextBox'; const SeniorOnboardingPage = () => { return (
+