Day8 김미진 29 post(color, image case) 페이지 구현 - Githubissues

RollingPaperTeam / rolling-papaer-web

Apache License 2.0

1 stars 1 forks source link

Day8 김미진 29 post(color, image case) 페이지 구현 #68

Closed mijin0928 closed 8 months ago

mijin0928 commented 8 months ago

이 PR은 어떤 유형인가요?

[ ] 리팩터링
[x] 기능
[ ] 버그 수정
[ ] 최적화
[ ] 문서 업데이트

설명

롤링페이퍼 만들기 페이지 구현

반응형 페이지

Recipient

받는 사람을 작성하는 input 구현
TextField 컴포넌트에서 InputContainer 가져와 사용
input 값 없을 시 '값을 입력해주세요.' 오류 메시지 출력

SelectBackground

컬러, 이미지 탭 구현
컬러 탭 클릭 시 Option 컴포넌트에서 만든 4가지 컬러박스를 가져와 보여주기
이미지 탭 클릭 시 이미지 목록 나오게 하기
이미지 목록 선택 시 이미지 투명하게 하기

생성하기 버튼

Button 컴포넌트 가져와 사용
받는 사람 input에 값을 서버에 POST 리퀘스트를 보내 추가
사용자가 선택한 컬러나 이미지를 서버에 POST 리퀘스트를 보내 추가
기본은 비활성화 상태로 받는 사람을 작성하는 input에 값이 있을 시 활성화

관련 티켓 및 문서

Related Issue #29
Closes #29

스크린샷, 녹화

recording (1)

스크린샷 2023-12-20 113852

UI 접근성 체크리스트

UI 변경 사항이 있는 경우, 이 체크리스트를 활용하세요:

[x] Semantic HTML 구현?
[ ] 키보드 조작이 지원?
[x] axe DevTools를 사용하여 Critical 및 Serious 문제를 확인하고 해결했나요?

[선택사항] 이 PR을 가장 잘 설명하는 GIF는 무엇인가요?

giphy 드디어 페이지 하나 완성!

seongseonko commented 8 months ago

좋습니다