모바일 환경에서만 실행되는 가상 키보드 추가

This commit is contained in:
2026-05-27 18:09:59 +09:00
parent 8efe618a31
commit 326da377c9
2 changed files with 171 additions and 49 deletions
+5 -5
View File
@@ -16,13 +16,14 @@ import KatexRenderer from "@/components/math/KatexRenderer";
import { useGameStore } from "@/store/gameStore";
import type { ProblemCount } from "@/store/gameStore";
const MOBILE_BREAKPOINT_QUERY = "(min-width: 640px)";
const DESKTOP_INPUT_DEVICE_QUERY = "(any-hover: hover) and (any-pointer: fine)";
const MOBILE_KEYBOARD_SPACER_OFFSET = 480;
const REAL_NUMBER_PATTERN = /^-?\d+(?:\.\d+)?$/;
function parseAnswer(value: string) {
const trimmed = value.trim();
if (!/^-?\d+$/.test(trimmed)) return null;
if (!REAL_NUMBER_PATTERN.test(trimmed)) return null;
return Number(trimmed);
}
@@ -108,7 +109,7 @@ export default function PlayClient({ problemCount }: PlayClientProps) {
const parsedB = parseAnswer(answerB);
if (parsedA === null || parsedB === null) {
setInputError("두 칸 모두 수로 입력하세요.");
setInputError("두 칸 모두 수로 입력하세요.");
return;
}
@@ -128,7 +129,7 @@ export default function PlayClient({ problemCount }: PlayClientProps) {
}, []);
const scrollKatexToViewportTop = useCallback(() => {
if (window.matchMedia(MOBILE_BREAKPOINT_QUERY).matches) return;
if (window.matchMedia(DESKTOP_INPUT_DEVICE_QUERY).matches) return;
function alignKatex() {
const katexElement =
@@ -301,7 +302,6 @@ export default function PlayClient({ problemCount }: PlayClientProps) {
{!submitted && mobileFocusSpacerHeight > 0 ? (
<div
aria-hidden="true"
className="sm:hidden"
style={{ height: mobileFocusSpacerHeight }}
/>
) : null}