문서 포맷 참고:
2. 디테일 페이지 이미지 + 컴포넌트 구조
이미지는 위 아래 추가 공간 없이 딱 맞춰 잘려야합니다.
•
[컴포넌트] 디테일 페이지 헤더와 상세를 나누는 섹션 디바이더
•
[컴포넌트] 다회차일 경우 표시되는 배너
◦
sessionInformation?.length > 1 일 경우에 생긴다
•
[배너 이미지] 얼리버드 혜택이 있는 경우 표시되는 이미지
◦
bannerImage, type: promotion-earlybird
•
[배너 이미지] 클래스 콜라보 광고 있는 경우 표시되는 이미지
◦
bannerImage, type: collaboration
•
[배너 이미지] 사진/영상 촬영물 제공 클래스 안내 이미지
◦
bannerImage, type: subtag-photo
•
[디테일 이미지 1] 참여 후기 이미지
◦
디테일 페이지 첫번째 이미지
◦
“실제 참여 후기” 제목 ~ 섹션 디바이더 까지 포함
◦
detailImage[0]
•
[컴포넌트] 코치 sns 컴포넌트
◦
trainerImage, trainerName, trainerSns 사용
•
[유튜브 컴포넌트 1]
◦
유튜브 링크의 경우, url 끝에 비디오 아이디만 들어가야함
•
[디테일 이미지 2] 트레이너 소개 영상 아래 붙을 이미지
◦
디테일 페이지 두번째 이미지
◦
트레이너 이력 불렛포인트 ~ “이런걸 배워봅시다” 제목까지 포함
◦
detailImage[1]
•
[유튜브 컴포넌트 2]
◦
유튜브 링크의 경우, url 끝에 비디오 아이디만 들어가야함
•
[디테일 이미지 3] 트레이너 소개 영상 아래 붙을 이미지
◦
디테일 페이지 세번째 이미지
◦
클래스 소개 유튜브 이후 설명 텍스트 ~ 커리큘럼 이전 설명 텍스트 까지 포함
◦
detailImage[2]
•
[커리큘럼 이미지 1] 클래스 소개 이후 붙을 이미지
◦
sessionInformation[0]?.curriculumImage
▪
해당 이미지는 디테일 이미지가 아니라 sessionInformation 배열에 추가된다
•
[클래스 운동 컴포넌트 1] 클래스 운동이 있을 경우 생기는 컴포넌트
◦
sessionInformation[0]?.exercise 배열에 운동 정보가 들어간다
◦
운동 정보에 세트 수, 무게, 시간 등은 포함되지 않는다
•
[커리큘럼 이미지 2] 2회차일 경우, 1회차 클래스 운동 아래 붙을 이미지
◦
1회차 클래스 운동 없을 경우, 1회차 커리큘럼 이미지 아래 붙는다
◦
sessionInformation[1]?.curriculumImage
▪
해당 이미지는 디테일 이미지가 아니라 sessionInformation 배열에 추가된다
•
[클래스 운동 컴포넌트 2] 2회차 클래스 운동이 있을 경우 생기는 컴포넌트
◦
sessionInformation[1]?.exercise 배열에 운동 정보가 들어간다
◦
운동 정보에 세트 수, 무게, 시간 등은 포함되지 않는다
•
[디테일 이미지 4] 커리큘럼 이미지 아래 붙을 이미지
◦
디테일 페이지 네번째 이미지
◦
참석 전 미리 준비해주세요! ~ 공간 소개 이미지 까지 포함
◦
detailImage[3]
•
[컴포넌트] 공간 소개 이미지 아래 붙을 네이버 지도로 이동하는 컴포넌트
•
[컴포넌트] 상세 위치 컴포넌트 아래 붙는 주의사항 및 환불 규정 안내 컴포넌트
◦
해당 이미지엔 포함되어있지만 않지만 주의사항 및 환불 규정 안내 컴포넌트 카카오톡 cs 채널 이동 컴포넌트가 있다.