Repository navigation
사이트와 스킬 직접 메뉴 및 반응형 헤더 배치 - #12
Merged
Merged
Conversation
There was a problem hiding this comment.
🟡 Changes recommended
Short-screen layouts lose hero captions and obscure step text and buttons, while mismatched anchor offsets cause incorrect active-section highlighting.
3 open issues
What changed in this PR
Replaces the header’s Explore dropdown with direct Sites and Skills links in Korean and English, and adjusts page spacing for the responsive header.
Changes:
- Displays all six navigation links across mobile, tablet, and desktop layouts.
- Adds shared header-height variables for sticky content and anchor offsets.
- Adjusts hero content and cloth hints for short screens, and updates the navigation documentation.
| File | Description |
|---|---|
src/styles/app.css |
Adds responsive header-height variables and anchor padding. |
src/content/site.ts |
Adds Korean and English Sites and Skills labels. |
src/components/shell/Chrome.tsx |
Replaces the dropdown with direct navigation links. |
src/components/shell/Chrome.module.css |
Introduces responsive six-link header layouts. |
src/components/home/HowItWorks.module.css |
Aligns sticky diagram offsets with header height. |
src/components/home/Hero.module.css |
Adjusts hero positioning and short-screen scrolling. |
src/components/docs/Docs.module.css |
Updates sidebar and heading anchor offsets. |
src/components/cloth/ClothStage.module.css |
Repositions mobile hints and hides them on short screens. |
README.md |
Documents direct header links and mobile navigation. |
Review effort: Balanced
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
상단의 탐색 드롭다운을 없애고 사이트와 스킬을 기존 메뉴와 같은 수준의 직접 링크로 표시합니다. 한국어와 영어 메뉴를 함께 반영했습니다.
모바일에서는 여섯 메뉴를 두 줄로 표시하며 태블릿과 데스크톱에서는 너비에 맞게 배치합니다. 헤더 높이에 맞춰 본문과 문서 앵커의 간격을 조정했습니다. 높이가 작은 화면에서는 안내 배너와 버튼이 헤더나 식탁보 안내 버튼과 겹치지 않도록 간격을 줄이고, 필요한 경우 본문을 자연스럽게 스크롤합니다.
검증: TypeScript 검사 및 11개 페이지 정적 빌드 통과, 320/390/768/1024/1280px 메뉴 노출 및 가로 넘침 없음 확인, 320x568과 768x480의 안내 배너 위치, 한국어와 영어 및 라이트/다크 모드, 문서와 본문 앵커 이동 확인.