index.tsx

import * as React from "react"
import * as style from './style.scss'
export interface CardProps {
    backgroundBlock?: boolean; 
    headerImg?: boolean;
    style?: any; 
}

class Card extends React.Component<CardProps, {}> {
    static defaultProps = {
        backgroundBlock: true,
        headerImg: false,
        style: {}
    }

    render() {
        var contentStyle: any = {
            ...this.props.style
        }

        if (this.props.backgroundBlock) {
            contentStyle.background = 'rgba(2, 46, 98, .3)'
        }

        return <div className={style.content} style={contentStyle}>
            <div className={style.leftTop}></div>
            <div className={style.rightTop}></div>
            <div className={style.leftBottom}></div>
            <div className={style.rightBottom}></div>
            {
                this.props.headerImg 
                ? <div className={style.headerImg}></div>
                : null
            }
            {this.props.children}
        </div>
    }
}

export default Card;