From 08c220d6a75cbccdd88fb3df9e8f39b98179cd36 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?sunsonliu=28=E5=88=98=E9=98=B3=29?= <sunsonliu@tencent.com>
Date: Tue, 29 Oct 2024 10:19:50 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E7=BC=96=E8=BE=91=E5=8C=BA=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E5=AF=B9yaml=E8=AF=AD=E6=B3=95=E7=9A=84=E9=AB=98?=
 =?UTF-8?q?=E4=BA=AE=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/Editor.js               | 3 ++-
 src/sass/themes/blue.scss   | 2 +-
 src/sass/themes/dark.scss   | 2 +-
 src/sass/themes/green.scss  | 2 +-
 src/sass/themes/light.scss  | 2 +-
 src/sass/themes/red.scss    | 2 +-
 src/sass/themes/violet.scss | 2 +-
 7 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/Editor.js b/src/Editor.js
index 90e987e2..fc95a9e6 100644
--- a/src/Editor.js
+++ b/src/Editor.js
@@ -17,6 +17,7 @@
 import codemirror from 'codemirror';
 // import 'codemirror/mode/markdown/markdown';
 import 'codemirror/mode/gfm/gfm'; // https://codemirror.net/mode/gfm/index.html
+import 'codemirror/mode/yaml-frontmatter/yaml-frontmatter'; // https://codemirror.net/5/mode/yaml-frontmatter/index.html
 // import 'codemirror/mode/xml/xml';
 import 'codemirror/addon/edit/continuelist';
 import 'codemirror/addon/edit/closetag';
@@ -78,7 +79,7 @@ export default class Editor {
         // matchBrackets: true, // 括号匹配
         // mode: 'gfm', // 从markdown模式改成gfm模式，以使用默认高亮规则
         mode: {
-          name: 'gfm',
+          name: 'yaml-frontmatter', // yaml-frontmatter在gfm的基础上增加了对yaml的支持
           gitHubSpice: false,
         },
         lineWrapping: true, // 自动换行
diff --git a/src/sass/themes/blue.scss b/src/sass/themes/blue.scss
index 11b140a8..01cad222 100644
--- a/src/sass/themes/blue.scss
+++ b/src/sass/themes/blue.scss
@@ -133,7 +133,7 @@ $mdBlockquoteBg: $VIOLET1;
         span, .cm-variable-2, .cm-string, .cm-strong, .cm-em, .cm-meta {
           color: $editorColor;
         }
-        .cm-image-marker, .cm-quote, .cm-header {
+        .cm-image-marker, .cm-quote, .cm-header, .cm-atom {
           color: $editorImportantColor;
         }
         .cm-url {
diff --git a/src/sass/themes/dark.scss b/src/sass/themes/dark.scss
index 5c973d64..5fd3ab1c 100644
--- a/src/sass/themes/dark.scss
+++ b/src/sass/themes/dark.scss
@@ -106,7 +106,7 @@ $mdSvgTextColor: rgb(250, 160, 0);
         span, .cm-variable-2, .cm-string, .cm-strong, .cm-em, .cm-meta {
           color: $editorColor;
         }
-        .cm-image-marker, .cm-quote, .cm-header {
+        .cm-image-marker, .cm-quote, .cm-header, .cm-atom {
           color: $editorImportantColor;
         }
         .cm-url {
diff --git a/src/sass/themes/green.scss b/src/sass/themes/green.scss
index 58df6b36..d255141c 100644
--- a/src/sass/themes/green.scss
+++ b/src/sass/themes/green.scss
@@ -120,7 +120,7 @@ $mdBlockquoteBg: $GREEN1;
         span, .cm-variable-2, .cm-string, .cm-strong, .cm-em, .cm-meta {
           color: $editorColor;
         }
-        .cm-image-marker, .cm-quote, .cm-header {
+        .cm-image-marker, .cm-quote, .cm-header, .cm-atom {
           color: $editorImportantColor;
         }
         .cm-url {
diff --git a/src/sass/themes/light.scss b/src/sass/themes/light.scss
index f2bdac4b..49fce380 100644
--- a/src/sass/themes/light.scss
+++ b/src/sass/themes/light.scss
@@ -106,7 +106,7 @@ $mdBlockquoteBg: rgb(231, 245, 255);
         span, .cm-variable-2, .cm-string, .cm-strong, .cm-em, .cm-meta {
           color: $editorColor;
         }
-        .cm-image-marker, .cm-quote, .cm-header {
+        .cm-image-marker, .cm-quote, .cm-header, .cm-atom {
           color: $editorImportantColor;
         }
         .cm-url {
diff --git a/src/sass/themes/red.scss b/src/sass/themes/red.scss
index 6b9cfbdc..b091c902 100644
--- a/src/sass/themes/red.scss
+++ b/src/sass/themes/red.scss
@@ -120,7 +120,7 @@ $mdBlockquoteBg: $PINK1;
         span, .cm-variable-2, .cm-string, .cm-strong, .cm-em, .cm-meta {
           color: $editorColor;
         }
-        .cm-image-marker, .cm-quote, .cm-header {
+        .cm-image-marker, .cm-quote, .cm-header, .cm-atom {
           color: $editorImportantColor;
         }
         .cm-url {
diff --git a/src/sass/themes/violet.scss b/src/sass/themes/violet.scss
index cda9a53d..2ff4d1d9 100644
--- a/src/sass/themes/violet.scss
+++ b/src/sass/themes/violet.scss
@@ -122,7 +122,7 @@ $mdBlockquoteBg: $VIOLET1;
         span, .cm-variable-2, .cm-string, .cm-strong, .cm-em, .cm-meta {
           color: $editorColor;
         }
-        .cm-image-marker, .cm-quote, .cm-header {
+        .cm-image-marker, .cm-quote, .cm-header, .cm-atom {
           color: $editorImportantColor;
         }
         .cm-url {