diff --git a/apps/site/design.md b/apps/site/design.md index cec0002..4abfd04 100644 --- a/apps/site/design.md +++ b/apps/site/design.md @@ -834,10 +834,3 @@ max-age=0 지정(존 설정이 우선하면 효과는 제한적). **운칙: /wor - **탭 전환 스크롤 잔류** — setCurrentView 는 focus({preventScroll:true}) 였지만 이전 뷰의 window.scrollY 가 그대로 남아, 새 뷰가 짧으면 브라우저가 클램프(600→49)해 헤더가 반쯤 잘리고 길면 화면 중간에 떨어졌다. 뷰마다 크롬 위치가 제각각 = "왔다갔다". 수리: setCurrentView 마지막에 window.scrollTo(0,0) (양앱). - **모바일 헤더 이중 스택** — ≤900에서 브랜드 줄(.side 43px)+크럼 탑바(52px)=95px 크롬이 쌓이고 둘 다 static 이라 스크롤하면 떠내려가며, safe-top 도 없었다. 수리: ≤900에서 .side 숨김(크럼이 브랜드명을 이미 담음 — 중복), .topbar 를 sticky top:0 + safe-top 패딩의 단일 헤더로(두레 앱바와 같은 문법). 데스크톱(>900) 무변경. - 재발 방지: e2e.mjs M5 헤더·스크롤 스위트 10단언(헤더 sticky·상단 박착, 300px+ 스크롤에서 탭 전환 → scrollY=0·헤더 top=0). 시각 기준 갱신(390px 9화면 의도 변경), verify L0~L6 재통과. 스킬 mobile-app-ux.md 에 "뷰 전환은 스크롤을 리셋·헤더는 하나" 규칙 반영. - -## 2026-08-23 — 국소: 모바일 헤더 재설계(v24) — 크럼이 아니라 브랜드다 - -v23 스크롤 리셋·단일 헤더에도 사용자 평가가 "여전히 깨져 보인다"였다. 에뮬레이터에서 라이브 URL로 재확인한 결과 구조(단일 sticky 바)는 맞았지만 **시각적 무게가 틀렸다** — 작은 회색 크럼 텍스트("가온 학적부 / 대시보기")가 52px 바에 혼자 떠 있고 브랜드 마크는 사라진, 빈약한 헤더였다. 계측 전부 통과해도 보기에 빈약하면 실패다. -- 수리: 모바일 헤더를 **브랜드(가 모노그램 타일+이름)+액션(인쇄·종) 한 줄**로 — 두레 앱바와 같은 문법. 탑바에 브랜드를 이어받게(데스크톱은 사이드바 브랜드, 모바일은 탑바 브랜드 — CSS display 로 한쪽만 노출), 크럼은 모바일에서 숨김(화면 이름은 각 뷰 헤드와 활성 탭이 말한다). min-height 56px, sticky+safe-top 유지. -- 검증: 360/390/412px 오버플로 0·브랜드 노출·크럼/사이드 숨김 실측, 스크롤 800에서 탑바 top=0, 탭 전환 scrollY=0. 비전 검수 "확신 있는 앱 헤더·패딩 정상". 시각 기준 갱신(390px), verify L0~L6 재통과. -- 스킬 규칙 갱신: "크럼을 헤더로 내보내면 빈약해 보인다 — 모바일 헤더는 브랜드+액션, 계측이 통과해도 눈으로 봐야 한다". diff --git a/apps/site/public/work/gaon-lms/index.html b/apps/site/public/work/gaon-lms/index.html index 88acf20..5099c4a 100644 --- a/apps/site/public/work/gaon-lms/index.html +++ b/apps/site/public/work/gaon-lms/index.html @@ -35,7 +35,7 @@ rel="stylesheet" href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&family=Noto+Serif+KR:wght@500;600&display=swap" /> - +
- 가온 학적부

가온 학적부 대시보드

2026학년도 1학기 · 3월 2주차 diff --git a/apps/site/public/work/gaon-lms/styles/main.css b/apps/site/public/work/gaon-lms/styles/main.css index ff56ff4..fa0c7b4 100644 --- a/apps/site/public/work/gaon-lms/styles/main.css +++ b/apps/site/public/work/gaon-lms/styles/main.css @@ -146,7 +146,6 @@ h3 { font-size: var(--step-0); font-weight: 500; } background: var(--background); flex: none; } -.topbar .brand { display: none; } /* 브랜드는 사이드바에 있다 — 모바일에서만 탑바가 이어받는다 */ .crumb { display: flex; align-items: center; gap: var(--space-2); font-size: var(--step-0); color: var(--muted-foreground); } .crumb strong { color: var(--foreground); font-weight: 600; } .topbar-right { display: flex; align-items: center; gap: var(--space-3); } @@ -601,18 +600,16 @@ tbody tr:hover { background: var(--muted); } /* ── 반응형 ── */ @media (max-width: 900px) { .app { grid-template-columns: minmax(0, 1fr); } - /* 모바일 앱 헤더 — 내비는 바텀 탭으로(HIG·M3). 헤더는 브랜드+액션 한 줄(두레 앱바 문법): - 화면 이름은 각 뷰 헤드와 활성 탭이 말하므로 크럼은 데스크톱 문법이다. + /* 모바일 앱 헤더 — 내비는 바텀 탭으로(HIG·M3). 헤더는 크럼 탑바 하나다: + 브랜드 줄(사이드)과 크럼이 서로 중복하는 데다 95px 크롬을 쌓아 옥에 끼는 느낌을 냈다. 탑바가 sticky 로 상단에 남고, safe-top 으로 노치/상태바를 피한다 */ .side { display: none; } .topbar { position: sticky; top: 0; z-index: 40; - height: auto; min-height: 56px; min-width: 0; + height: auto; min-height: 52px; min-width: 0; padding: 0 max(var(--space-4), var(--safe-right)) 0 max(var(--space-4), var(--safe-left)); padding-top: max(0px, var(--safe-top)); } - .topbar .brand { display: flex; flex: none; padding: 0; } - .crumb { display: none; } .main { padding-bottom: calc(72px + var(--safe-bottom)); } /* 바텀 내비 + 홈 인디케이터 확보 */ .dash-grid, .cal-layout, .counsel-grid { grid-template-columns: minmax(0, 1fr); } .week-panel { grid-row: auto; } @@ -621,6 +618,7 @@ tbody tr:hover { background: var(--muted); } .view > *:not(.view-head) { margin-inline: var(--space-4); } .headline { gap: var(--space-2); } .term-badge { display: none; } + .crumb { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .cal-day { height: 56px; } } @media (max-width: 680px) { diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-attendance-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-attendance-390.png index 32b7bf3..cdec839 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-attendance-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-attendance-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-calendar-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-calendar-390.png index 4d0f013..ee178f9 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-calendar-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-calendar-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-counsel-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-counsel-390.png index d738079..e985462 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-counsel-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-counsel-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-1440.png b/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-1440.png index d06a3e2..6158868 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-1440.png and b/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-1440.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-390.png index 6aee43d..95b7c54 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-dashboard-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-files-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-files-390.png index 1dc0f7e..1388e26 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-files-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-files-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-grades-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-grades-390.png index ea2cdff..73a866e 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-grades-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-grades-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-notice-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-notice-390.png index d0af935..6db75c7 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-notice-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-notice-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-report-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-report-390.png index ba56ad4..b5d3110 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-report-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-report-390.png differ diff --git a/apps/site/tools/__shots__/baseline/gaon-lms-students-390.png b/apps/site/tools/__shots__/baseline/gaon-lms-students-390.png index 060a005..084748e 100644 Binary files a/apps/site/tools/__shots__/baseline/gaon-lms-students-390.png and b/apps/site/tools/__shots__/baseline/gaon-lms-students-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-attendance-390.png b/apps/site/tools/__shots__/current/gaon-lms-attendance-390.png index 008310c..9fe355b 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-attendance-390.png and b/apps/site/tools/__shots__/current/gaon-lms-attendance-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-calendar-390.png b/apps/site/tools/__shots__/current/gaon-lms-calendar-390.png index f719f3b..a065f24 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-calendar-390.png and b/apps/site/tools/__shots__/current/gaon-lms-calendar-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-counsel-390.png b/apps/site/tools/__shots__/current/gaon-lms-counsel-390.png index aa949bf..d3277c0 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-counsel-390.png and b/apps/site/tools/__shots__/current/gaon-lms-counsel-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-dashboard-1440.png b/apps/site/tools/__shots__/current/gaon-lms-dashboard-1440.png index 81d2548..5e4dbd6 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-dashboard-1440.png and b/apps/site/tools/__shots__/current/gaon-lms-dashboard-1440.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-dashboard-390.png b/apps/site/tools/__shots__/current/gaon-lms-dashboard-390.png index f68fd7d..42179b0 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-dashboard-390.png and b/apps/site/tools/__shots__/current/gaon-lms-dashboard-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-files-390.png b/apps/site/tools/__shots__/current/gaon-lms-files-390.png index 96dd5c0..52c3d89 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-files-390.png and b/apps/site/tools/__shots__/current/gaon-lms-files-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-grades-390.png b/apps/site/tools/__shots__/current/gaon-lms-grades-390.png index 22e8cb4..f0a408f 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-grades-390.png and b/apps/site/tools/__shots__/current/gaon-lms-grades-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-notice-390.png b/apps/site/tools/__shots__/current/gaon-lms-notice-390.png index 2d516fb..0ed2d6d 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-notice-390.png and b/apps/site/tools/__shots__/current/gaon-lms-notice-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-report-390.png b/apps/site/tools/__shots__/current/gaon-lms-report-390.png index 344ca6a..98d1f2c 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-report-390.png and b/apps/site/tools/__shots__/current/gaon-lms-report-390.png differ diff --git a/apps/site/tools/__shots__/current/gaon-lms-students-390.png b/apps/site/tools/__shots__/current/gaon-lms-students-390.png index d9f237f..f8dbdbd 100644 Binary files a/apps/site/tools/__shots__/current/gaon-lms-students-390.png and b/apps/site/tools/__shots__/current/gaon-lms-students-390.png differ diff --git a/apps/site/tools/__shots__/diag2-gaon-390-attendance.png b/apps/site/tools/__shots__/diag2-gaon-390-attendance.png deleted file mode 100644 index e11679c..0000000 Binary files a/apps/site/tools/__shots__/diag2-gaon-390-attendance.png and /dev/null differ diff --git a/apps/site/tools/__shots__/diag2-gaon-390.png b/apps/site/tools/__shots__/diag2-gaon-390.png deleted file mode 100644 index 0cbdce3..0000000 Binary files a/apps/site/tools/__shots__/diag2-gaon-390.png and /dev/null differ diff --git a/apps/site/tools/e2e-report.md b/apps/site/tools/e2e-report.md index af53783..a325b7c 100644 --- a/apps/site/tools/e2e-report.md +++ b/apps/site/tools/e2e-report.md @@ -1,6 +1,6 @@ -# E2E 시나리오 게이트 — 2026-08-23 06:12 +# E2E 시나리오 게이트 — 2026-08-23 05:48 -단언 1745 · 통과 1745 · 실패 0 — **GREEN — 전 단언 통과** +단언 1754 · 통과 1754 · 실패 0 — **GREEN — 전 단언 통과** | 스위트 | 통과 | 실패 | |---|---|---| @@ -8,8 +8,8 @@ | M5 헤더·스크롤 | 10 | 0 | | M320 매트릭스 | 90 | 0 | | M390 매트릭스 | 105 | 0 | -| M1 터치타깃 | 231 | 0 | -| M2 대비 | 1093 | 0 | +| M1 터치타깃 | 222 | 0 | +| M2 대비 | 1111 | 0 | | M768 매트릭스 | 90 | 0 | | S7 뒤로 가기 | 6 | 0 | | S7 뒤로 가기·모달 | 5 | 0 | diff --git a/apps/site/tools/verify-report.md b/apps/site/tools/verify-report.md index 2f205e6..782ed60 100644 --- a/apps/site/tools/verify-report.md +++ b/apps/site/tools/verify-report.md @@ -1,15 +1,15 @@ -# 검증 리포트 — 2026-08-23 06:12 +# 검증 리포트 — 2026-08-23 05:48 -게이트: **전 계층 통과 — 배포 가능** · 총 88.1초 +게이트: **전 계층 통과 — 배포 가능** · 총 85.9초 | 계층 | 결과 | 항목 | 소요 | |---|---|---|---| -| L0-정적/stylelint | PASS | PASS — | 1.7s | -| L0-정식/html-validate | PASS | PASS — | 1.3s | -| L1-단위/계산로직 | PASS | PASS 41 | 0.1s | -| L2-기능/감사 | PASS | PASS 72 | 10.1s | -| L2-불변식/렌더 | PASS | PASS 10 | 17.6s | -| L3-시각회귀/diff | PASS | PASS 30 | 11.5s | -| L4-WebKit | PASS | PASS 8 | 3.9s | -| L5-탐색/키보드 | PASS | PASS 14 | 6.2s | -| L6-시나리오/E2E | PASS | PASS — | 35.7s | +| L0-정적/stylelint | PASS | PASS — | 1.4s | +| L0-정식/html-validate | PASS | PASS — | 1.2s | +| L1-단위/계산로직 | PASS | PASS 41 | 0.0s | +| L2-기능/감사 | PASS | PASS 72 | 9.6s | +| L2-불변식/렌더 | PASS | PASS 10 | 16.9s | +| L3-시각회귀/diff | PASS | PASS 30 | 11.3s | +| L4-WebKit | PASS | PASS 8 | 3.5s | +| L5-탐색/키보드 | PASS | PASS 14 | 6.3s | +| L6-시나리오/E2E | PASS | PASS — | 35.5s | diff --git a/packages/cli/CHANGELOG.md b/packages/cli/CHANGELOG.md index 2bd0b4c..9701adc 100644 --- a/packages/cli/CHANGELOG.md +++ b/packages/cli/CHANGELOG.md @@ -1,11 +1,5 @@ # designpaca -## 0.7.2 - -### Patch Changes - -- 모바일 헤더 규칙 정교화 — 크럼이 아니라 브랜드+액션이다(계측 통과에도 빈약해 보이면 실패) - ## 0.7.1 ### Patch Changes diff --git a/packages/cli/package.json b/packages/cli/package.json index bbfe14f..ae59812 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "designpaca", - "version": "0.7.2", + "version": "0.7.1", "description": "웹 디자인 파이프라인 스킬 — Claude Code · Codex · Cursor 에 한 줄로 설치한다", "keywords": [ "design", diff --git a/packages/core/CHANGELOG.md b/packages/core/CHANGELOG.md index 16cc87a..3853e40 100644 --- a/packages/core/CHANGELOG.md +++ b/packages/core/CHANGELOG.md @@ -1,7 +1,5 @@ # @designpaca/core -## 0.7.2 - ## 0.7.1 ## 0.7.0 diff --git a/packages/core/package.json b/packages/core/package.json index 096bcc9..0ca135a 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@designpaca/core", - "version": "0.7.2", + "version": "0.7.1", "private": true, "description": "designpaca 설치 엔진 — 타깃 어댑터, 매니페스트, 드리프트 감지", "type": "module", diff --git a/packages/skill/CHANGELOG.md b/packages/skill/CHANGELOG.md index 46201b3..88ee262 100644 --- a/packages/skill/CHANGELOG.md +++ b/packages/skill/CHANGELOG.md @@ -1,11 +1,5 @@ # CHANGELOG -## 0.7.2 - -### Patch Changes - -- 모바일 헤더 규칙 정교화 — 크럼이 아니라 브랜드+액션이다(계측 통과에도 빈약해 보이면 실패) - ## 0.7.1 ### Patch Changes diff --git a/packages/skill/package.json b/packages/skill/package.json index d494e88..affe8df 100644 --- a/packages/skill/package.json +++ b/packages/skill/package.json @@ -1,6 +1,6 @@ { "name": "@designpaca/skill", - "version": "0.7.2", + "version": "0.7.1", "private": true, "description": "designpaca 스킬 원본 — SKILL.md 와 참조 문서", "scripts": { diff --git a/packages/skill/references/mobile-app-ux.md b/packages/skill/references/mobile-app-ux.md index d607216..b70b794 100644 --- a/packages/skill/references/mobile-app-ux.md +++ b/packages/skill/references/mobile-app-ux.md @@ -65,7 +65,7 @@ **탭을 바꾸면 새 화면은 맨 위에서 시작한다.** 뷰 전환 함수 마지막에 `window.scrollTo(0, 0)` 을 넣어라 — `focus({ preventScroll: true })` 만으로는 부족하다. 실측 사고: 이전 뷰의 스크롤이 남은 채 탭을 바꾸면, 새 뷰가 짧을 때 브라우저가 스크롤을 클램프해 헤더가 **반쯤 잘린 채** 뜨고, 길면 화면 중간에 떨어진다. 뷰마다 크롬 위치가 달라져 "상단 바가 왔다갔다한다"는 보고로 나타났다. -**모바일 헤더는 브랜드+액션 한 줄이다.** 데스크톱의 브랜드 바(사이드바 상단)와 화면 크럼 바를 좁은 화면에 그대로 쌓으면 90px+ 크롬이 콘텐츠를 옥에 끼운다. 하나를 고른다 — **브랜드(마크+이름)와 액션을 헤더에 남기고, 크럼(화면 이름)은 숨긴다.** 화면 이름은 각 뷰의 헤드와 활성 탭이 이미 말한다. 실측 사고: 크럼을 헤더로 내보냈더니 "작은 회색 텍스트가 52px 바에 떠 있는" 빈약한 헤더가 돼 **사용자에게 '깨져 보인다'는 보고**를 받았다 — 구조는 맞아도 시각적 무게가 없으면 깨진 것으로 읽힌다. 고른 헤더는 `position: sticky; top: 0` + safe-top 패딩으로 스크롤 내내 상단에 남는다. 검증은 E2E 로: 300px+ 스크롤 상태에서 탭 전환 → `scrollY === 0`·헤더 `top === 0`, 그리고 **눈으로** — 계측이 전부 통과해도 보기에 빈약하면 실패다. +**모바일 헤더는 한 줄이다.** 데스크톱의 브랜드 바(사이드바 상단)와 화면 크럼 바를 좁은 화면에 그대로 쌓으면 90px+ 크롬이 콘텐츠를 옥에 끼운다. 하나를 고른다(크럼이 브랜드명을 이미 담고 있다면 브랜드 줄을 숨긴다) — 고른 헤더는 `position: sticky; top: 0` + safe-top 패딩으로 스크롤 내내 상단에 남는다. 검증은 E2E 로: 300px+ 스크롤 상태에서 탭 전환 → `scrollY === 0`·헤더 `top === 0`. ### 하드웨어 뒤로가기 = 앱 내 히스토리 (핵심 패턴)