From a73a9afcc381b71c295351cf9ef72ebe51c9ccba Mon Sep 17 00:00:00 2001 From: jisangs Date: Sat, 30 May 2026 18:44:51 +0900 Subject: [PATCH] =?UTF-8?q?=EB=A6=AC=ED=8E=99=ED=86=A0=EB=A7=81:=20?= =?UTF-8?q?=EC=BD=94=EB=93=9C=20=EA=B2=80=ED=86=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- AGENTS.md | 6 ++++-- README.md | 5 +++-- components/game/NumberAnswerForm.tsx | 4 +++- components/game/VariableChoiceAnswerForm.tsx | 10 +++++++--- 4 files changed, 17 insertions(+), 8 deletions(-) diff --git a/AGENTS.md b/AGENTS.md index 6c5f64a..117bc6e 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -107,7 +107,8 @@ prisma/ #### 숫자 괄호 풀이 화면 (`/number-parentheses/play`) - 모든 항을 하나의 공유 input으로 입력한다. -- input 아래에는 각 항의 입력값 버튼을 버튼 그룹으로 표시한다. 현재 입력 중인 항은 `aria-pressed`로 표시하고, 비어 있는 항은 `?`로 표시한다. +- input 위 우상단에는 각 항의 진행 상태를 progress 스타일로 표시한다. +- 진행 상태는 값 입력 전에는 괄호 안 원래 항 값을 표시하고, 값 입력 중이거나 입력 후에는 사용자가 입력한 값을 표시한다. - 첫째 항에서 Enter를 누르면 같은 input이 둘째 항 입력으로 전환된다. - 둘째 항에서 Enter를 누르면 제출 동작을 실행한다. 별도 제출 버튼이 없어도 form submit 흐름이 유지되어야 한다. - 터치 기반 입력 환경에서는 input focus 시 커스텀 숫자 키패드를 표시한다. 키패드는 숫자, `+/-`, `.`, `⌫`, `↵` 버튼을 제공한다. @@ -120,7 +121,8 @@ prisma/ - 답을 직접 입력하지 않는다. 각 항의 보기 버튼 중에서 선택한다. - 첫째 항 선택 후 자동으로 둘째 항 보기로 focus가 이동한다. -- 두 항을 모두 선택하면 `정답 확인` 버튼에 focus가 이동하고 버튼이 활성화된다. +- 둘째 항을 선택하면 별도 `정답 확인` 버튼 없이 즉시 제출되어 피드백 화면으로 전환된다. +- 입력 항 진행 상태는 progress 스타일로 표시한다. 선택 전에는 괄호 안 원래 항 값을 표시하고, 선택 후에는 고른 보기 값을 표시한다. - 선택된 보기 버튼은 `aria-pressed`로 표시한다. ### API / 백엔드 diff --git a/README.md b/README.md index 43825b6..c09886b 100644 --- a/README.md +++ b/README.md @@ -59,7 +59,7 @@ - 괄호 종류는 현재 `()`만 선택 가능하고 `{}`, `[]`는 비활성화되어 있습니다. - 풀이 화면에서 두 항을 직접 숫자로 입력합니다. - 모든 항은 하나의 input에서 순서대로 입력하며, 첫째 항 Enter → 둘째 항 전환, 둘째 항 Enter → 제출. - - input 아래 항 버튼 그룹에서 현재 입력 중인 항을 표시하고, 버튼을 누르면 해당 항을 초기화해 다시 입력합니다. + - input 위 우상단의 progress 표시에서 각 항의 진행 상태를 보여줍니다. 입력 전에는 괄호 안 원래 항 값, 입력 중/입력 후에는 사용자가 입력한 값을 표시합니다. - 터치 환경에서는 커스텀 숫자 키패드(숫자, `+/-`, `.`, `⌫`, `↵`)가 표시되며, 정밀 포인터가 있는 환경(마우스/트랙패드)에서는 숨깁니다. ### 미지수 괄호 풀기 (`/variable-parentheses` → `/variable-parentheses/play`) @@ -68,7 +68,8 @@ - 풀이 화면에서 두 항을 보기 중에서 선택합니다. - 각 항의 보기는 정답 계수의 절대값을 기준으로 음수/양수 두 개를 제공합니다. - 첫째 항 선택 후 자동으로 둘째 항 보기로 focus가 이동합니다. - - 두 항 선택 완료 후 `정답 확인` 버튼이 활성화되며 버튼에 focus가 이동합니다. + - 둘째 항을 선택하면 별도 `정답 확인` 버튼 없이 즉시 피드백 화면으로 전환됩니다. + - 입력 항 progress 표시는 선택 전에는 괄호 안 원래 항 값, 선택 후에는 고른 보기 값을 표시합니다. --- diff --git a/components/game/NumberAnswerForm.tsx b/components/game/NumberAnswerForm.tsx index 2dfcf06..4f674d8 100644 --- a/components/game/NumberAnswerForm.tsx +++ b/components/game/NumberAnswerForm.tsx @@ -239,7 +239,9 @@ const NumberAnswerForm = forwardRef< key={button.index} className="min-w-0 flex-1" aria-label={`${button.label} ${ - completed ? `입력값 ${button.value}` : "미입력" + completed + ? `입력값 ${button.value}` + : `원래 항 ${displayValue}, 미입력` }${selected ? ", 현재 입력 중" : ""}`} >