From ededbe8f1b028ff291a30259f6104a386bb0a88d Mon Sep 17 00:00:00 2001
From: ngc2207 <cfngc3109@gmail.com>
Date: Sat, 11 Jan 2025 02:09:29 +0800
Subject: [PATCH] feat(playground): enhance Markdown component with improved
 styling and example formatting

---
 src/app/playground/components/markdown.tsx       | 14 ++++++++------
 src/app/playground/components/style/markdown.css |  4 ++++
 2 files changed, 12 insertions(+), 6 deletions(-)
 create mode 100644 src/app/playground/components/style/markdown.css

diff --git a/src/app/playground/components/markdown.tsx b/src/app/playground/components/markdown.tsx
index 463dfcf..6b0b74c 100644
--- a/src/app/playground/components/markdown.tsx
+++ b/src/app/playground/components/markdown.tsx
@@ -1,13 +1,14 @@
 import { Suspense } from "react";
 import { MDXRemote } from "next-mdx-remote/rsc";
 import "github-markdown-css/github-markdown-dark.css";
+import "../components/style/markdown.css";
 
 export default function Markdown() {
   return (
     <Suspense fallback={<>Loading...</>}>
       <div className="h-full w-full p-8 markdown-body">
         <MDXRemote
-          source={`# 两数之和
+          source={`# 1. 两数之和
 
 ## 📝 问题描述
 
@@ -19,12 +20,13 @@ export default function Markdown() {
 
 ## 💡 示例
 
-\`\`\`
-输入：nums = [2, 7, 11, 15], target = 9
-输出：[0, 1]
-解释：因为 nums[0] + nums[1] == 9 ，返回 [0, 1]。
-\`\`\`
+### 示例 1：
 
+> 输入：nums = [2,7,11,15], target = 9
+>
+> 输出：[0,1]
+>
+> 解释：因为 nums[0] + nums[1] == 9 ，返回 [0, 1] 。
         `}
         />
       </div>
diff --git a/src/app/playground/components/style/markdown.css b/src/app/playground/components/style/markdown.css
new file mode 100644
index 0000000..8f3927d
--- /dev/null
+++ b/src/app/playground/components/style/markdown.css
@@ -0,0 +1,4 @@
+.markdown-body {
+  background-color: #282c34;
+  border: #3e4452;
+}