feat: 对作弊区域进行细节提升和美化.

src/Content.svelte

@@ -52,7 +52,7 @@
 
   // -----------------------------
 
-  $: markdown = $_cheatHint.replaceAll('[copy]', '```javascript\n').replaceAll('[/copy]', '\n```');
+  $: markdown = $_cheatHint;
 
   // -----------------------------
   // 各种请求封装头
@@ -410,7 +410,7 @@
     $_cheatWindow = false;
   }}
 >
-  <div class="w-full h-60">
+  <div class="w-full h-auto">
     <!-- {$_cheatHint} -->
     <Markdown {markdown} />
   </div>

src/app.css

@@ -2,6 +2,8 @@
 @tailwind components;
 @tailwind utilities;
 
+/* Markdown 代码样式*/
+
 code.language-javascript {
   display: block;
   overflow: hidden;
@@ -10,6 +12,26 @@ code.language-javascript {
   margin: 6px 0;
   padding: 10px;
 
-  background: grey;
-  border-radius: var(--rounded-box, 1rem);
+  @apply rounded-box;
+  @apply bg-neutral;
+  @apply text-neutral-content;
+}
+
+.markdown h1 {
+  @apply text-2xl;
+  @apply text-center;
+  @apply p-1;
+}
+
+.markdown h2 {
+  @apply text-base;
+  @apply pb-2;
+}
+
+.markdown hr {
+  padding: 2px;
+  border: none;
+
+  @apply rounded-box;
+  @apply bg-primary;
 }

src/components/Markdown.svelte

@@ -3,8 +3,20 @@
   import { marked } from 'marked';
   import { toast } from '@zerodevx/svelte-toast';
 
+  /**markdown 字符串原文*/
   export let markdown = '';
 
+  /**对 markdown 字符串原文进行处理*/
+  let _markdown = () => {
+    // console.log(markdown);
+    let res = markdown.replaceAll('[copy]', '```javascript\n').replaceAll('[/copy]', '\n```');
+    const readme = `# 公共使用说明\n\n一般来讲, 首先要开始游戏至第一个自由活动点 (能自由走动的状态).
+此时按下F12, 选中【控制台】, 即可开始输入指令.\n\n***点击代码即可复制到剪切板.*** \n\n---\n\n# 本地使用说明\n`;
+    res = readme + res;
+    return res;
+  };
+
+  /**Markdown 组件的 DOM*/
   let dom;
 
   onMount(() => {
@@ -34,6 +46,6 @@
   }
 </script>
 
-<div bind:this={dom} class="flex flex-col">
-  {@html marked(markdown)}
+<div bind:this={dom} class="markdown flex flex-col">
+  {@html marked(_markdown())}
 </div>