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,