From 385c6d6aab48fadeda2c79fefbe4ec9308cc6a10 Mon Sep 17 00:00:00 2001
From: kangfenmao <kangfenmao@qq.com>
Date: Tue, 29 Jul 2025 18:08:00 +0800
Subject: [PATCH] Revert "feat(contentsearch): optimize searchbar UI (#8556)"

This reverts commit eb309563a9226ffa7e162c6b59929853a8b1afdc.
---
 src/renderer/src/components/ContentSearch.tsx | 26 ++++++-------------
 1 file changed, 8 insertions(+), 18 deletions(-)

diff --git a/src/renderer/src/components/ContentSearch.tsx b/src/renderer/src/components/ContentSearch.tsx
index 499323d39a..6842312137 100644
--- a/src/renderer/src/components/ContentSearch.tsx
+++ b/src/renderer/src/components/ContentSearch.tsx
@@ -1,5 +1,3 @@
-import { useSettings } from '@renderer/hooks/useSettings'
-import { useShowTopics } from '@renderer/hooks/useStore'
 import { ToolbarButton } from '@renderer/pages/home/Inputbar/Inputbar'
 import NarrowLayout from '@renderer/pages/home/Messages/NarrowLayout'
 import { Tooltip } from 'antd'
@@ -128,8 +126,6 @@ const findRangesInTarget = (
 // eslint-disable-next-line @eslint-react/no-forward-ref
 export const ContentSearch = React.forwardRef<ContentSearchRef, Props>(
   ({ searchTarget, filter, includeUser = false, onIncludeUserChange }, ref) => {
-    const { topicPosition } = useSettings()
-    const { showTopics } = useShowTopics()
     const target: HTMLElement | null = (() => {
       if (searchTarget instanceof HTMLElement) {
         return searchTarget
@@ -337,12 +333,10 @@ export const ContentSearch = React.forwardRef<ContentSearchRef, Props>(
       searchInputFocus()
     }
 
-    const isRightTopicsVisible = topicPosition === 'right' && showTopics
-
     return (
       <Container ref={containerRef} style={enableContentSearch ? {} : { display: 'none' }}>
         <NarrowLayout style={{ width: '100%' }}>
-          <SearchBarContainer $isRightTopicsVisible={isRightTopicsVisible}>
+          <SearchBarContainer>
             <InputWrapper>
               <Input
                 ref={searchInputRef}
@@ -411,18 +405,14 @@ const Container = styled.div`
   z-index: 2;
 `
 
-const SearchBarContainer = styled.div<{ $isRightTopicsVisible: boolean }>`
+const SearchBarContainer = styled.div`
   border: 1px solid var(--color-primary);
   border-radius: 10px;
   transition: all 0.2s ease;
   position: fixed;
-  top: 30px;
-  left: 50%;
-  transform: translateX(-50%);
-  width: ${(props) =>
-    props.$isRightTopicsVisible
-      ? 'min(60%, calc(100vw - 400px))'
-      : 'min(60%, calc(100vw - 140px))'}; /* 容器2/3宽度，并考虑右侧避让 */
+  top: 15px;
+  left: 20px;
+  right: 20px;
   margin-bottom: 5px;
   padding: 5px 15px;
   display: flex;
@@ -458,7 +448,7 @@ const ToolBar = styled.div`
   display: flex;
   flex-direction: row;
   align-items: center;
-  gap: 2px;
+  gap: tpx;
 `
 
 const Separator = styled.div`
@@ -473,8 +463,8 @@ const Separator = styled.div`
 const SearchResults = styled.div`
   display: flex;
   justify-content: center;
-  width: 60px;
-  margin: 0 1px;
+  width: 80px;
+  margin: 0 2px;
   flex: 0 0 auto;
   color: var(--color-text-1);
   font-size: 14px;