import * as React from "react";

interface IProps {
    title: string;
    subtitle: string;
    description: string;
    image: string;
    viewButton: React.ReactElement<any>;
    contactButton: React.ReactElement<any>;
}

export class AboutHome extends React.Component<IProps> {
  public render(): JSX.Element {
    return (
        <div className="about_section afclr">
            <div className="about_bg afclr">
                <img src={this.props.image}/>
            </div>
            <div className="container">
                <div className="about_left afclr">
                    <div className="col-lg-6 col-md-12 col-sm-12">
                        <div className="heading">
                            <h2>{this.props.title}</h2>
                        </div>
                        <div className="heading">
                            <h1>{this.props.subtitle}</h1>
                        </div>
                        {/* tslint:disable-next-line */}
                        <div dangerouslySetInnerHTML={{__html: this.props.description}} />
                        <div className="about_btn afclr">
                            <div className="abt_btn1">
                                {this.props.viewButton}
                            </div>
                            <div className="abt_btn2">
                                {this.props.contactButton}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
          );
  }
}