From 72d6174d7b0b61be8db42dcf7a21512fafbc1f2d Mon Sep 17 00:00:00 2001
From: Hufe921 <huangyunfeihufe@hotmail.com>
Date: Thu, 29 Dec 2022 15:54:12 +0800
Subject: [PATCH] feat:add font selection and font wysiwyg

---
 index.html  | 22 +++++++++++++++++-----
 src/main.ts |  3 ++-
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index cdff544..ee164bd 100644
--- a/index.html
+++ b/index.html
@@ -31,11 +31,23 @@
           <span class="select" title="字体">微软雅黑</span>
           <div class="options">
             <ul>
-              <li data-family='Yahei'>微软雅黑</li>
-              <li data-family="宋体">宋体</li>
-              <li data-family="黑体">黑体</li>
-              <li data-family="Arial">Arial</li>
-              <li data-family="Fantasy">Fantasy</li>
+              <li data-family="Yahei" style="font-family:'Yahei';">微软雅黑</li>
+              <li data-family="宋体" style="font-family:'宋体';">宋体</li>
+              <li data-family="黑体" style="font-family:'黑体';">黑体</li>
+              <li data-family="仿宋" style="font-family:'仿宋';">仿宋</li>
+              <li data-family="楷体" style="font-family:'楷体';">楷体</li>
+              <li data-family="等线" style="font-family:'等线';">等线</li>
+              <li data-family="华文琥珀" style="font-family:'华文琥珀';">华文琥珀</li>
+              <li data-family="华文楷体" style="font-family:'华文楷体';">华文楷体</li>
+              <li data-family="华文隶书" style="font-family:'华文隶书';">华文隶书</li>
+              <li data-family="华文新魏" style="font-family:'华文新魏';">华文新魏</li>
+              <li data-family="华文行楷" style="font-family:'华文行楷';">华文行楷</li>
+              <li data-family="华文中宋" style="font-family:'华文中宋';">华文中宋</li>
+              <li data-family="华文彩云" style="font-family:'华文彩云';">华文彩云</li>
+              <li data-family="Arial" style="font-family:'Arial';">Arial</li>
+              <li data-family="Segoe UI" style="font-family:'Segoe UI';">Segoe UI</li>
+              <li data-family="Ink Free" style="font-family:'Ink Free';">Ink Free</li>
+              <li data-family="Fantasy" style="font-family:'Fantasy';">Fantasy</li>
             </ul>
           </div>
         </div>
diff --git a/src/main.ts b/src/main.ts
index 7303242..efd83b9 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -925,9 +925,10 @@ window.onload = function () {
 
     // 富文本
     fontOptionDom.querySelectorAll<HTMLLIElement>('li').forEach(li => li.classList.remove('active'))
-    const curFontDom = fontOptionDom.querySelector<HTMLLIElement>(`[data-family=${payload.font}]`)
+    const curFontDom = fontOptionDom.querySelector<HTMLLIElement>(`[data-family='${payload.font}']`)
     if (curFontDom) {
       fontSelectDom.innerText = curFontDom.innerText
+      fontSelectDom.style.fontFamily = payload.font
       curFontDom.classList.add('active')
     }
     payload.bold ? boldDom.classList.add('active') : boldDom.classList.remove('active')