Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat: add list slide #40

Merged
merged 4 commits into from
Jan 7, 2024
Merged

Feat: add list slide #40

merged 4 commits into from
Jan 7, 2024

Conversation

Yamyam-code
Copy link
Member

개요

홈페이지의 목록들을 넘길 수 있는 슬라이드 기능 구현
close #33

스크린샷

슬라이드 적용

주요 내용

  • 슬라이드 기능 구현
  • 진행 중인 투표가 없을 때 나오는 카드 반응형 패딩 적용
  • 각 페이지 url 연결

고민한 점, 질문거리

슬라이드 사용하실 분들이 계실까 싶어서 사용 방법 공유합니다.

이미지1의_대체_텍스트 이미지2의_대체_텍스트

슬라이드 시킬 리스트를 div로 감싸주고(스크린샷 기준 slide_box)
그 밖을 한번 더 div로 감싸줍니다(스크린샷 기준 container)
container에 SlideButton 컴포넌트를 data&& 처리하여 불러와주시고
정민님이 만들어주신 useComponentSize()훅을 사용하여 slide_box에 ref를 지정하여 사용해주시면 됩니다!
아 slide_box의 인라인 스타일도 반드시 추가해주세요!!!

스타일의 경우 스크린샷을 참고해주시고 gap만 바꿔서 사용하시면 됩니다!!

ps.components/Home/RecommendedItemList에 방문하시면 예시 코드를 보실 수 있습니다 ㅎㅎ

@Yamyam-code Yamyam-code added this to the TripVote FE development milestone Jan 7, 2024
@Yamyam-code Yamyam-code self-assigned this Jan 7, 2024
@Yamyam-code Yamyam-code linked an issue Jan 7, 2024 that may be closed by this pull request
3 tasks
Copy link

vercel bot commented Jan 7, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
trip-vote ✅ Ready (Inspect) Visit Preview Jan 7, 2024 10:42am

Copy link
Contributor

@HOOOO98 HOOOO98 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

자세한 설명 감사합니다ㅎㅎ

Copy link
Contributor

@SKY-PEY SKY-PEY left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

헉 저도 슬라이드 만들려고 했었는데ㅎㅎㅎ 자세한 설명 감사합니다!👍👍👍

Copy link
Contributor

@JeongMin83 JeongMin83 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

당장 사용하겠습니다 ㅎㅎ

@Yamyam-code Yamyam-code merged commit eb5326c into dev Jan 7, 2024
3 checks passed
@Yamyam-code Yamyam-code deleted the 33-feat-add-list-slide branch January 7, 2024 15:17
HOOOO98 pushed a commit that referenced this pull request Jan 9, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Feat: add list slide
4 participants