From 49ae606e3a8b228db5dd7d2a5495034e56358a56 Mon Sep 17 00:00:00 2001
From: Vanessa <lly219@gmail.com>
Date: Fri, 1 Dec 2023 20:18:58 +0800
Subject: [PATCH] :art: https://github.com/siyuan-note/siyuan/issues/9751

---
 app/src/index.ts                    |  4 ++--
 app/src/protyle/render/av/render.ts | 18 ++++++++++--------
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/app/src/index.ts b/app/src/index.ts
index 04892f017..bda3324da 100644
--- a/app/src/index.ts
+++ b/app/src/index.ts
@@ -36,8 +36,6 @@ export class App {
         /// #if BROWSER
         registerServiceWorker(`${Constants.SERVICE_WORKER_PATH}?v=${Constants.SIYUAN_VERSION}`);
         /// #endif
-        addScriptSync(`${Constants.PROTYLE_CDN}/js/lute/lute.min.js?v=${Constants.SIYUAN_VERSION}`, "protyleLuteScript");
-        addScript(`${Constants.PROTYLE_CDN}/js/protyle-html.js?v=${Constants.SIYUAN_VERSION}`, "protyleWcHtmlScript");
         addBaseURL();
 
         this.appId = Constants.SIYUAN_APPID;
@@ -145,6 +143,8 @@ export class App {
         };
 
         fetchPost("/api/system/getConf", {}, async (response) => {
+            addScriptSync(`${Constants.PROTYLE_CDN}/js/lute/lute.min.js?v=${Constants.SIYUAN_VERSION}`, "protyleLuteScript");
+            addScript(`${Constants.PROTYLE_CDN}/js/protyle-html.js?v=${Constants.SIYUAN_VERSION}`, "protyleWcHtmlScript");
             window.siyuan.config = response.data.conf;
             // 历史数据兼容，202306后可删除
             if (window.siyuan.config.uiLayout.left && !window.siyuan.config.uiLayout.left.data) {
diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts
index e915a50bf..44fa9874f 100644
--- a/app/src/protyle/render/av/render.ts
+++ b/app/src/protyle/render/av/render.ts
@@ -215,31 +215,33 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
                 setTimeout(() => {
                     e.firstElementChild.outerHTML = `<div class="av__container" style="--av-background:${e.style.backgroundColor || "var(--b3-theme-background)"}">
     <div class="av__header">
-        <div class="layout-tab-bar fn__flex">
-            ${tabHTML}
+        <div class="fn__flex">
+            <div class="layout-tab-bar fn__flex">
+                ${tabHTML}
+            </div>
             <div class="fn__space"></div>
-            <span data-type="av-add" class="block__icon">
+            <span data-type="av-add" class="block__icon fn__flex-center">
                 <svg><use xlink:href="#iconAdd"></use></svg>
             </span>
             <div class="fn__flex-1"></div>
             <div class="fn__space"></div>
-            <span data-type="av-switcher" class="block__icon${response.data.views.length > 0 ? "" : " fn__none"}">
+            <span data-type="av-switcher" class="block__icon fn__flex-center${response.data.views.length > 0 ? "" : " fn__none"}">
                 <svg><use xlink:href="#iconDown"></use></svg>
             </span>
             <div class="fn__space"></div>
-            <span data-type="av-filter" class="block__icon${data.filters.length > 0 ? " block__icon--active" : ""}">
+            <span data-type="av-filter" class="block__icon fn__flex-center${data.filters.length > 0 ? " block__icon--active" : ""}">
                 <svg><use xlink:href="#iconFilter"></use></svg>
             </span>
             <div class="fn__space"></div>
-            <span data-type="av-sort" class="block__icon${data.sorts.length > 0 ? " block__icon--active" : ""}">
+            <span data-type="av-sort" class="block__icon fn__flex-center${data.sorts.length > 0 ? " block__icon--active" : ""}">
                 <svg><use xlink:href="#iconSort"></use></svg>
             </span>
             <div class="fn__space"></div>
-            <span data-type="av-more" class="block__icon">
+            <span data-type="av-more" class="block__icon fn__flex-center">
                 <svg><use xlink:href="#iconMore"></use></svg>
             </span>
             <div class="fn__space"></div>
-            ${!response.data.isMirror ? ` <span class="block__icon block__icon--show ariaLabel" aria-label="${window.siyuan.languages.mirrorTip}">
+            ${response.data.isMirror ? ` <span class="block__icon fn__flex-center block__icon--show ariaLabel" aria-label="${window.siyuan.languages.mirrorTip}">
     <svg><use xlink:href="#iconSplitLR"></use></svg></span><div class="fn__space"></div>` : ""}
         </div>
         <div contenteditable="${protyle.disabled ? "false" : "true"}" spellcheck="${window.siyuan.config.editor.spellcheck.toString()}" class="av__title" data-title="${response.data.name || ""}" data-tip="${window.siyuan.languages.title}">${response.data.name || ""}</div>