From 58100ab82255af786223eaf0e004b8b4e3d0e523 Mon Sep 17 00:00:00 2001
From: kangfenmao <kangfenmao@qq.com>
Date: Thu, 20 Feb 2025 12:16:38 +0800
Subject: [PATCH] refactor: Simplify translation page layout and styling

---
 .../src/pages/translate/TranslatePage.tsx         | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/renderer/src/pages/translate/TranslatePage.tsx b/src/renderer/src/pages/translate/TranslatePage.tsx
index 4df3821ae1..2f26582288 100644
--- a/src/renderer/src/pages/translate/TranslatePage.tsx
+++ b/src/renderer/src/pages/translate/TranslatePage.tsx
@@ -4,7 +4,6 @@ import {
   HistoryOutlined,
   SendOutlined,
   SettingOutlined,
-  SwapOutlined,
   WarningOutlined
 } from '@ant-design/icons'
 import { Navbar, NavbarCenter } from '@renderer/components/app/Navbar'
@@ -267,10 +266,6 @@ const TranslatePage: FC = () => {
           />
         </InputContainer>
 
-        <Flex justify="center" align="center">
-          <SwapOutlined style={{ color: 'var(--color-text-2)' }} />
-        </Flex>
-
         <OutputContainer>
           <OperationBar>
             <Select
@@ -313,9 +308,9 @@ const Container = styled.div`
 const ContentContainer = styled.div<{ $historyDrawerVisible: boolean }>`
   height: calc(100vh - var(--navbar-height));
   display: grid;
-  grid-template-columns: auto 1fr 40px 1fr;
+  grid-template-columns: auto 1fr 1fr;
   flex: 1;
-  padding: 20px;
+  padding: 20px 15px;
   position: relative;
 `
 
@@ -328,6 +323,7 @@ const InputContainer = styled.div`
   border-radius: 10px;
   padding-bottom: 5px;
   padding-right: 2px;
+  margin-right: 15px;
 `
 
 const OperationBar = styled.div`
@@ -348,6 +344,9 @@ const Textarea = styled(TextArea)`
     resize: none;
     padding: 5px 16px;
   }
+  .ant-input-clear-icon {
+    font-size: 16px;
+  }
 `
 
 const OutputContainer = styled.div`
@@ -381,7 +380,7 @@ const HistoryContainner = styled.div<{ $historyDrawerVisible: boolean }>`
     opacity 0.2s;
   border: 1px solid var(--color-border-soft);
   border-radius: 10px;
-  margin-right: 20px;
+  margin-right: 15px;
   display: flex;
   flex-direction: column;
   overflow: hidden;