diff --git a/app/src/assets/scss/business/_block.scss b/app/src/assets/scss/business/_block.scss
index 4f51f8278..2299f82c1 100644
--- a/app/src/assets/scss/business/_block.scss
+++ b/app/src/assets/scss/business/_block.scss
@@ -117,6 +117,7 @@
       flex-shrink: 0;
     }
 
+    white-space: nowrap;
     margin-right: 8px;
     display: flex;
     align-items: center;
diff --git a/app/src/assets/scss/business/resize.scss b/app/src/assets/scss/business/_resize.scss
similarity index 100%
rename from app/src/assets/scss/business/resize.scss
rename to app/src/assets/scss/business/_resize.scss
diff --git a/app/src/assets/scss/business/_search.scss b/app/src/assets/scss/business/_search.scss
index 08ee279da..29841556d 100644
--- a/app/src/assets/scss/business/_search.scss
+++ b/app/src/assets/scss/business/_search.scss
@@ -73,26 +73,9 @@
   }
 
   &__label {
-    cursor: pointer;
-    flex: 1;
-
-    &:hover {
-      color: var(--b3-theme-on-background);
-    }
-
-    .b3-form__icon-input {
-      width: 0;
-      transition: var(--b3-transition);
-      border-color: transparent;
-      box-sizing: border-box;
-      padding-right: 0;
-
-      &:focus,
-      &.search__input--block {
-        width: 100%;
-        border-color: var(--b3-theme-primary);
-      }
-    }
+    position: absolute;
+    right: 8px;
+    z-index: 1;
   }
 
   &__preview {
diff --git a/app/src/layout/dock/Backlink.ts b/app/src/layout/dock/Backlink.ts
index 75814d688..5a9d6bf44 100644
--- a/app/src/layout/dock/Backlink.ts
+++ b/app/src/layout/dock/Backlink.ts
@@ -83,12 +83,11 @@ export class Backlink extends Model {
         <svg><use xlink:href="#iconLink"></use></svg>
         ${window.siyuan.languages.backlinks}
     </div>
-    <span class="counter listCount"></span>
+    <span class="counter listCount" style="margin-left: 0"></span>
+    <span class="fn__flex-1"></span>
     <span class="fn__space"></span>
-    <label class="b3-form__icon b3-form__icon--small search__label">
-        <svg class="b3-form__icon-icon"><use xlink:href="#iconFilter"></use></svg>
-        <input class="b3-text-field b3-text-field--small b3-form__icon-input" placeholder="${window.siyuan.languages.filterKeywordEnter}" />
-    </label>
+    <input class="b3-text-field search__label fn__none fn__size200" placeholder="${window.siyuan.languages.filterKeywordEnter}" />
+    <span data-type="search" class="block__icon b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.filter}"><svg><use xlink:href='#iconFilter'></use></svg></span>
     <span class="fn__space"></span>
     <span data-type="refresh" class="block__icon b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.refresh}"><svg><use xlink:href='#iconRefresh'></use></svg></span>
     <span class="fn__space"></span>
@@ -110,12 +109,11 @@ export class Backlink extends Model {
         <svg><use xlink:href="#iconLink"></use></svg>
         ${window.siyuan.languages.mentions}
     </div>
-    <span class="counter listMCount"></span>
+    <span class="counter listMCount" style="margin-left: 0;"></span>
+    <span class="fn__flex-1"></span>
     <span class="fn__space"></span>
-    <label class="b3-form__icon b3-form__icon--small search__label">
-        <svg class="b3-form__icon-icon"><use xlink:href="#iconFilter"></use></svg>
-        <input class="b3-text-field b3-text-field--small b3-form__icon-input" placeholder="${window.siyuan.languages.filterKeywordEnter}" />
-    </label>
+    <input class="b3-text-field search__label fn__none fn__size200" placeholder="${window.siyuan.languages.filterKeywordEnter}" />
+    <span data-type="search" class="block__icon b3-tooltips b3-tooltips__nw" aria-label="${window.siyuan.languages.filter}"><svg><use xlink:href='#iconFilter'></use></svg></span>
     <span class="fn__space"></span>
     <span data-type="mSort" data-sort="3" class="block__icon b3-tooltips b3-tooltips__nw" aria-label="${window.siyuan.languages.sort}"><svg><use xlink:href='#iconSort'></use></svg></span>
     <span class="fn__space"></span>
@@ -135,6 +133,10 @@ export class Backlink extends Model {
 
         this.inputsElement = this.element.querySelectorAll("input");
         this.inputsElement.forEach((item) => {
+            item.addEventListener("blur", (event: KeyboardEvent) => {
+                const inputElement = event.target as HTMLInputElement;
+                inputElement.classList.add("fn__none");
+            });
             item.addEventListener("keydown", (event: KeyboardEvent) => {
                 if (!event.isComposing && event.key === "Enter") {
                     this.searchBacklinks();
@@ -292,6 +294,10 @@ export class Backlink extends Model {
                         case "min":
                             getDockByType("backlink").toggleModel("backlink");
                             break;
+                        case "search":
+                            target.previousElementSibling.classList.remove("fn__none");
+                            (target.previousElementSibling as HTMLInputElement).select();
+                            break;
                         case "sort":
                         case "mSort":
                             this.showSortMenu(type, target.getAttribute("data-sort"));
diff --git a/app/src/layout/dock/Graph.ts b/app/src/layout/dock/Graph.ts
index 8f19ce2f5..b601ea522 100644
--- a/app/src/layout/dock/Graph.ts
+++ b/app/src/layout/dock/Graph.ts
@@ -259,10 +259,10 @@ export class Graph extends Model {
         <svg><use xlink:href="#icon${this.type === "global" ? "GlobalGraph" : "Graph"}"></use></svg>
         ${this.type === "global" ? window.siyuan.languages.globalGraph : window.siyuan.languages.graphView}
     </div>
-    <label class="b3-form__icon b3-form__icon--small search__label">
-        <svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg>
-        <input class="b3-form__icon-input b3-text-field b3-text-field--small" placeholder="${window.siyuan.languages.search}" />
-    </label>
+    <span class="fn__flex-1"></span>
+    <span class="fn__space"></span>
+    <input class="b3-text-field search__label fn__size200 fn__none" placeholder="${window.siyuan.languages.search}" />
+    <span data-type="search" class="block__icon b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.search}"><svg><use xlink:href='#iconFilter'></use></svg></span>
     <span class="fn__space"></span>
     <span data-type="refresh" class="block__icon b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.refresh}"><svg><use xlink:href='#iconRefresh'></use></svg></span>
     <div class="fn__space"></div>
@@ -314,6 +314,9 @@ export class Graph extends Model {
                             target.classList.add("ft__primary");
                             this.panelElement.style.right = "0";
                         }
+                    } else if (dataType === "search") {
+                        target.previousElementSibling.classList.remove("fn__none");
+                        (target.previousElementSibling as HTMLInputElement).select();
                     } else if (dataType === "refresh") {
                         this.searchGraph(false);
                     } else if (dataType === "fullscreen") {
@@ -334,6 +337,10 @@ export class Graph extends Model {
             this.searchGraph(false);
             this.inputElement.classList.add("search__input--block");
         });
+        this.inputElement.addEventListener("blur", (event: InputEvent) => {
+            const inputElement = event.target as HTMLInputElement;
+            inputElement.classList.add("fn__none");
+        });
         this.inputElement.addEventListener("input", (event: InputEvent) => {
             if (event.isComposing) {
                 return;