diff --git a/src/components/Page/Page.js b/src/components/Page/Page.js
index 593262d4..60fd2627 100644
--- a/src/components/Page/Page.js
+++ b/src/components/Page/Page.js
@@ -1,11 +1,13 @@
import React from 'react';
import Helmet from 'react-helmet';
+import { Topbar } from '../../containers';
export default (props) => {
const { className, title, children } = props;
return (
+
{ title }
{ children }
diff --git a/src/containers/Topbar/Topbar.css b/src/containers/Topbar/Topbar.css
new file mode 100644
index 00000000..b2c2f4ed
--- /dev/null
+++ b/src/containers/Topbar/Topbar.css
@@ -0,0 +1,13 @@
+.container {
+ display: flex;
+ background-color: #f9f9f9;
+ flex-direction: row;
+ width: 100vw;
+ height: 80px;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.link {
+ margin: 0 10px;
+}
diff --git a/src/containers/Topbar/Topbar.js b/src/containers/Topbar/Topbar.js
new file mode 100644
index 00000000..95a3ed70
--- /dev/null
+++ b/src/containers/Topbar/Topbar.js
@@ -0,0 +1,47 @@
+import React from 'react';
+import { Link } from 'react-router';
+import { fakeAuth } from '../../Routes';
+import css from './Topbar.css';
+
+
+const SignoutButton = (props) => {
+ const { router } = props;
+ const handleClick = () => {
+ fakeAuth.signout(() => {
+ router.transitionTo('/');
+ });
+ };
+ return ();
+};
+
+
+const Topbar = (props, context) => {
+ const linkProps = { className: css.link };
+
+ return (
+ Home
+ Search
+ Listing page
+ Profile
+ Edit profile
+ Checkout
+ Inbox
+ Orders
+ Sales
+ Request password
+ Change password
+ Manage listings
+ Account settings
+ Contact details
+ Notification settings
+ Payment methods
+ Payout preferences
+ Security
+
+
);
+};
+
+Topbar.contextTypes = { router: React.PropTypes.object };
+
+export default Topbar;
+
diff --git a/src/containers/index.js b/src/containers/index.js
index 3fb7b7b8..67bfe7bf 100644
--- a/src/containers/index.js
+++ b/src/containers/index.js
@@ -18,6 +18,7 @@ import SalesConversationPage from './SalesConversationPage/SalesConversationPage
import SearchPage from './SearchPage/SearchPage';
import SecurityPage from './SecurityPage/SecurityPage';
import NotFoundPage from './NotFoundPage/NotFoundPage';
+import Topbar from './Topbar/Topbar';
export {
AuthenticationPage,
@@ -40,4 +41,5 @@ export {
SearchPage,
SecurityPage,
NotFoundPage,
+ Topbar,
};