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(member): 관리페이지 Aside TOC Panel 추가 #248

Merged
merged 8 commits into from
Sep 25, 2024
Merged

Conversation

SWARVY
Copy link
Contributor

@SWARVY SWARVY commented Sep 25, 2024

Summary

#230

  • 관리 페이지에 숏컷 패널을 생성했습니다.

Tasks

  • 전역적으로 scroll padding을 적용했습니다. 이는 현재 바로가기로 이동 시 nav의 세로 크기 만큼 영역이 가려지기 때문입니다.
  • 전역적으로 scroll-behaviorsmooth로 적용했습니다.
  • Section.Headerh2 컴포넌트에 id 값을 부여했습니다. (바로가기 이동을 위함)
  • 바로가기 패널을 구현했습니다. 이는 /manage 경로에서만 표시됩니다.

ETC

  • 숏컷 패널은 Section.Headerh2를 감지하고 이를 반영합니다. 따라서 관리페이지에서 TOC에 항목을 추가하고싶으시다면 Section.Header를 사용하시면 됩니다.

Screenshot

image

@SWARVY SWARVY added the ✨ Feature 새로운 기능 명세 및 개발 label Sep 25, 2024
@SWARVY SWARVY self-assigned this Sep 25, 2024
Copy link

changeset-bot bot commented Sep 25, 2024

🦋 Changeset detected

Latest commit: 6541697

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@clab-platforms/member Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@SWARVY SWARVY added the 🏠 Member member 프로젝트 관련 label Sep 25, 2024
@@ -29,7 +29,9 @@ const Header = ({ children, title, description }: SectionHeaderProps) => {
return (
<div className="flex items-center justify-between">
<div>
<h2 className="text-xl font-bold text-black">{title}</h2>
<h2 id={encodeURI(title)} className="text-xl font-bold text-black">
Copy link
Member

Choose a reason for hiding this comment

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

섹션의 ID가 겹칠 수 있는 유스 케이스가 있다고 생각해요, 동일한 ID가 있을 경우 어떻게 되나요?

Copy link
Contributor Author

@SWARVY SWARVY Sep 25, 2024

Choose a reason for hiding this comment

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

해당 ID를 조금 더 구체화 하는 방법을 사용하겠습니다. useId 훅을 사용하면 될 것 같네요


return (
<>
{location.pathname === '/manage' && (
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
{location.pathname === '/manage' && (
{location.pathname === PATH.MANAGE && (

Copy link
Contributor

@Jeong-Ag Jeong-Ag left a comment

Choose a reason for hiding this comment

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

수고하셨어요!! :)

@SWARVY SWARVY merged commit b29736d into main Sep 25, 2024
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
✨ Feature 새로운 기능 명세 및 개발 🏠 Member member 프로젝트 관련
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants