From c6ab7b9326ee94b8c1ef653fe681c3d7adbfd603 Mon Sep 17 00:00:00 2001
From: kangfenmao <kangfenmao@qq.com>
Date: Sun, 13 Apr 2025 11:00:07 +0800
Subject: [PATCH] style(MCPSettings): adjust layout and spacing in NpxSearch
 and MainContainer

- Updated MainContainer to use flex display for better layout.
- Increased margin in NpxSearch component for improved spacing.
- Adjusted ResultList to use two columns instead of three for better content presentation.
---
 .../src/pages/settings/MCPSettings/NpxSearch.tsx         | 9 ++++++---
 src/renderer/src/pages/settings/MCPSettings/index.tsx    | 1 +
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx b/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx
index 160a13ae..7154729e 100644
--- a/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx
+++ b/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx
@@ -117,8 +117,8 @@ const NpxSearch: FC<{
   return (
     <Container>
       <Center>
-        <Space direction="vertical" style={{ marginBottom: 20, width: 500 }}>
-          <Center style={{ marginBottom: 20 }}>
+        <Space direction="vertical" style={{ marginBottom: 25, width: 500 }}>
+          <Center style={{ marginBottom: 15 }}>
             <img src={npmLogo} alt="npm" width={100} />
           </Center>
           <Space.Compact style={{ width: '100%' }}>
@@ -231,6 +231,7 @@ const NpxSearch: FC<{
 
 const Container = styled.div`
   display: flex;
+  flex: 1;
   flex-direction: column;
   gap: 8px;
 `
@@ -238,11 +239,13 @@ const Container = styled.div`
 const ResultList = styled.div`
   flex: 1;
   display: grid;
-  grid-template-columns: repeat(3, 1fr);
+  grid-template-columns: repeat(2, 1fr);
   gap: 16px;
   width: 100%;
   padding-right: 4px;
   overflow-y: auto;
+  max-width: 1200px;
+  margin: 0 auto;
 `
 
 export default NpxSearch
diff --git a/src/renderer/src/pages/settings/MCPSettings/index.tsx b/src/renderer/src/pages/settings/MCPSettings/index.tsx
index 5f0e3d2d..e94d583a 100644
--- a/src/renderer/src/pages/settings/MCPSettings/index.tsx
+++ b/src/renderer/src/pages/settings/MCPSettings/index.tsx
@@ -244,6 +244,7 @@ const BackButtonContainer = styled.div`
 `
 
 const MainContainer = styled.div`
+  display: flex;
   flex: 1;
   width: 100%;
 `