[Feature] 나의 스터디 페이지 UI 구축 #35
Conversation
|
캐러셀 부분을 오른쪽으로 이동시키면 다시 왼쪽으로 이동시킬 수 있는 버튼이 뜨지 않는 것 같아요!! |
피그마 상에서 왼쪽 버튼이 없어서 일단은 그대로 구현해놨어요! |
| const handleScroll = (distance: number) => { | ||
| if (!containerRef.current) { | ||
| return; | ||
| } | ||
|
|
||
| containerRef.current.scrollBy({ | ||
| left: distance, | ||
| behavior: "smooth", | ||
| }); | ||
| }; | ||
|
|
There was a problem hiding this comment.
P3;
왼쪽, 오른쪽으로 handleScroll을 다른 핸들러 함수로 구현하면 더 좋을 것 같아요!
containerRef의 scrollBy객체에 distance 길이만큼 마이너스 값을 주면 될 것 같습니당.
그리고 스크롤의 시작점 이외에는 왼쪽 캐러셀 버튼이 활성화되도록 해도 좋을 것 같아요!
apps/client/app/(afterLogin)/my-study/_components/StudyCurriculum.tsx
Outdated
Show resolved
Hide resolved
apps/client/app/(afterLogin)/my-study/_components/StudyCurriculum.tsx
Outdated
Show resolved
Hide resolved
앗 가로 스크롤이 가능하군여ㅎㅎ... 스크롤 안해봐서 확인을 못했던 것 같아요! 🥹 피그마 UI에 오른쪽 화살표만 만들어 두셨다면 현재 개발하신대로 가는게 맞을거같아요!! |
스터디 페이지는 assignment로 반영해뒀습니다! |
🎉 변경 사항
나의 스터디 페이지 UI 부분 완성했습니다.
아직 api 연결 전이라 지금 올라온 api 기반으로 임시 목데이터 작성해뒀습니다. (올라오지 않은 api는 제가 임시로 만들어놨습니다.)
현재 next/image Image 컴포넌트로 모든 svg 파일들 넣어놨는데, 개발 완료한 후 한 번에 반영할 예정입니다..
🚩 관련 이슈
🙏 여기는 꼭 봐주세요!