Create application's header

Related to issue #7

Signed-off-by: Lucas Amoêdo <[email protected]>

package.json

@@ -4,8 +4,12 @@
   "private": true,
   "main": "./src/index.jsx",
   "dependencies": {
+    "bootstrap": "^3.3.7",
+    "jquery": "^3.2.1",
     "react": "^15.4.2",
-    "react-dom": "^15.4.2"
+    "react-dom": "^15.4.2",
+    "react-router": "^4.0.0",
+    "react-router-dom": "^4.0.0"
   },
   "devDependencies": {
     "eslint": "^3.18.0",

src/App.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import Header from './Header';
+
+const App = function App() {
+  return (
+    <div>
+      <Header />
+      <h1>App</h1>
+    </div>
+  );
+};
+
+export default App;

src/Header.css

@@ -0,0 +1,21 @@
+.navbar.techvet-navbar {
+    text-align: center;
+    background: #70ad47;
+    color: white;
+    box-shadow: 1px 5px 5px 1px rgba(136,144, 130, 1);
+    border: none;
+    border-radius: 0;
+    height: 48px;
+}
+.navbar.techvet-navbar h1 {
+    display: inline-block;
+    font-size: 19px;
+    margin-top: 15px;
+}
+.btn.techvet-button {
+    font-size: 20px;
+    padding: 10px 12px;
+    color: white;
+    border: none;
+    background: none;
+}

src/Header.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import './Header.css';
+
+
+const Header = function header() {
+  return (
+    <div className="navbar navbar-default techvet-navbar">
+      <div className="container">
+        <h1>TECH Vet</h1>
+        <ul className="nav navbar-nav pull-right">
+          <li>
+            <button className="btn btn-default techvet-button" type="button">
+              <i className="glyphicon glyphicon-cog" />
+            </button>
+          </li>
+          <li><button className="btn btn-default techvet-button" type="button">Sair</button></li>
+        </ul>
+      </div>
+    </div>
+  );
+};
+
+export default Header;

src/index.js

@@ -1,10 +1,12 @@
 /* eslint-env browser */
 /* global document */
 
+import 'bootstrap/dist/css/bootstrap.css';
 import React from 'react';
 import ReactDOM from 'react-dom';
+import App from './App';
 
 ReactDOM.render(
-  <h1>Hello, world</h1>,
-document.getElementById('root'),
+  <App />,
+  document.getElementById('root'),
 );