Removed custom Flex component

frontend/components/Flex.js

@@ -1,34 +0,0 @@
-import React from 'react';
-
-const Flex = (props) => {
-  const style = {
-    display: 'flex',
-    flex: props.flex ? '1' : null,
-    flexDirection: props.direction,
-    justifyContent: props.justify,
-    alignItems: props.align,
-  };
-
-  return (
-    <div style={ style } {...props}>
-      { props.children }
-    </div>
-  );
-};
-
-Flex.defaultProps = {
-  direction: 'row',
-  justify: null,
-  align: null,
-  flex: null,
-};
-
-Flex.propTypes = {
-  children: React.PropTypes.node,
-  direction: React.PropTypes.string,
-  justify: React.PropTypes.string,
-  align: React.PropTypes.string,
-  flex: React.PropTypes.bool,
-};
-
-export default Flex;

frontend/components/Layout/Layout.js

@@ -6,7 +6,7 @@ import keydown from 'react-keydown';
 import _ from 'lodash';
 
 import DropdownMenu, { MenuItem } from 'components/DropdownMenu';
-import Flex from 'components/Flex';
+import { Flex } from 'reflexbox';
 import LoadingIndicator from 'components/LoadingIndicator';
 import Alert from 'components/Alert';
 import { Avatar } from 'rebass';
@@ -66,7 +66,7 @@ class Layout extends React.Component {
               { this.props.title && (<span>&nbsp;/&nbsp;</span>) }{ this.props.title }
             </span>
           </div>
-          <Flex direction="row" className={ styles.headerRight }>
+          <Flex className={ styles.headerRight }>
             <Flex align="center" className={ styles.actions }>
               { this.props.actions }
             </Flex>

frontend/components/PublishingInfo/PublishingInfo.js

@@ -2,7 +2,7 @@ import React from 'react';
 import moment from 'moment';
 
 import { Avatar } from 'rebass';
-import Flex from 'components/Flex';
+import { Flex } from 'reflexbox';
 
 import styles from './PublishingInfo.scss';
 
@@ -29,4 +29,4 @@ PublishingInfo.propTypes = {
   updatedAt: React.PropTypes.string.isRequired,
 };
 
-export default PublishingInfo;
+export default PublishingInfo;