add header content

Author: chnbohwr

src/containers/Home/Content.js

@@ -0,0 +1,11 @@
+import React, { Component } from 'react';
+
+export default class Content extends Component {
+  render() {
+    return (
+      <div>
+        this is content
+      </div>
+    );
+  }
+}

src/containers/Home/Header.js

@@ -0,0 +1,12 @@
+import React, { Component } from 'react';
+import logo from './logo7.png';
+
+export default class Header extends Component {
+  render() {
+    return (
+      <div className="header">
+        <img alt="logoHeader" src={logo} />
+      </div>
+    );
+  }
+}

src/containers/Home/Home.js

@@ -1,12 +1,14 @@
 import React, { Component } from 'react';
-
+import Header from './Header.js';
+import Content from './Content.js';
 import './Home.less';
 
 export default class Home extends Component {
   render() {
     return (
       <div id="pageHome">
-        this is home page
+        <Header />
+        <Content />
       </div>
     );
   }

src/containers/Home/Home.less

@@ -1,3 +1,28 @@
 #pageHome{
+  color: #555;
+ .header{
+   height: 80px;
+   display: flex;
+   justify-content: flex-start;
+   align-items: center;
+   flex-direction: row;
+   background-color: #333;
+   padding: 0 10px;
+   img{
+    height: 70px;
+    animation: rotate 15s infinite;
+   }
+ }
+}
 
+@keyframes rotate {
+  0%{
+    transform: rotateY(0);
+  }
+  10%{
+    transform: rotateY(360deg);
+  }
+  100%{
+    transform: rotateY(360deg);
+  }
 }