blob: e903e5f583f8720329e08f0987a95205e0c4d46a (
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
53
54
55
56
57
58
59
60
61
62
63
64
65
|
//
// A bootstrap panel, but with some extra options
//
import React from 'react'
// import {Panel} from 'react-bootstrap'
class Area extends React.Component {
static get defaultProps() {return{
position: null, // top or bottom
size: 'small', // small or big
type: null, // light or dark
className: null
}}
constructor(props) {
super(props)
}
render() {
let style = {}
let innerstyle = {}
if (this.props.position == 'top') {
style.borderBottomRightRadius = '0px'
style.borderBottomLeftRadius = '0px'
style.marginBottom = '0px'
style.borderBottom = '0px'
if (this.props.size == 'big') {
innerstyle.padding = '25px'
}
} else if (this.props.position == 'bottom') {
style.borderTopRightRadius = '0px'
style.borderTopLeftRadius = '0px'
style.borderTop = '0px'
if (this.props.size == 'big') {
innerstyle.padding = '15px 25px'
}
}
let type = this.props.type ? "area-" + this.props.type : ""
let className = ['panel', 'panel-default', type, this.props.className].join(' ')
return(
<div className={className} style={style}>
<div className="panel-body" style={innerstyle}>
{this.props.children}
</div>
</div>
)
}
}
// Area.propTypes = {
// children: React.PropTypes.oneOfType([
// React.PropTypes.element,
// React.PropTypes.arrayOf(React.PropTypes.element)
// ])
// }
//Area.propTypes = {
// children: React.PropTypes.element.isRequired
//}
export default Area
|