From 8b7fdd720c3ea906e4527c944727f4d015e0b968 Mon Sep 17 00:00:00 2001 From: Cael Date: Sat, 26 Oct 2024 01:07:26 +0800 Subject: [PATCH] docs: update help docs --- ...\344\272\214\345\255\246\346\234\237.json" | 6 +-- docs/help.md | 9 +++- package-lock.json | 50 +++++++++---------- package.json | 8 +-- .../MarkdownRenderer/MarkdownRenderer.tsx | 2 +- .../MarkdownRenderer/styles/markdown.css | 20 ++++---- 6 files changed, 50 insertions(+), 45 deletions(-) diff --git "a/archive/2023-2024\345\271\264\347\254\254\344\272\214\345\255\246\346\234\237.json" "b/archive/2023-2024\345\271\264\347\254\254\344\272\214\345\255\246\346\234\237.json" index 9b0b7da..4c0330d 100644 --- "a/archive/2023-2024\345\271\264\347\254\254\344\272\214\345\255\246\346\234\237.json" +++ "b/archive/2023-2024\345\271\264\347\254\254\344\272\214\345\255\246\346\234\237.json" @@ -18,7 +18,7 @@ "date": "2024-05-18T04:36:39.553Z", "week": 12, "name": "夏宇", - "content": "20届飘过来看看 \r\n哈哈哈哈哈" + "content": "20届飘过来看看\r\n\r\n哈哈哈哈哈" }, { "_id": "66471fee854cd6380c63a283", @@ -228,7 +228,7 @@ "date": "2024-03-12T02:15:57.419Z", "week": 3, "name": "李锦程", - "content": "难得上午值班,学习学习模型的旧化以及渗线技巧。\r\n今天的天气很好,春也渐渐到来了,开心😋\r\n新学期的第一篇值班笔记,希望自己在新的学期可以拿出更好好看的模型作品吧!学业也要有长足的进步。" + "content": "难得上午值班,学习学习模型的旧化以及渗线技巧。\r\n\r\n今天的天气很好,春也渐渐到来了,开心😋\r\n\r\n新学期的第一篇值班笔记,希望自己在新的学期可以拿出更好好看的模型作品吧!学业也要有长足的进步。" }, { "_id": "65eec4786f45fddc30d084f5", @@ -256,7 +256,7 @@ "date": "2024-03-06T08:33:19.687Z", "week": 2, "name": "刘明哲", - "content": "视频学习stm32和blender\r\n(最近忙于缓考,进度稍慢)" + "content": "视频学习stm32和blender\r\n\r\n(最近忙于缓考,进度稍慢)" }, { "_id": "65e813006f45fddc30d084f1", diff --git a/docs/help.md b/docs/help.md index 6cb1d95..2be28ad 100644 --- a/docs/help.md +++ b/docs/help.md @@ -2,10 +2,16 @@ 本文档旨在于让你使用 [Markdown](https://www.markdownguide.org) 语法写出漂亮的值班笔记。 -如果你是一名技术人员,应该对 Markdown 语法并不陌生,如果你是一名新手,也不用担心,值班无聊的时候可以多尝试写写,很快就能上手。 +如果你是一名开发人员,应该对 **Markdown** 语法并不陌生,如果你是一名新手,也不用担心,值班无聊的时候可以多尝试写写,很快就能上手。 本文档即是使用 Markdown 书写,相信你学习完也可以写出一篇漂亮的值班笔记。 +> **切记** ✨ +> +> 如果你不熟悉 Markdown,那么写值班笔记的时候,换行必须要按两次 `回车` 键或 `换行` 键,否则文本会显示在同一行。 +> +> 你可以点击编辑器中的预览按钮,查看你的文本渲染是否正确。 + --- ## 一、基础认知 @@ -78,7 +84,6 @@ Markdown 是一种轻量级**标记语言**,使用一些简单的标记符号 > > - 值班笔记的字数上限是 **1000** 个字符,因此多多发挥你的创意吧! > - 同时,网站会**自动保存**你编辑的内容,不用担心关闭浏览器导致内容丢失。 -> - 在 Markdown 中,使用两个及以上的**回车**才可以实现**换行**效果,即段落之间要有一个空行这是新手需要注意的地方。 --- diff --git a/package-lock.json b/package-lock.json index 9b4cce6..4305d1f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,16 +15,16 @@ "@codemirror/lang-markdown": "^6.3.0", "@codemirror/language-data": "^6.5.1", "@codemirror/view": "^6.34.1", - "@types/node": "^22.7.9", + "@types/node": "^22.8.0", "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", - "@uiw/codemirror-theme-vscode": "^4.23.5", - "@uiw/react-codemirror": "^4.23.5", + "@uiw/codemirror-theme-vscode": "^4.23.6", + "@uiw/react-codemirror": "^4.23.6", "autoprefixer": "^10.4.20", "chart.js": "^4.4.5", "chartjs-plugin-datalabels": "^2.2.0", "clsx": "^2.1.1", - "framer-motion": "^11.11.9", + "framer-motion": "^11.11.10", "postcss": "^8.4.47", "prettier": "^3.3.3", "react": "^18.3.1", @@ -1351,13 +1351,13 @@ "dev": true }, "node_modules/@types/node": { - "version": "22.7.9", - "resolved": "https://registry.npmjs.org/@types/node/-/node-22.7.9.tgz", - "integrity": "sha512-jrTfRC7FM6nChvU7X2KqcrgquofrWLFDeYC1hKfwNWomVvrn7JIksqf344WN2X/y8xrgqBd2dJATZV4GbatBfg==", + "version": "22.8.0", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.8.0.tgz", + "integrity": "sha512-84rafSBHC/z1i1E3p0cJwKA+CfYDNSXX9WSZBRopjIzLET8oNt6ht2tei4C7izwDeEiLLfdeSVBv1egOH916hg==", "dev": true, "license": "MIT", "dependencies": { - "undici-types": "~6.19.2" + "undici-types": "~6.19.8" } }, "node_modules/@types/prismjs": { @@ -1413,9 +1413,9 @@ } }, "node_modules/@uiw/codemirror-extensions-basic-setup": { - "version": "4.23.5", - "resolved": "https://registry.npmjs.org/@uiw/codemirror-extensions-basic-setup/-/codemirror-extensions-basic-setup-4.23.5.tgz", - "integrity": "sha512-eTMfT8TejVN/D5vvuz9Lab+MIoRYdtqa2ftZZmU3JpcDIXf9KaExPo+G2Rl9HqySzaasgGXOOG164MAnj3MSIw==", + "version": "4.23.6", + "resolved": "https://registry.npmjs.org/@uiw/codemirror-extensions-basic-setup/-/codemirror-extensions-basic-setup-4.23.6.tgz", + "integrity": "sha512-bvtq8IOvdkLJMhoJBRGPEzU51fMpPDwEhcAHp9xCR05MtbIokQgsnLXrmD1aZm6e7s/3q47H+qdSfAAkR5MkLA==", "dev": true, "license": "MIT", "dependencies": { @@ -1441,22 +1441,22 @@ } }, "node_modules/@uiw/codemirror-theme-vscode": { - "version": "4.23.5", - "resolved": "https://registry.npmjs.org/@uiw/codemirror-theme-vscode/-/codemirror-theme-vscode-4.23.5.tgz", - "integrity": "sha512-tNMROZhVHPFAnx+e/SAVctU/aJyLXisI7jekmyVH3Gcl2wYIcAMgrDGfwY5xhHbDu18lP9w2kLIg3i9IzZsDeQ==", + "version": "4.23.6", + "resolved": "https://registry.npmjs.org/@uiw/codemirror-theme-vscode/-/codemirror-theme-vscode-4.23.6.tgz", + "integrity": "sha512-xUo1ic+Kk5hnv5gy+cXU12GZVSnDjic8s8weKq8loPHF1dSR1e6gkKVIKZRnvoOZ302taKRk7phWpBUaWIuKQg==", "dev": true, "license": "MIT", "dependencies": { - "@uiw/codemirror-themes": "4.23.5" + "@uiw/codemirror-themes": "4.23.6" }, "funding": { "url": "https://jaywcjlove.github.io/#/sponsor" } }, "node_modules/@uiw/codemirror-themes": { - "version": "4.23.5", - "resolved": "https://registry.npmjs.org/@uiw/codemirror-themes/-/codemirror-themes-4.23.5.tgz", - "integrity": "sha512-yWUTpaVroxIxjKASQAmKaYy+ZYtF+YB6d8sVmSRK2TVD13M+EWvVT2jBGFLqR1UVg7G0W/McAy8xdeTg+a3slg==", + "version": "4.23.6", + "resolved": "https://registry.npmjs.org/@uiw/codemirror-themes/-/codemirror-themes-4.23.6.tgz", + "integrity": "sha512-0dpuLQW+V6zrKvfvor/eo71V3tpr2L2Hsu8QZAdtSzksjWABxTOzH3ShaBRxCEsrz6sU9sa9o7ShwBMMDz59bQ==", "dev": true, "license": "MIT", "dependencies": { @@ -1474,9 +1474,9 @@ } }, "node_modules/@uiw/react-codemirror": { - "version": "4.23.5", - "resolved": "https://registry.npmjs.org/@uiw/react-codemirror/-/react-codemirror-4.23.5.tgz", - "integrity": "sha512-2zzGpx61L4mq9zDG/hfsO4wAH209TBE8VVsoj/qrccRe6KfcneCwKgRxtQjxBCCnO0Q5S+IP+uwCx5bXRzgQFQ==", + "version": "4.23.6", + "resolved": "https://registry.npmjs.org/@uiw/react-codemirror/-/react-codemirror-4.23.6.tgz", + "integrity": "sha512-caYKGV6TfGLRV1HHD3p0G3FiVzKL1go7wes5XT2nWjB0+dTdyzyb81MKRSacptgZcotujfNO6QXn65uhETRAMw==", "dev": true, "license": "MIT", "dependencies": { @@ -1484,7 +1484,7 @@ "@codemirror/commands": "^6.1.0", "@codemirror/state": "^6.1.1", "@codemirror/theme-one-dark": "^6.0.0", - "@uiw/codemirror-extensions-basic-setup": "4.23.5", + "@uiw/codemirror-extensions-basic-setup": "4.23.6", "codemirror": "^6.0.0" }, "funding": { @@ -2182,9 +2182,9 @@ } }, "node_modules/framer-motion": { - "version": "11.11.9", - "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.11.9.tgz", - "integrity": "sha512-XpdZseuCrZehdHGuW22zZt3SF5g6AHJHJi7JwQIigOznW4Jg1n0oGPMJQheMaKLC+0rp5gxUKMRYI6ytd3q4RQ==", + "version": "11.11.10", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.11.10.tgz", + "integrity": "sha512-061Bt1jL/vIm+diYIiA4dP/Yld7vD47ROextS7ESBW5hr4wQFhxB5D5T5zAc3c/5me3cOa+iO5LqhA38WDln/A==", "dev": true, "license": "MIT", "dependencies": { diff --git a/package.json b/package.json index ffaa7fa..ddc209a 100644 --- a/package.json +++ b/package.json @@ -16,16 +16,16 @@ "@codemirror/lang-markdown": "^6.3.0", "@codemirror/language-data": "^6.5.1", "@codemirror/view": "^6.34.1", - "@types/node": "^22.7.9", + "@types/node": "^22.8.0", "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", - "@uiw/codemirror-theme-vscode": "^4.23.5", - "@uiw/react-codemirror": "^4.23.5", + "@uiw/codemirror-theme-vscode": "^4.23.6", + "@uiw/react-codemirror": "^4.23.6", "autoprefixer": "^10.4.20", "chart.js": "^4.4.5", "chartjs-plugin-datalabels": "^2.2.0", "clsx": "^2.1.1", - "framer-motion": "^11.11.9", + "framer-motion": "^11.11.10", "postcss": "^8.4.47", "prettier": "^3.3.3", "react": "^18.3.1", diff --git a/src/components/MarkdownRenderer/MarkdownRenderer.tsx b/src/components/MarkdownRenderer/MarkdownRenderer.tsx index 91a5557..9bdbd6a 100644 --- a/src/components/MarkdownRenderer/MarkdownRenderer.tsx +++ b/src/components/MarkdownRenderer/MarkdownRenderer.tsx @@ -16,7 +16,7 @@ export default function MarkdownRenderer({ content, className }: { content: stri {content} diff --git a/src/components/MarkdownRenderer/styles/markdown.css b/src/components/MarkdownRenderer/styles/markdown.css index 31239af..ec4c598 100644 --- a/src/components/MarkdownRenderer/styles/markdown.css +++ b/src/components/MarkdownRenderer/styles/markdown.css @@ -11,11 +11,11 @@ } .markdown :is(h1, h2, h3, h4, h5, h6) { - @apply font-bold mt-4 text-gray-800; + @apply font-bold mt-3 text-gray-800; } .markdown ul { - @apply mt-4; + @apply mt-3; } .markdown li { @@ -23,7 +23,7 @@ } .markdown p { - @apply mt-4 text-gray-700; + @apply mt-3 text-gray-700; } .markdown a { @@ -31,7 +31,7 @@ } .markdown table { - @apply text-gray-800 mt-4 rounded-xl outline outline-1 outline-gray-400; + @apply text-gray-800 mt-3 rounded-xl outline outline-1 outline-gray-400; } .markdown table tbody tr { @@ -46,22 +46,22 @@ @apply border-r border-gray-400; } -.markdown pre[class*="language-"] { - @apply mt-4; +.markdown pre:has(.code-highlight) { + @apply mt-3; } .markdown blockquote { - @apply mt-4 border-l-4 border-l-blue-600 pl-5 py-2 rounded-xl bg-black/5; + @apply mt-3 border-l-4 border-l-blue-600 pl-5 py-2 rounded-xl bg-black/5; } .markdown hr { - @apply border-b border-b-gray-400 mt-4; + @apply border-b border-b-gray-400 mt-3; } .markdown code:not([class]) { - @apply mx-0.5 px-1 py-0.5 bg-black/10 rounded-sm text-sm; + @apply mx-0.5 px-1 py-0.5 bg-black/10 rounded-sm text-sm text-black; } .markdown img { - @apply min-h-10 w-full max-w-6xl rounded-xl mx-auto mt-4 border border-gray-300 shadow-sm; + @apply min-h-10 w-full max-w-6xl rounded-xl mx-auto mt-3 border border-gray-300 shadow-sm; }