diff --git a/apps/web/src/oj/learn/components/CodeRunBlock.vue b/apps/web/src/oj/learn/components/CodeRunBlock.vue index 295adde..85fcd9c 100644 --- a/apps/web/src/oj/learn/components/CodeRunBlock.vue +++ b/apps/web/src/oj/learn/components/CodeRunBlock.vue @@ -10,8 +10,6 @@ import { explainRuntimeError } from "oj/problem/utils/runtimeError" import { useAuthModalStore } from "shared/store/authModal" import { useUserStore } from "shared/store/user" import { mainWrapExtensions, wrapMain } from "../wrapMain" -import { hangWrapExtensions } from "shared/extensions/hangIndent" -import { useBreakpoints } from "shared/composables/breakpoints" const CodeEditor = defineAsyncComponent(() => import("shared/components/CodeEditor.vue")) @@ -37,12 +35,8 @@ const message = useMessage() const { copy } = useClipboard({ legacy: true }) const original = computed(() => (props.wrapMain ? wrapMain(props.code) : props.code)) -const { isDesktop } = useBreakpoints() -// 手机上折行(见 hangIndent.ts);桌面正文 720 宽,长行少,照旧横着滚 -const extensions = computed(() => [ - ...(props.wrapMain ? mainWrapExtensions : []), - ...(isDesktop.value ? [] : hangWrapExtensions), -]) +// 手机上也不折行,长行横着滚:折下来的那截看着像另起了一行代码 +const extensions = computed(() => (props.wrapMain ? mainWrapExtensions : [])) const value = ref(original.value) const input = ref("") const running = ref(false) diff --git a/apps/web/src/oj/learn/components/ExerciseDebug.vue b/apps/web/src/oj/learn/components/ExerciseDebug.vue index ae9936d..7bbcf0a 100644 --- a/apps/web/src/oj/learn/components/ExerciseDebug.vue +++ b/apps/web/src/oj/learn/components/ExerciseDebug.vue @@ -2,7 +2,6 @@ import ExerciseResult from "./ExerciseResult.vue" import type { Exercise, ExerciseDebugData } from "utils/types" import { highlightLines } from "shared/highlight" -import { hangStyle } from "shared/extensions/hangIndent" const props = defineProps<{ exercise: Exercise; lang?: string }>() const emit = defineEmits<{ @@ -92,19 +91,19 @@ function reset() { 点击你认为有错误的代码行(可多选)。

- + +
- - {{ idx + 1 }} - - +
+ + {{ idx + 1 }} + + +
- +
() const emit = defineEmits<{ @@ -39,28 +38,21 @@ const segments = computed(() => { }) /** - * 按行切开,每行自己折行、悬挂缩进(见 hangIndent.ts)。原来整段 pre-wrap, - * 手机上行尾的注释折下来顶格,看着像另起了一行代码。 + * 按行切开,一行一个块;不折行,长行整块横着滚(和正文的代码块一样)。 * 高亮的 HTML 在换行处是断开的(见 shared/highlight.ts 的 walk),按 "\n" 切不会切坏标签。 */ const lines = computed(() => { - const rows: { indent: string; parts: Segment[] }[] = [{ indent: "", parts: [] }] + const rows: { parts: Segment[] }[] = [{ parts: [] }] for (const seg of segments.value) { if (seg.type === "blank") { rows[rows.length - 1].parts.push(seg) continue } seg.html.split("\n").forEach((html, i) => { - if (i > 0) rows.push({ indent: "", parts: [] }) + if (i > 0) rows.push({ parts: [] }) if (html) rows[rows.length - 1].parts.push({ type: "code", html }) }) } - for (const row of rows) { - const first = row.parts[0] - if (first?.type === "code") { - row.indent = first.html.replace(/<[^>]*>/g, "").match(/^[ \t]*/)![0] - } - } return rows }) @@ -114,13 +106,10 @@ function inputWidth(idx: number): string { border: '1px solid var(--learn-line)', borderRadius: '6px', padding: '10px 12px', + overflowX: 'auto', }" > -
+