diff --git a/client/components/Footer/Footer.js b/client/components/Footer/Footer.js
index 5fabea62..a50fe4e1 100644
--- a/client/components/Footer/Footer.js
+++ b/client/components/Footer/Footer.js
@@ -43,9 +43,9 @@ class FootItem extends Component {
   render () {
     return (
       <div className = 'footItem'>
-        <h4><Icon type= { this.props.iconType } style={{ fontSize: 16 }} /> { this.props.title } </h4>
+        <h4><Icon type= { this.props.iconType } style={{ fontSize: 16 }} />&nbsp;&nbsp; { this.props.title } </h4>
         { this.props.linkList.map(function(item,i){
-          return (<div key = {i}><a href = { item.itemLink }><span>{ item.itemTitle }</span></a></div>);
+          return (<div key = {i}>&nbsp;&nbsp;<a href = { item.itemLink }><span>{ item.itemTitle }</span></a></div>);
         }) }
       </div>
     );
diff --git a/client/components/Footer/Footer.scss b/client/components/Footer/Footer.scss
index 521e2e6d..60c8cf6b 100644
--- a/client/components/Footer/Footer.scss
+++ b/client/components/Footer/Footer.scss
@@ -48,7 +48,7 @@
     }
     a{
         font-weight: 200;
-        color: #108ee9;
+        color: #b3bdc1;
         &:hover{
             color: white;
         }
diff --git a/client/components/Header/Header.js b/client/components/Header/Header.js
index 5f58aa3b..baf46932 100644
--- a/client/components/Header/Header.js
+++ b/client/components/Header/Header.js
@@ -146,15 +146,16 @@ export default class HeaderCom extends Component {
   }
   render () {
     const { login, user, msg, uid, curKey } = this.props;
-    const headerStyle = {
+    const headerImgStyle = login?{}:{
       'background': 'url(./image/header-bg-img.jpg) no-repeat',
       'backgroundSize':'100% 100%'
-    }
+    };
+    const headerShadeStyle = login?{}:{
+      'background': 'linear-gradient(to bottom,rgba(0,0,0,0.6),rgba(0,0,0,0.5))'
+    };
     return (
-      <acticle className={`header-box`} style={headerStyle}>
-        <Header style={{
-          background: "linear-gradient(to bottom,rgba(0,0,0,0.6),rgba(0,0,0,0.5))"
-        }}>
+      <acticle className={`header-box`} style={headerImgStyle}>
+        <Header style={headerShadeStyle}>
           <div className="content">
             <div className="logo">
               <Link to="/" onClick={this.relieveLink}>YAPI</Link>
diff --git a/client/components/Header/Header.scss b/client/components/Header/Header.scss
index 0c478555..510d199d 100644
--- a/client/components/Header/Header.scss
+++ b/client/components/Header/Header.scss
@@ -7,15 +7,6 @@ $color-blue-deeper: #34495E;
 $color-grey-deep : #929aac;
 $color-black-light : #404040;
 /* .header-box.css */
-
-//.light{
-//  background-color: #f7fafc;
-//  color: $color-blue;
-//}
-//.dark {
-//  background-color: $color-black-light;
-//  color: $color-white;
-//}
 .header-box {
   display: block;
   font-size: 0.14rem;
diff --git a/client/containers/ProjectGroups/GroupList/GroupList.scss b/client/containers/ProjectGroups/GroupList/GroupList.scss
index a201c99b..7db3c95f 100644
--- a/client/containers/ProjectGroups/GroupList/GroupList.scss
+++ b/client/containers/ProjectGroups/GroupList/GroupList.scss
@@ -45,6 +45,7 @@
       margin-right: 6px;
       flex-grow: 1;
     }
+
   }
   .group-list {
     max-height: 650px;