WIP: Pricing page

server/pages/components/Button.js

@@ -0,0 +1,15 @@
+// @flow
+import styled from 'styled-components';
+
+const Button = styled.a`
+  display: inline-flex;
+  align-items: center;
+  padding: 10px 20px;
+  color: ${props => props.theme.white};
+  background: ${props => props.theme.black};
+  border-radius: 4px;
+  font-weight: 600;
+  height: 56px;
+`;
+
+export default Button;

server/pages/components/Navigation.js

@@ -10,7 +10,7 @@ import { fadeAndScaleIn } from '../../../shared/styles/animations';
 import {
   developers,
   changelog,
-  features,
+  pricing,
   about,
   integrations,
   privacy,
@@ -42,18 +42,18 @@ function TopNavigation({ sessions, loggedIn }: Props) {
         <OutlineLogo size={18} fill="#000" />&nbsp;Outline
       </Brand>
       <Menu>
-        <MenuItemDesktop>
-          <a href={features()}>Features</a>
-        </MenuItemDesktop>
         <MenuItemDesktop>
           <a href={integrations()}>Integrations</a>
         </MenuItemDesktop>
+        <MenuItem>
+          <a href={pricing()}>Pricing</a>
+        </MenuItem>
         <MenuItemDesktop>
           <a href={changelog()}>Changelog</a>
         </MenuItemDesktop>
-        <MenuItem>
+        <MenuItemDesktop>
           <a href={developers()}>API</a>
-        </MenuItem>
+        </MenuItemDesktop>
         {loggedIn ? (
           <React.Fragment>
             {process.env.SUBDOMAINS_ENABLED === 'true' &&

server/pages/components/SigninButtons.js

@@ -1,6 +1,7 @@
 // @flow
 import * as React from 'react';
 import styled from 'styled-components';
+import Button from './Button';
 import { signin } from '../../../shared/utils/routeHelpers';
 import Flex from '../../../shared/components/Flex';
 import GoogleLogo from '../../../shared/components/GoogleLogo';
@@ -71,17 +72,6 @@ const Spacer = styled.span`
   padding-left: 10px;
 `;
 
-const Button = styled.a`
-  display: inline-flex;
-  align-items: center;
-  padding: 10px 20px;
-  color: ${props => props.theme.white};
-  background: ${props => props.theme.black};
-  border-radius: 4px;
-  font-weight: 600;
-  height: 56px;
-`;
-
 const LastLogin = styled.p`
   font-size: 13px;
   font-weight: 500;