import { Component } from "react";

export class Hero extends Component {
    render() {
        return (
            <div className="px-4 pt-5 my-5 bg-light text-center border-bottom">
                <h1 className="display-4 fw-bold">{this.props.title}</h1>
                <div className="col-lg-6 mx-auto">
                    <p className="lead mb-4">{this.props.text}</p>
                    <div className="d-grid gap-2 d-sm-flex justify-content-sm-center mb-5">
                        <button type="button" className="btn btn-primary btn-lg px-4 me-sm-3">Primary button</button>
                        <button type="button" className="btn btn-outline-secondary btn-lg px-4">Secondary</button>
                    </div>
                </div>
            </div>
        )
    }
}