diff --git a/src/components/card.js b/src/components/card.js new file mode 100644 index 0000000..0117136 --- /dev/null +++ b/src/components/card.js @@ -0,0 +1,30 @@ +'use strict'; + +const _ = require('lodash'); +const React = require('react'); + +const defaultStyle = { + boxShadow: '0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)', + backgroundColor: 'white', + padding: '16px', + borderRadius: '2px' +}; + +class Card extends React.Component { + render(){ + const { + style = {}, + children + } = this.props; + + const styles = _.assign({}, defaultStyle, style); + + return ( +
+ {children} +
+ ); + } +} + +module.exports = Card; diff --git a/src/components/overlay.js b/src/components/overlay.js index fe3da93..abccb9b 100644 --- a/src/components/overlay.js +++ b/src/components/overlay.js @@ -2,7 +2,8 @@ const _ = require('lodash'); const React = require('react'); -const Card = require('react-material/components/Card'); + +const Card = require('./card'); const styles = { overlay: { @@ -31,7 +32,7 @@ class Overlay extends React.Component { } return ( - + {children} ); diff --git a/src/components/projects-button.js b/src/components/projects-button.js index 64b5eaa..defcb95 100644 --- a/src/components/projects-button.js +++ b/src/components/projects-button.js @@ -6,10 +6,9 @@ const { MainButton } = require('react-mfb-iceddev'); const styles = { changeFolderButton: { position: 'absolute', - top: -28, + top: 28, margin: 0, - right: 19, - left: 'auto', + left: 140, transform: 'none' } }; diff --git a/src/components/sidebar.js b/src/components/sidebar.js index 71ae27f..04a9644 100644 --- a/src/components/sidebar.js +++ b/src/components/sidebar.js @@ -1,7 +1,8 @@ 'use strict'; const React = require('react'); -const Card = require('react-material/components/Card'); + +const Card = require('./card'); const styles = { card: { @@ -20,7 +21,7 @@ class Sidebar extends React.Component { } = this.props; return ( - + {children} ); diff --git a/src/views/download-overlay.js b/src/views/download-overlay.js index 3274b6a..d801bfe 100644 --- a/src/views/download-overlay.js +++ b/src/views/download-overlay.js @@ -14,7 +14,9 @@ const ProgressBar = require('../components/progress-bar'); const styles = { overlay: { paddingBottom: 40, - width: 600 + width: 600, + // keep the download progress pinned to the bottom + position: 'relative' }, overlayFooter: { marginLeft: 0,