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] 커뮤니티 목록 VIEW, 배너/ 커뮤니티 글 컴포넌트 #53

Merged
merged 24 commits into from
Jan 15, 2025

Conversation

gonn-i
Copy link
Member

@gonn-i gonn-i commented Jan 15, 2025

📑 이슈 번호


✨️ 작업 내용

커뮤니티 상단의 배너와 커뮤니티 글 카드 컴포넌트를 제작하고, storybook 을 통해서 UI 테스트를 진행했습니다.
커뮤니티 페이지 우측 하단의 플로팅 버튼을 제작하였고, 위쪽화살표 버튼의 경우 페이지 상단으로 자동 스크롤 되도록 구현했습니다.

원래는 게시글 카드부분이 중앙정렬이 아니라 오른쪽에 붙어있어야 하는데요,
추후 툴리스트 조회 Bar 가 머지되면 다음 이슈에서 추가하도록 하겠습니다 :)


💙 코멘트

  1. Banner 부분의 경우, 미리보기가 필요하지 않을 것 같아, 스토리북 내부의 Docs 파일을 만들지 않았습니다!
    (전체 스크린 전용인데 미리보기로 보면 중간에 짤려서 보이더라구요! )

📸 구현 결과

default.mp4

Copy link

🚀 Storybook 배포가 완료되었습니다! 🔗 https://6779addaee273bbd1faef48a-vyzqmeclsx.chromatic.com/

Copy link
Collaborator

@imddoy imddoy left a comment

Choose a reason for hiding this comment

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

그리드 고생의 흔적이 보이네용 ㅜㅜㅜ 어푸합니다

Comment on lines 36 to 37
position: absolute;
top: 4.5rem;
Copy link
Collaborator

Choose a reason for hiding this comment

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

p1: 이 부분은 없어도 좋을 것 같습니당

Copy link
Collaborator

Choose a reason for hiding this comment

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

취소취소 top이랑 bottom을 props로 넘겨주자요

Comment on lines 24 to 26
],
tags: ['autodocs'],
};
Copy link
Collaborator

Choose a reason for hiding this comment

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

p1: 지워줘영

Comment on lines 74 to 76
onClick={() => {
alert('클릭!');
}}
Copy link
Collaborator

Choose a reason for hiding this comment

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

p1: onClick 반영해주세용

Comment on lines +1 to +6
const formatContent = (content: string, ImgCount: number): string => {
const limit = ImgCount >= 1 ? 120 : 240;
return content.length > limit ? content.slice(0, limit) + '...' : content;
};

export default formatContent;
Copy link
Collaborator

Choose a reason for hiding this comment

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

p1: css로 바꾸는게 더 좋을 것 같아 보이네용

Copy link
Collaborator

@Minn-Choi Minn-Choi 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

🚀 Storybook 배포가 완료되었습니다! 🔗 https://6779addaee273bbd1faef48a-afacvfqove.chromatic.com/

Copy link

🚀 Storybook 배포가 완료되었습니다! 🔗 https://6779addaee273bbd1faef48a-vkxrtqsmol.chromatic.com/

@gonn-i gonn-i merged commit 1d072a6 into develop Jan 15, 2025
3 checks passed
@gonn-i gonn-i deleted the Feat/#38/ComunityList branch January 15, 2025 08:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Feat] 커뮤니티 목록 VIEW, 배너/ 커뮤니티 글 컴포넌트
3 participants