diff --git a/src/components/Recommend/Recommend.css b/src/components/Recommend/Recommend.css
index aa2115d..e9dfda3 100644
--- a/src/components/Recommend/Recommend.css
+++ b/src/components/Recommend/Recommend.css
@@ -16,7 +16,7 @@
 
 .outerWrapper {
     opacity: 0;
-    animation: zoomIn 1.5s ease forwards;
+    animation: zoomIn 2s ease forwards;
     width: 100%;
     height: 100%;
 }
@@ -73,6 +73,6 @@
 }
 
 @keyframes zoomIn {
-    from {opacity: 0; transform: scale(1.05) }
-    to {opacity: 1; transform: scale(1)}
+    from {opacity: 0; transform: scale(1.02); filter: grayscale(1); }
+    to {opacity: 1; transform: scale(1);  filter: grayscale(0);}
 }
\ No newline at end of file
diff --git a/src/components/Recommend/Recommend.jsx b/src/components/Recommend/Recommend.jsx
index 474cd99..7fcdc16 100644
--- a/src/components/Recommend/Recommend.jsx
+++ b/src/components/Recommend/Recommend.jsx
@@ -78,7 +78,7 @@ class Recommend extends React.Component {
                             </div>
                         </Scrollbars>
                     </div>
-                    : <div className={styles.empty}><Spinner /></div>
+                    : <div className={styles.empty}><Spinner color="#fff" /></div>
                 }
                 
             </div>
diff --git a/src/reducers/layouts.js b/src/reducers/layouts.js
index 34c1cb8..f2bfe9c 100644
--- a/src/reducers/layouts.js
+++ b/src/reducers/layouts.js
@@ -23,7 +23,7 @@ export default (state = initialState, action) => {
         case layoutsActions.CHAT:
             return {
                 ...state,
-                chat: action.payload
+                chat: action.payload || !state.chat
             }
 
         default: