From c7764efff6f1e90acff1ff76a830a8c6e12ca80f Mon Sep 17 00:00:00 2001
From: purocean <purocean@gmail.com>
Date: Fri, 27 May 2022 21:59:27 +0800
Subject: [PATCH] feat: show heading level when mouse hovered

---
 src/renderer/components/Preview.vue  | 13 +++++++++++++
 src/renderer/plugins/markdown-toc.ts |  2 ++
 2 files changed, 15 insertions(+)

diff --git a/src/renderer/components/Preview.vue b/src/renderer/components/Preview.vue
index 4f320dea..04ece7b8 100644
--- a/src/renderer/components/Preview.vue
+++ b/src/renderer/components/Preview.vue
@@ -684,6 +684,19 @@ export default defineComponent({
     pre > code {
       background: var(--g-color-96);
     }
+
+    h1, h2, h3, h4, h5, h6 {
+      &:hover {
+        &::after {
+          content: "\0000a0\0000a0" attr(data-tag);
+          color: var(--g-color-40);
+          font-size: 12px;
+          width: 0;
+          display: inline-block;
+          white-space: nowrap;
+        }
+      }
+    }
   }
 }
 
diff --git a/src/renderer/plugins/markdown-toc.ts b/src/renderer/plugins/markdown-toc.ts
index ed560e80..8cbd8bbb 100644
--- a/src/renderer/plugins/markdown-toc.ts
+++ b/src/renderer/plugins/markdown-toc.ts
@@ -181,6 +181,8 @@ const MarkdownItPlugin = (md: Markdown, o: any) => {
       header.attrSet('title', headTitle)
     }
 
+    header.attrSet('data-tag', header.tag)
+
     return slf.renderToken(tokens, idx, opt)
   }