bannerexample.js

import React, { Component } from 'react'
import styles from './HeroBanner.sass'
import classNames from 'classnames'

import banner from './imgs/banner.jpg'

class HeroBanner extends Component {
  render() {
    const banner = this.props.banner

    const inlineStyles = {
      HeroBanner: {
        backgroundImage: `url(${banner})`
      }
    }

    return (
      <div className={styles.HeroBanner} style={inlineStyles.HeroBanner}>
        <div className={styles.Overlay}></div>
          <div className={styles.Content}>
            <div className={styles.Message}>
              <h1>{this.props.children}</h1>
            </div>
            <a href="">
              <div className={styles.Action}>
                GET STARTED
              </div>
            </a>
        </div>
      </div>
    )
  }
}

export default HeroBanner