左侧栏初步

src/pages/dashboard/Dashboard.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+import styles from "./Dashboard.module.css";
+
+export const Dashboard: React.FC<any> = () => {
+  return (
+    <div>
+      <p>首頁概況</p>
+    </div>
+  );
+};

src/pages/dashboard/index.ts

@@ -0,0 +1 @@
+export * from "./Dashboard";

src/pages/home/HomePage.module.css

@@ -1,14 +1,6 @@
-.page-content {
-  width: 1200px;
-  min-height: calc(100vh - 173px);
-  margin-left: auto;
-  margin-right: auto;
-  margin-top: 30px;
-  margin-bottom: 100px;
-}
-
 .layout-wrap {
   width: 100%;
+  height: 100vh;
   display: flex;
 }
 
@@ -21,3 +13,16 @@
   display: flex;
   flex-direction: column;
 }
+
+.right-top {
+  width: 100%;
+  height: 48px;
+}
+
+.right-main {
+  flex: 1;
+  box-sizing: border-box;
+  padding: 24px;
+  overflow-y: auto;
+  background-color: #f1f2f9;
+}

src/pages/index.ts

@@ -1,2 +1,3 @@
 export * from "./home";
-export * from "./login";
+export * from "./login";
+export * from "./dashboard";