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

➕ [WV-16] feat : 콘텐츠 영역 레이아웃 컴포넌트 구현 #12

Merged
merged 3 commits into from
Dec 13, 2024

Conversation

Jinviz
Copy link
Member

@Jinviz Jinviz commented Dec 13, 2024

개요

페이지 콘텐츠 영역 레이아웃 컨포넌트 구현


PR Checklist

PR이 다음 요구 사항을 충족하는지 확인하세요.

  • PR 제목 및 커밋 메시지 컨벤션 확인
  • 직접 만든 함수가 있다면 이에 대한 설명 추가 (ex. JS DOCS)
  • 변경 사항에 대한 테스트 완료 (버그 수정/기능에 대한 테스트)
  • Label 확인
  • Assignees 설정 확인
  • Reviewers 설정 확인

PR details

contents-area.tsx 컴포넌트 (경로: "components/layout/contents-area.tsx")

image

width 1100px로 공식 홈페이지와 동일하게 스타일링되었습니다.

예시 (사용법)

아래와 같이 레이아웃 컴포넌트 안에 요소를 넣으면 영역 안에 배치됩니다.

image

image


When modifying code...

# Request Level
  - [ ] : "🔥 이대로 Merge 하면 안돼요~!"
  - [ ] : "🥹 고치면 분명 나아질 게 분명합니다.."
  - [ ] : "🤷 수정하면 좋지 않을까요?"

# Description

@Jinviz Jinviz added the feat 새로운 기능 추가 label Dec 13, 2024
@Jinviz Jinviz assigned Jinviz and unassigned Jinviz Dec 13, 2024
Copy link
Contributor

@naelumcat naelumcat 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

@hayoung78 hayoung78 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 97 to 100

<ContentsArea>
<div className="h-[1000px]">asdas</div>
</ContentsArea>
Copy link
Contributor

Choose a reason for hiding this comment

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

이거는 모든 페이지에서 다 해당하는 내용이므로 굳이 component로 뺄필요 없이 layout에 children 묶고있는 div에 넣으면 좋을것 같습니다

Comment on lines 3 to 11
const ContentsArea = ({ children }: { children: ReactNode }) => {
return (
<div className="w-full flex justify-center">
<div className="w-[1100px] h-auto pt-10 pb-[100px]">
{children}
</div>
</div>
)
}
Copy link
Contributor

Choose a reason for hiding this comment

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

그렇게 한다면 이 컴포넌트는 필요가 없어지겠죠?

Copy link
Member Author

Choose a reason for hiding this comment

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

컴포넌트 삭제 후 layout.tsx에 코드 구현했습니다.

game 주소로 들어가 배너와 콘텐츠 레이아웃 영역 테스트 완료했습니다.

image

Copy link
Member Author

Choose a reason for hiding this comment

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

/app/(menu)/layout.tsx

image

@Jinviz Jinviz merged commit e249e34 into dev Dec 13, 2024
1 check passed
@Jinviz Jinviz changed the title ➕ WV-16 feat : 콘텐츠 영역 레이아웃 컴포넌트 구현 ➕ [WV-16] feat : 콘텐츠 영역 레이아웃 컴포넌트 구현 Dec 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feat 새로운 기능 추가
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants