From 658ef115553111b4d011199e80bf0ab65faa5ed4 Mon Sep 17 00:00:00 2001
From: orzyyyy <zy410419243@gmail.com>
Date: Sun, 25 Aug 2019 18:42:16 +0800
Subject: [PATCH] feat: make Sider collapsible

---
 src/pages/MainPage.tsx                                  | 2 +-
 src/pages/__tests__/__snapshots__/MainPage.test.js.snap | 2 ++
 src/pages/css/MainPage.css                              | 4 ++++
 3 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/pages/MainPage.tsx b/src/pages/MainPage.tsx
index f135271c1..5a478e2d9 100644
--- a/src/pages/MainPage.tsx
+++ b/src/pages/MainPage.tsx
@@ -96,7 +96,7 @@ export default class MainPage extends Component<MainPageProps, MainPageState> {
     const { menuData } = this.props;
     const { siderSelectedKey } = this.state;
     return (
-      <Sider theme="light">
+      <Sider theme="light" collapsible collapsedWidth={0}>
         <Menu
           selectedKeys={[siderSelectedKey]}
           mode="inline"
diff --git a/src/pages/__tests__/__snapshots__/MainPage.test.js.snap b/src/pages/__tests__/__snapshots__/MainPage.test.js.snap
index d8a5de4e8..eb60ccc6f 100644
--- a/src/pages/__tests__/__snapshots__/MainPage.test.js.snap
+++ b/src/pages/__tests__/__snapshots__/MainPage.test.js.snap
@@ -5,6 +5,8 @@ exports[`MainPage render correctly 1`] = `
   className="MainPage"
 >
   <Sider
+    collapsedWidth={0}
+    collapsible={true}
     theme="light"
   >
     <Menu
diff --git a/src/pages/css/MainPage.css b/src/pages/css/MainPage.css
index fd40b620d..3d299fce3 100644
--- a/src/pages/css/MainPage.css
+++ b/src/pages/css/MainPage.css
@@ -17,3 +17,7 @@
   background: #e6f7ff;
   transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
 }
+
+.MainPage .ant-layout-sider-zero-width-trigger {
+  top: calc(100vh - 65px);
+}