🎨 Style: [web]:修改背景色

front/.editorconfig

@@ -3,3 +3,4 @@ root = true
 end_of_line = lf
 insert_final_newline = true
 tab_width = 2
+indent_size = 2

front/.gitignore

@@ -23,3 +23,4 @@ yarn-debug.log*
 yarn-error.log*
 .vscode
 yarn.lock
+.idea

front/src/App.jsx

@@ -6,6 +6,7 @@ import { Provider } from "react-redux";
 import ClipboardJS from "clipboard";
 import store from "./redux";
 import NotFound from "./pages/public/notFound/NotFound";
+import UserSpace from './pages/userSpace';
 
 import Login from "./pages/public/Login";
 import RegisterOrReset from "./pages/public/RegisterOrReset";
@@ -40,9 +41,13 @@ class App extends Component {
       <Provider store={store}>
         <div className="fullScreen" style={mainStyle}>
           <Switch>
+
+            {/*书签管理页面*/}
             <Redirect exact path="/" to="/manage/overview"/>
             <Route exact path="/manage/overview" component={ManageOverview}/>
 
+            {/*个人中心页面*/}
+            <Route exact path="/userSpace" component={UserSpace}/>
             {/* 公共页面 */}
             <Route exact path="/public/login" component={Login}/>
             <Route exact path="/public/register" component={RegisterOrReset}/>

front/src/global.less

@@ -1 +1,2 @@
-@mainBgColor: #ffffff;
+@mainBgColor: #f6f6f6;
+@mainContentColor: #ffffff;

front/src/layout/MainLayout/index.jsx

@@ -55,6 +55,9 @@ class MainLayout extends React.Component {
   onClick = e => {
     const { history } = this.props;
     switch (e.key) {
+      case "personSpace":
+        history.push("/userSpace");
+        break;
       case "logout":
         this.props.logout();
         history.replace("/");
@@ -68,7 +71,9 @@ class MainLayout extends React.Component {
     return (
       <div className={"fullScreen " + styles.main}>
         <div className={styles.header}>
+          <a href="/">
             <img style={{ width: "1.5rem" }} src="/img/bookmarkLogo.png" alt="logo" />
+          </a>
           {this.renderUserArea()}
         </div>
         <Divider style={{ margin: 0 }} />

front/src/layout/MainLayout/index.module.less

@@ -8,6 +8,7 @@
     justify-content: space-between;
     align-items: center;
     padding: 0.1rem 0.5rem;
+    background-color: @mainContentColor;
   }
 
   .content {
@@ -18,7 +19,7 @@
     @media screen {
       width: 98%;
       @media (min-width: 768px) {
-        width: 80%;
+        width: 60%;
       }
 
       @media (max-width: 768px) {

front/src/pages/manage/OverView/index.jsx

@@ -104,6 +104,7 @@ class OverView extends React.Component {
                   收起
                 </Button>
               ) : null}
+              <a className={styles.help} href="https://github.com/FleyX/bookmark/blob/master/README.md">使用帮助</a>
             </div>
             <div className={styles.right}>
               {isEdit ? (

front/src/pages/manage/OverView/index.module.less

@@ -1,5 +1,9 @@
+@import "../../../global.less";
+
 .main {
-  min-height: 100%;
+  // min-height: 100%;
+  background-color: @mainContentColor;
+  padding: 20px;
 
   .header {
     display: flex;
@@ -15,6 +19,11 @@
         line-height: 1.3em;
         font-weight: 600;
       }
+
+      .help {
+        font-size: 0.6em;
+        align-self: flex-end;
+      }
     }
   }
 

front/src/pages/userSpace/index.jsx

@@ -0,0 +1,20 @@
+import React from "react";
+import styles from "./index.module.less";
+import MainLayout from "../../layout/MainLayout";
+
+class UserSpace extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  render() {
+    return (
+      <MainLayout>
+        <div className={styles.main}>你好</div>
+      </MainLayout>
+    );
+  }
+}
+
+export default UserSpace;

front/src/pages/userSpace/index.module.less

@@ -0,0 +1,3 @@
+.main{
+  
+}