summaryrefslogtreecommitdiff
path: root/src/leap/bitmask_js/app/components/center.js
diff options
context:
space:
mode:
authorelijah <elijah@riseup.net>2016-08-26 21:09:53 -0700
committerKali Kaneko (leap communications) <kali@leap.se>2016-09-01 01:41:24 -0400
commit62f069ef0af1444089a4d477f05ac7279897fa32 (patch)
treebde623ee4ec8de240ed5504d3cdbc01c5d6755fc /src/leap/bitmask_js/app/components/center.js
parent50a258d45e851a865801da9d888037b5869a3489 (diff)
[feat] added initial bitmask_js (WIP)
Diffstat (limited to 'src/leap/bitmask_js/app/components/center.js')
-rw-r--r--src/leap/bitmask_js/app/components/center.js52
1 files changed, 52 insertions, 0 deletions
diff --git a/src/leap/bitmask_js/app/components/center.js b/src/leap/bitmask_js/app/components/center.js
new file mode 100644
index 00000000..a3b6409a
--- /dev/null
+++ b/src/leap/bitmask_js/app/components/center.js
@@ -0,0 +1,52 @@
+//
+// puts a block right in the center of the window
+//
+
+import React from 'react'
+
+const CONTAINER_CSS = {
+ position: 'absolute',
+ display: 'flex',
+ justifyContent: 'center',
+ alignContent: 'center',
+ alignItems: 'center',
+ top: "0px",
+ left: "0px",
+ height: "100%",
+ width: "100%"
+}
+
+const ITEM_CSS = {
+ flex: "0 1 auto"
+}
+
+class Center extends React.Component {
+
+ static get defaultProps() {return{
+ width: null
+ }}
+
+ constructor(props) {
+ super(props)
+ }
+
+ render() {
+ let style = this.props.width ? Object.assign({width: this.props.width + 'px'}, ITEM_CSS) : ITEM_CSS
+ return (
+ <div className="center-container" style={CONTAINER_CSS}>
+ <div className="center-item" style={style}>
+ {this.props.children}
+ </div>
+ </div>
+ )
+ }
+}
+
+Center.propTypes = {
+ children: React.PropTypes.oneOfType([
+ React.PropTypes.element,
+ React.PropTypes.arrayOf(React.PropTypes.element)
+ ])
+}
+
+export default Center