From 98b773fdc3d49b1503bcc5f827589b4423a573ea Mon Sep 17 00:00:00 2001
From: zuiidea <zuiiidea@gmail.com>
Date: Mon, 26 Feb 2018 19:13:12 +0800
Subject: [PATCH] logo text fadeIn

---
 src/components/Layout/Layout.less | 18 ++++++++++++++++++
 src/components/Layout/Menu.js     |  4 +++-
 src/components/Layout/Sider.js    |  2 +-
 3 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/src/components/Layout/Layout.less b/src/components/Layout/Layout.less
index 42c4fb6..483fa5b 100644
--- a/src/components/Layout/Layout.less
+++ b/src/components/Layout/Layout.less
@@ -75,6 +75,8 @@
   }
 }
 
+
+
 .logo {
   height: 96px;
   display: flex;
@@ -93,6 +95,10 @@
     display: inline-block;
     font-weight: 700;
     color: @primary-color;
+    :local {
+      animation: fadeLeftIn 400ms linear;
+      animation-fill-mode: both;
+    }
   }
 }
 
@@ -167,3 +173,15 @@
     }
   }
 }
+
+// @keyframes fadeLeftIn {
+//   0% {
+//     transform: translateX(20px);
+//     opacity: 0;
+//   }
+//
+//   100% {
+//     transform: translateX(0);
+//     opacity: 1;
+//   }
+// }
diff --git a/src/components/Layout/Menu.js b/src/components/Layout/Menu.js
index bcc22c0..5561410 100644
--- a/src/components/Layout/Menu.js
+++ b/src/components/Layout/Menu.js
@@ -5,7 +5,9 @@ import { Link } from 'react-router-dom'
 import { arrayToTree, queryArray } from 'utils'
 import pathToRegexp from 'path-to-regexp'
 
-const Menus = ({ siderFold, darkTheme, navOpenKeys, changeOpenKeys, menu, location }) => {
+const Menus = ({
+  siderFold, darkTheme, navOpenKeys, changeOpenKeys, menu, location,
+}) => {
   // 生成树状
   const menuTree = arrayToTree(menu.filter(_ => _.mpid !== '-1'), 'id', 'mpid')
   const levelMap = {}
diff --git a/src/components/Layout/Sider.js b/src/components/Layout/Sider.js
index 90f2952..cca60b6 100644
--- a/src/components/Layout/Sider.js
+++ b/src/components/Layout/Sider.js
@@ -20,7 +20,7 @@ const Sider = ({
     <div>
       <div className={styles.logo}>
         <img alt="logo" src={config.logo} />
-        {siderFold ? '' : <span>{config.name}</span>}
+        <span>{siderFold ? '' : config.name}</span>
       </div>
       <Menus {...menusProps} />
       {!siderFold ? <div className={styles.switchtheme}>