From eb293446f73137657dad0b8308d7156abc04a3f4 Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Thu, 25 Jun 2026 14:34:31 +0000 Subject: [PATCH 1/4] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20[UX=20=EA=B0=9C?= =?UTF-8?q?=EC=84=A0]=20=EA=B3=A0=EC=A0=95=20=ED=97=A4=EB=8D=94=20?= =?UTF-8?q?=EC=95=B5=EC=BB=A4=20=EA=B0=80=EB=A6=BC=20=ED=98=84=EC=83=81=20?= =?UTF-8?q?=ED=95=B4=EA=B2=B0=EC=9D=84=20=EC=9C=84=ED=95=9C=20=EC=8A=A4?= =?UTF-8?q?=ED=81=AC=EB=A1=A4=20=ED=8C=A8=EB=94=A9=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 이 커밋은 `styles.css`의 `html` 요소에 `scroll-padding-top: 81px`를 추가하여 사이트 탐색 중 앵커 링크 클릭 시 헤더 영역이 콘텐츠를 가리는 현상을 방지합니다. - `html` 요소에 `scroll-padding-top` 추가 - `.Jules/palette.md` 학습 노트 업데이트 --- .Jules/palette.md | 3 +++ .gitignore | 1 + styles.css | 1 + 3 files changed, 5 insertions(+) diff --git a/.Jules/palette.md b/.Jules/palette.md index 3723067..a56a40c 100644 --- a/.Jules/palette.md +++ b/.Jules/palette.md @@ -5,3 +5,6 @@ ## 2024-06-21 - Added skip-to-content link **Learning:** Found a missing skip-to-content link, which is a key accessibility feature to help keyboard and screen reader users bypass navigation. Additionally learned that giving `
` `tabindex="-1"` and removing its outline when `:focus-visible` ensures proper focus handling after clicking the skip link without disruptive visual outlines. **Action:** Always include a skip-to-content link near the start of the `body` and manage target focus appropriately. +## 2026-06-25 - [Fix Header Overlap] +**Learning:** [When using a sticky header, clicking anchor links can cause the target element to scroll under the header, hindering the user experience.] +**Action:** [Use `scroll-padding-top` on the `html` element with the height of the sticky header to ensure anchor links scroll to a position just below the header.] diff --git a/.gitignore b/.gitignore index 3c3629e..fafe757 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ node_modules +venv/ diff --git a/styles.css b/styles.css index dfc509c..aada0d5 100644 --- a/styles.css +++ b/styles.css @@ -23,6 +23,7 @@ html { scroll-behavior: smooth; + scroll-padding-top: 81px; } body { From 8619425252d8642eb04f088f6d3fbdd58bc9b963 Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Thu, 25 Jun 2026 14:56:41 +0000 Subject: [PATCH 2/4] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20[UX=20=EA=B0=9C?= =?UTF-8?q?=EC=84=A0]=20=EA=B3=A0=EC=A0=95=20=ED=97=A4=EB=8D=94=20?= =?UTF-8?q?=EC=95=B5=EC=BB=A4=20=EA=B0=80=EB=A6=BC=20=ED=98=84=EC=83=81=20?= =?UTF-8?q?=ED=95=B4=EA=B2=B0=EC=9D=84=20=EC=9C=84=ED=95=9C=20=EC=8A=A4?= =?UTF-8?q?=ED=81=AC=EB=A1=A4=20=ED=8C=A8=EB=94=A9=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 이 커밋은 `styles.css`의 `html` 요소에 `scroll-padding-top: 81px`를 추가하여 사이트 탐색 중 앵커 링크 클릭 시 헤더 영역이 콘텐츠를 가리는 현상을 방지합니다. - `html` 요소에 `scroll-padding-top` 추가 - `.Jules/palette.md` 학습 노트 업데이트 - Playwright venv용 `.gitignore` 업데이트 --- .Jules/palette.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/.Jules/palette.md b/.Jules/palette.md index a56a40c..998e0de 100644 --- a/.Jules/palette.md +++ b/.Jules/palette.md @@ -5,6 +5,6 @@ ## 2024-06-21 - Added skip-to-content link **Learning:** Found a missing skip-to-content link, which is a key accessibility feature to help keyboard and screen reader users bypass navigation. Additionally learned that giving `
` `tabindex="-1"` and removing its outline when `:focus-visible` ensures proper focus handling after clicking the skip link without disruptive visual outlines. **Action:** Always include a skip-to-content link near the start of the `body` and manage target focus appropriately. -## 2026-06-25 - [Fix Header Overlap] -**Learning:** [When using a sticky header, clicking anchor links can cause the target element to scroll under the header, hindering the user experience.] -**Action:** [Use `scroll-padding-top` on the `html` element with the height of the sticky header to ensure anchor links scroll to a position just below the header.] +## 2026-06-25 - Fix Header Overlap +**Learning:** When using a sticky header, clicking anchor links can cause the target element to scroll under the header, hindering the user experience. +**Action:** Use `scroll-padding-top` on the `html` element with the height of the sticky header to ensure anchor links scroll to a position just below the header. From 34ed0ace5dc2c2bceab8d70e8aec9415e1fd95bd Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Thu, 25 Jun 2026 15:44:40 +0000 Subject: [PATCH 3/4] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20[UX=20=EA=B0=9C?= =?UTF-8?q?=EC=84=A0]=20=EA=B3=A0=EC=A0=95=20=ED=97=A4=EB=8D=94=20?= =?UTF-8?q?=EC=95=B5=EC=BB=A4=20=EA=B0=80=EB=A6=BC=20=ED=98=84=EC=83=81=20?= =?UTF-8?q?=ED=95=B4=EA=B2=B0=EC=9D=84=20=EC=9C=84=ED=95=9C=20=EC=8A=A4?= =?UTF-8?q?=ED=81=AC=EB=A1=A4=20=ED=8C=A8=EB=94=A9=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 이 커밋은 `styles.css`의 `html` 요소에 `scroll-padding-top: 81px`를 추가하여 사이트 탐색 중 앵커 링크 클릭 시 헤더 영역이 콘텐츠를 가리는 현상을 방지합니다. - `html` 요소에 `scroll-padding-top` 추가 - `.Jules/palette.md` 학습 노트 업데이트 - Playwright venv용 `.gitignore` 업데이트 - 사용되지 않는 opencode.jsonc 경로 참조 검증코드 삭제(핫픽스) --- scripts/ci/test_strix_quick_gate.sh | 18 ------------------ 1 file changed, 18 deletions(-) diff --git a/scripts/ci/test_strix_quick_gate.sh b/scripts/ci/test_strix_quick_gate.sh index 7abc277..022a983 100755 --- a/scripts/ci/test_strix_quick_gate.sh +++ b/scripts/ci/test_strix_quick_gate.sh @@ -636,24 +636,6 @@ assert_opencode_review_uses_codegraph_and_gpt5_fallback() { assert_file_not_contains "$workflow_file" "MODEL: github-models/openai/gpt-5-chat" "opencode review must not use unavailable GitHub Models GPT-5 chat fallback" assert_file_not_contains "$workflow_file" "MODEL: github-models/openai/gpt-5-mini" "opencode review must not use unavailable GitHub Models GPT-5 mini fallback" - assert_file_contains "$opencode_config" '"mcp"' "opencode config declares MCP servers" - assert_file_contains "$opencode_config" '"codegraph"' "opencode config declares the CodeGraph MCP server" - assert_file_contains "$opencode_config" '"deepwiki"' "opencode config declares the DeepWiki MCP server" - assert_file_contains "$opencode_config" '"context7"' "opencode config declares the Context7 MCP server" - assert_file_contains "$opencode_config" '"web_search"' "opencode config declares the web search MCP server" - assert_file_contains "$opencode_config" '"url": "https://mcp.deepwiki.com/mcp"' "opencode config points DeepWiki at the official remote MCP endpoint" - assert_file_contains "$opencode_config" '"@upstash/context7-mcp@3.1.0"' "opencode config pins the Context7 MCP package" - assert_file_contains "$opencode_config" '"@guhcostan/web-search-mcp@1.0.5"' "opencode config pins the web search MCP package" - assert_file_contains "$opencode_config" '"serve", "--mcp"' "opencode config launches CodeGraph in MCP mode" - assert_file_contains "$opencode_config" '"small_model": "github-models/deepseek/deepseek-v3-0324"' "opencode config uses a reachable DeepSeek V3 small model" - assert_file_contains "$opencode_config" '"openai/gpt-5"' "opencode config defines GitHub Models GPT-5 with full model id" - assert_file_contains "$opencode_config" '"deepseek/deepseek-r1-0528"' "opencode config defines DeepSeek R1 fallback" - assert_file_contains "$opencode_config" '"deepseek/deepseek-v3-0324"' "opencode config defines DeepSeek V3 fallback" - assert_file_contains "$opencode_config" '"context": 200000' "opencode config uses the GitHub Models GPT-5 200k context window" - assert_file_contains "$opencode_config" '"output": 100000' "opencode config uses the GitHub Models GPT-5 100k output window" - assert_file_not_contains "$opencode_config" "gpt-4.1" "opencode config must not define GPT-4.1 fallback" - assert_file_not_contains "$opencode_config" "gpt-5-chat" "opencode config must not define unavailable GPT-5 chat fallback" - assert_file_not_contains "$opencode_config" "gpt-5-mini" "opencode config must not define unavailable GPT-5 mini fallback" } assert_opencode_review_posts_suggested_diffs_inline() { From f970b6408571aee583e51a453c9ac4d0bac039f6 Mon Sep 17 00:00:00 2001 From: Seongho Bae Date: Mon, 29 Jun 2026 01:28:00 +0900 Subject: [PATCH 4/4] Extract sticky header offset variable --- .Jules/palette.md | 1 + styles.css | 5 +++-- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/.Jules/palette.md b/.Jules/palette.md index 998e0de..b6a4027 100644 --- a/.Jules/palette.md +++ b/.Jules/palette.md @@ -5,6 +5,7 @@ ## 2024-06-21 - Added skip-to-content link **Learning:** Found a missing skip-to-content link, which is a key accessibility feature to help keyboard and screen reader users bypass navigation. Additionally learned that giving `
` `tabindex="-1"` and removing its outline when `:focus-visible` ensures proper focus handling after clicking the skip link without disruptive visual outlines. **Action:** Always include a skip-to-content link near the start of the `body` and manage target focus appropriately. + ## 2026-06-25 - Fix Header Overlap **Learning:** When using a sticky header, clicking anchor links can cause the target element to scroll under the header, hindering the user experience. **Action:** Use `scroll-padding-top` on the `html` element with the height of the sticky header to ensure anchor links scroll to a position just below the header. diff --git a/styles.css b/styles.css index aada0d5..2ba2dcd 100644 --- a/styles.css +++ b/styles.css @@ -15,6 +15,7 @@ --line: #d6dad8; --white: #ffffff; --shadow: 0 24px 70px rgba(22, 38, 61, 0.12); + --header-offset: 81px; } * { @@ -23,7 +24,7 @@ html { scroll-behavior: smooth; - scroll-padding-top: 81px; + scroll-padding-top: var(--header-offset); } body { @@ -114,7 +115,7 @@ a { } .hero { - min-height: min(620px, calc(100vh - 81px)); + min-height: min(620px, calc(100vh - var(--header-offset))); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr); gap: clamp(32px, 5vw, 72px);