blob: a3b6409a6181a1d3247dd6a798607f88457f9de4 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
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
|
