From 0929e98dee271aecb024b6a793f6221b1d133be4 Mon Sep 17 00:00:00 2001
From: Vanessa <lly219@gmail.com>
Date: Tue, 18 Apr 2023 14:00:53 +0800
Subject: [PATCH] :litspick:

---
 app/src/assets/scss/business/_config.scss |  8 +++++-
 app/src/config/index.ts                   | 34 +++++++++++------------
 2 files changed, 23 insertions(+), 19 deletions(-)

diff --git a/app/src/assets/scss/business/_config.scss b/app/src/assets/scss/business/_config.scss
index 2149e7b8e..35d5eb5b0 100644
--- a/app/src/assets/scss/business/_config.scss
+++ b/app/src/assets/scss/business/_config.scss
@@ -4,6 +4,7 @@
     box-sizing: border-box;
     flex: 1;
     background-color: var(--b3-theme-background);
+    height: 90vh;
 
     .b3-label {
       padding: 16px 0;
@@ -17,7 +18,12 @@
       width: 148px;
       overflow: auto;
       padding: 8px 0;
-      box-sizing: border-box
+      box-sizing: border-box;
+      height: 90vh;
+
+      .b3-form__icon {
+        margin: 0 8px 8px;
+      }
     }
   }
 
diff --git a/app/src/config/index.ts b/app/src/config/index.ts
index 43ecf16b0..4aaade924 100644
--- a/app/src/config/index.ts
+++ b/app/src/config/index.ts
@@ -26,10 +26,9 @@ export const openSetting = () => {
     }
     const height = Math.min(window.innerHeight * .9 - 42, window.innerHeight * .7);
     const dialog = new Dialog({
-        content: `<div class="fn__flex-column" style="border-radius: 4px;overflow: hidden;position: relative">
-<div class="b3-form__icon search__header"><svg style="left: 14px;" class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg><input class="b3-text-field b3-text-field--text fn__block b3-form__icon-input"></div>
-<div class="fn__flex-1 fn__flex config__panel">
-  <ul class="b3-tab-bar b3-list b3-list--background" style="height:${height}px;">
+        content: `<div class="fn__flex-1 fn__flex config__panel">
+  <ul class="b3-tab-bar b3-list b3-list--background">
+    <div class="b3-form__icon"><svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg><input class="b3-text-field fn__block b3-form__icon-input"></div>
     <li data-name="editor" class="b3-list-item--focus b3-list-item"><svg class="b3-list-item__graphic"><use xlink:href="#iconEdit"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.editor}</span></li>
     <li data-name="filetree" class="b3-list-item"><svg class="b3-list-item__graphic"><use xlink:href="#iconFiles"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.fileTree}</span></li>
     <li data-name="card" class="b3-list-item"><svg class="b3-list-item__graphic"><use xlink:href="#iconRiffCard"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.riffCard}</span></li>
@@ -44,20 +43,19 @@ export const openSetting = () => {
     <li data-name="repos" class="b3-list-item"><svg class="b3-list-item__graphic"><use xlink:href="#iconCloud"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.cloud}</span></li>
     <li data-name="about" class="b3-list-item"><svg class="b3-list-item__graphic"><use xlink:href="#iconInfo"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.about}</span></li>
   </ul>
-  <div class="config__tab-container" style="height:${height}px" data-name="editor">${editor.genHTML()}</div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="filetree"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="card"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="AI"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="image"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="export"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="appearance"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="bazaar"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="search"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px;overflow: scroll" data-name="keymap"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="account"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="repos"></div>
-  <div class="config__tab-container fn__none" style="height:${height}px" data-name="about"></div>
-</div>
+  <div class="config__tab-container" data-name="editor">${editor.genHTML()}</div>
+  <div class="config__tab-container fn__none" data-name="filetree"></div>
+  <div class="config__tab-container fn__none" data-name="card"></div>
+  <div class="config__tab-container fn__none" data-name="AI"></div>
+  <div class="config__tab-container fn__none" data-name="image"></div>
+  <div class="config__tab-container fn__none" data-name="export"></div>
+  <div class="config__tab-container fn__none" data-name="appearance"></div>
+  <div class="config__tab-container fn__none" data-name="bazaar"></div>
+  <div class="config__tab-container fn__none" data-name="search"></div>
+  <div class="config__tab-container fn__none" style="overflow: scroll" data-name="keymap"></div>
+  <div class="config__tab-container fn__none" data-name="account"></div>
+  <div class="config__tab-container fn__none" data-name="repos"></div>
+  <div class="config__tab-container fn__none" data-name="about"></div>
 </div>`,
         width: "90vw",
     });