[FIX] header z-index값 수정

[ujinsim]

🔥 연관 이슈

• close [FIX] 레이아웃 겹침 문제 수정  #115

🚀 작업 내용

header z-index값 수정했습니다

🤔 고민했던 내용

💬 리뷰 중점사항

Summary by CodeRabbit

스타일

• 헤더의 레이어링 순서를 조정하여 요소 겹침 처리를 개선했습니다.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

헤더 컴포넌트의 z-index 값을 10에서 20으로 증가시켰습니다. 이는 UI 요소 간 레이어링 순서를 조정하여 레이아웃 겹침 문제를 해결하기 위한 변경으로, 컴포넌트 서명이나 외부 API에는 영향을 주지 않습니다.

Changes

Cohort / File(s)	Summary
헤더 z-index 조정 src/shared/ui/Header/Header.tsx	헤더 루트 클래스의 z-index를 10에서 20으로 증가시켜 UI 레이어링 순서 조정

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Possibly related PRs

• [FIX] 레이아웃 겹침 문제 수정  #115: 헤더 컴포넌트의 z-index 값 조정으로 레이아웃 겹침 문제를 해결하는 관련 PR

Suggested labels

fix

Suggested reviewers

• yougyung
• keemsebin

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	PR 제목이 변경사항의 핵심을 명확하게 설명하고 있으며, header z-index 수정이라는 주요 변경내용을 정확히 반영합니다.
Description check	✅ Passed	PR 설명이 기본 구조를 따르고 있으나, 고민했던 내용과 리뷰 중점사항 섹션이 비어있어 완성도가 낮습니다.
Linked Issues check	✅ Passed	연관 이슈 #115의 목표인 레이아웃 겹침 문제를 해결하기 위해 z-index를 조정하는 코드 변경이 일치합니다.
Out of Scope Changes check	✅ Passed	Header 컴포넌트의 z-index 값 수정만 포함되어 있으며, 연관 이슈의 범위 내에서 벗어난 변경사항이 없습니다.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/#112

---

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between eeb4419 and 1182eac.

📒 Files selected for processing (1)

• src/shared/ui/Header/Header.tsx (1 hunks)

🔇 Additional comments (1)

src/shared/ui/Header/Header.tsx (1)

16-16: z-index 계층 구조 확인 완료

프로젝트 내 z-index 값을 검증한 결과, Header의 z-20 변경은 다음과 같이 적절하게 배치되어 있습니다:

• 저단계 (z-10): Carousel, ImageGallery 버튼
• 중단계 (z-20): Header (본 PR의 변경값)
• 고단계 (z-50): Modal, Drawer, Select

Header가 z-20으로 설정되어 있어 Modal/Drawer(z-50)보다는 뒤에, Carousel 등의 컨텐츠 요소(z-10)보다는 앞에 위치하므로 레이아웃 겹침 문제 해결에 적절합니다. z-index 계층 간 충돌이나 문제는 발견되지 않았습니다.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

Update: 2025년 11월 22일 19시 11분 55초
Storybook 미리보기: https://677a9a76c58a295e9421d3ef-cczvszyhpn.chromatic.com/