From d03d2dc7560cc8f90f47df7c09a2b7dfb4e8464d Mon Sep 17 00:00:00 2001
From: yuetsh <517252939@qq.com>
Date: Sun, 10 May 2026 22:31:51 +0800
Subject: [PATCH] fix font

---
 .../tutorial/components/ExerciseManager.vue   |  4 ++--
 src/oj/learn/components/ExerciseFill.vue      | 20 +++++++++++--------
 src/oj/learn/components/ExerciseSort.vue      |  2 +-
 3 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/admin/tutorial/components/ExerciseManager.vue b/src/admin/tutorial/components/ExerciseManager.vue
index 9e810f2..96457fb 100644
--- a/src/admin/tutorial/components/ExerciseManager.vue
+++ b/src/admin/tutorial/components/ExerciseManager.vue
@@ -282,7 +282,7 @@ function typeTagType(type: string): "success" | "info" | "warning" {
               type="textarea"
               :rows="10"
               placeholder="在此粘贴正确的代码，保存后将自动按行拆分并乱序"
-              style="font-family: monospace"
+              style="font-family: 'Monaco'"
             />
           </n-form-item>
         </template>
@@ -302,7 +302,7 @@ function typeTagType(type: string): "success" | "info" | "warning" {
               type="textarea"
               :rows="10"
               placeholder="用 {{答案}} 标记空位，多个合法答案用 | 分隔，例如：for {{i|idx}} in range(10):"
-              style="font-family: monospace"
+              style="font-family: 'Monaco'"
             />
           </n-form-item>
         </template>
diff --git a/src/oj/learn/components/ExerciseFill.vue b/src/oj/learn/components/ExerciseFill.vue
index 52c2b16..ba20164 100644
--- a/src/oj/learn/components/ExerciseFill.vue
+++ b/src/oj/learn/components/ExerciseFill.vue
@@ -90,16 +90,16 @@ function inputWidth(idx: number): string {
     style="margin: 16px 0; border: 1.5px solid var(--n-border-color)"
   >
     <template #header>
-      <n-tag type="warning" size="small" :bordered="false"
-        >练一练 · 代码填空</n-tag
-      >
+      <n-tag type="warning" size="small" :bordered="false">
+        练一练 · 代码填空
+      </n-tag>
     </template>
 
     <p style="font-weight: 500; margin-bottom: 12px">{{ data.question }}</p>
 
     <pre
       :style="{
-        fontFamily: 'monospace',
+        fontFamily: 'Monaco',
         lineHeight: '1.6',
         background: 'var(--n-color)',
         border: '1px solid var(--n-border-color)',
@@ -109,14 +109,16 @@ function inputWidth(idx: number): string {
         whiteSpace: 'pre-wrap',
         margin: 0,
       }"
-    ><template v-for="(seg, i) in segments" :key="i"
-      ><span v-if="seg.type === 'code'" v-html="seg.html" /><input
+    >
+    <template v-for="(seg, i) in segments" :key="i">
+      <span v-if="seg.type === 'code'" v-html="seg.html" />
+      <input
         v-else
         :value="userInputs[seg.index]"
         :disabled="allCorrect"
         :style="{
           width: inputWidth(seg.index),
-          fontFamily: 'monospace',
+          fontFamily: 'Monaco',
           padding: '1px 4px',
           borderRadius: '3px',
           border: `1.5px solid ${
@@ -136,7 +138,9 @@ function inputWidth(idx: number): string {
           minWidth: '4ch',
         }"
         @input="userInputs[seg.index] = ($event.target as HTMLInputElement).value"
-      /></template></pre>
+      />
+    </template>
+  </pre>
 
     <n-alert
       v-if="wrongBlanks.size > 0 || allCorrect"
diff --git a/src/oj/learn/components/ExerciseSort.vue b/src/oj/learn/components/ExerciseSort.vue
index 91776d6..dc74f12 100644
--- a/src/oj/learn/components/ExerciseSort.vue
+++ b/src/oj/learn/components/ExerciseSort.vue
@@ -138,7 +138,7 @@ const lineHtmlMap = computed<Record<number, string>>(() => {
                 ? 'rgba(208,48,80,0.07)'
                 : 'transparent',
           cursor: 'grab',
-          fontFamily: 'monospace',
+          fontFamily: 'Monaco',
           userSelect: 'none',
         }"
         @dragstart="onDragStart(idx)"