diff --git a/app/game-frontend/e2e/commandArguments.spec.ts b/app/game-frontend/e2e/commandArguments.spec.ts index 18e39165..c1bf0309 100644 --- a/app/game-frontend/e2e/commandArguments.spec.ts +++ b/app/game-frontend/e2e/commandArguments.spec.ts @@ -2500,6 +2500,24 @@ test('keeps Ref command briefs and autonomous-action state after a turn mutation const mobileEditor = mobilePage.locator('[data-command-scope="general"]'); const mobileFirstRow = mobileEditor.locator('.action-column > div').first(); await expect(mobileFirstRow).toContainText('휴식(자율 행동)'); + const mobileRestGeometry = await mobileFirstRow.evaluate((element) => { + const label = element.querySelector('span'); + const autonomous = element.querySelector('small'); + if (!label || !autonomous) throw new Error('mobile autonomous rest labels are missing'); + const labelRect = label.getBoundingClientRect(); + const autonomousRect = autonomous.getBoundingClientRect(); + return { + display: getComputedStyle(element).display, + labelCenterY: labelRect.top + labelRect.height / 2, + autonomousCenterY: autonomousRect.top + autonomousRect.height / 2, + inlineGap: autonomousRect.left - labelRect.right, + rowOverflow: element.scrollWidth - element.clientWidth, + }; + }); + expect(mobileRestGeometry.display).toBe('flex'); + expect(mobileRestGeometry.labelCenterY).toBeCloseTo(mobileRestGeometry.autonomousCenterY, 0); + expect(Math.abs(mobileRestGeometry.inlineGap)).toBeLessThanOrEqual(1); + expect(mobileRestGeometry.rowOverflow).toBeLessThanOrEqual(0); await expect(mobileFirstRow).toHaveAttribute('data-autorun-tooltip', /자율 행동: 200年 3月 · .*까지/u); await mobileFirstRow.focus(); await expect diff --git a/app/game-frontend/src/components/command/ReservedCommandEditor.vue b/app/game-frontend/src/components/command/ReservedCommandEditor.vue index b0baa071..26b3fd02 100644 --- a/app/game-frontend/src/components/command/ReservedCommandEditor.vue +++ b/app/game-frontend/src/components/command/ReservedCommandEditor.vue @@ -1047,6 +1047,15 @@ const clickOutsideMenu = (event: Event) => { font-size: 0.72em; line-height: 1; } +.reserved-command-editor.mobile .action-column > div.autonomous { + display: flex; + flex-flow: row nowrap; + align-items: center; + justify-content: center; +} +.reserved-command-editor.mobile .action-column > div.autonomous > small { + flex: 0 0 auto; +} .edit-column button { background: #444; cursor: pointer; diff --git a/app/game-frontend/src/components/main/CommandListPanel.vue b/app/game-frontend/src/components/main/CommandListPanel.vue index 23588718..3f269535 100644 --- a/app/game-frontend/src/components/main/CommandListPanel.vue +++ b/app/game-frontend/src/components/main/CommandListPanel.vue @@ -29,6 +29,7 @@ const props = defineProps<{ storageKey?: string; mapData?: CommandMapData | null; mapLayout?: CommandMapLayout | null; + mobile?: boolean; }>(); const emit = defineEmits<{ @@ -143,6 +144,7 @@ onUnmounted(() => { :map-data="props.mapData" :map-layout="props.mapLayout" :autonomous-until="autonomousUntil" + :mobile="props.mobile" @reserve-bulk="emit('set-general-turns', $event)" @shift="emit('shift-general-turns', $event)" @repeat="emit('repeat-general-turns', $event)" diff --git a/app/game-frontend/src/views/MainView.vue b/app/game-frontend/src/views/MainView.vue index a3a2406b..5a5bb6ee 100644 --- a/app/game-frontend/src/views/MainView.vue +++ b/app/game-frontend/src/views/MainView.vue @@ -334,6 +334,7 @@ watch( :autorun-limit="reservedGeneralAutorunLimit" :map-data="worldMap" :map-layout="mapLayout" + mobile @set-general-turns="reserveGeneralTurns" @shift-general-turns="shiftGeneralTurns" @repeat-general-turns="repeatGeneralTurns"