import React from 'react'
import { Col,Button, Container ,Row} from 'reactstrap';
import top from '../assets/img/top.png'

const Top = ({isSignedIn}) => {
    return (
        <Container >
            <Row className="justify-content-center align-items-center">
                <Col xs="12" md="5" className="text-center animate__animated animate__slideInDown">
                <h5 className="orange">A Career Guidance Startup Aimed at providing Premium Career Guidance for Higher Secondary Students and also for UPSC/TNPSC Exams through Online.</h5>
            <br></br>
            {isSignedIn && <a href='/premiumservice'><Button className="btn btn-dark orange" style={{border:"none"}}>Register for Guidance</Button></a>}
            {!isSignedIn  && <a href='/'><Button className="btn btn-dark orange" style={{border:"none"}}>Register for Guidance</Button></a>}
                </Col>
                <Col xs="7" className="text-center d-md-block d-none animate__animated animate__slideInDown">
                <img className="img-fluid img-responsive" src={top} alt=""/>
                </Col>
            </Row>
        </Container>
    )
}

export default Top