From 7271a86677a552194f824c939b8988d22ff8dea8 Mon Sep 17 00:00:00 2001
From: kangfenmao <kangfenmao@qq.com>
Date: Wed, 8 Jan 2025 13:25:34 +0800
Subject: [PATCH] style: update container component styling and navbar
 responsiveness

---
 src/renderer/src/pages/home/Messages/NarrowLayout.tsx |  1 +
 src/renderer/src/pages/home/Navbar.tsx                | 10 ++++++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/renderer/src/pages/home/Messages/NarrowLayout.tsx b/src/renderer/src/pages/home/Messages/NarrowLayout.tsx
index e69a3f37..0e31753f 100644
--- a/src/renderer/src/pages/home/Messages/NarrowLayout.tsx
+++ b/src/renderer/src/pages/home/Messages/NarrowLayout.tsx
@@ -18,6 +18,7 @@ const NarrowLayout: FC<Props> = ({ children, ...props }) => {
 
 const Container = styled.div`
   max-width: 800px;
+  width: 100%;
   margin: 0 auto;
 `
 
diff --git a/src/renderer/src/pages/home/Navbar.tsx b/src/renderer/src/pages/home/Navbar.tsx
index c4b2b221..fe267100 100644
--- a/src/renderer/src/pages/home/Navbar.tsx
+++ b/src/renderer/src/pages/home/Navbar.tsx
@@ -82,9 +82,9 @@ const HeaderNavbar: FC<Props> = ({ activeAssistant }) => {
           <NavbarIcon onClick={() => SearchPopup.show()}>
             <SearchOutlined />
           </NavbarIcon>
-          <NavbarIcon onClick={() => dispatch(setNarrowMode(!narrowMode))}>
+          <NarrowIcon onClick={() => dispatch(setNarrowMode(!narrowMode))}>
             <i className="iconfont icon-icon-adaptive-width"></i>
-          </NavbarIcon>
+          </NarrowIcon>
           {sidebarIcons.visible.includes('minapp') && (
             <AppStorePopover>
               <NavbarIcon>
@@ -147,4 +147,10 @@ const TitleText = styled.span`
   }
 `
 
+const NarrowIcon = styled(NavbarIcon)`
+  @media (max-width: 800px) {
+    display: none;
+  }
+`
+
 export default HeaderNavbar