# Views

import PageContainer from "../UIElements/Containers";
import PageBreadcrumb from "../UIElements/Breadcrumb";
import PageScroll from "../UIElements/PageScroll";

<div className="jumbotron" data-pages="parallax">
    <PageContainer
        className={
            path.includes("/executive") || path.includes("/casual")
                ? "container"
                : " "
        }
    >
        <PageScroll>
            <PageBreadcrumb>
                <li>
                    <a href="#" className="active">
                        Views
                    </a>
                </li>
            </PageBreadcrumb>
            <div className="container-md-height m-b-20">
                <div className="row">
                    <div className="col-xl-7 col-lg-6 bg-white">
                        <div className="full-height">
                            <div className="card-body text-center">
                                <img
                                    className="demo-mw-500"
                                    src="../assets/img/demo/views_animation.gif"
                                    alt=""
                                />
                            </div>
                        </div>
                    </div>
                    <div className="col-xl-5 col-lg-6 col-top">
                        <div className="card card-transparent">
                            <div className="card-header ">
                                <div className="card-title">Getting started</div>
                            </div>
                            <div className="card-body">
                                <h3>Sometimes small things matter the most in life!</h3>
                                <p>
                                    Views are pre-made view ports which comes in handy for
                                    HTML5 mobile hybrid apps, These elements help in the
                                    navigation of your app with a touch of some cool
                                    pre-built animations, see the demo below
                                </p>
                                <br />
                                <div>
                                    <div className="profile-img-wrapper m-t-5 inline">
                                        <img
                                            width="35"
                                            height="35"
                                            src="../assets/img/profiles/avatar_small.jpg"
                                            alt=""
                                            data-src="../assets/img/profiles/avatar_small.jpg"
                                            data-src-retina="assets/img/profiles/avatar_small2x.jpg"
                                        />
                                        <div className="chat-status available"></div>
                                    </div>
                                    <div className="inline m-l-10">
                                        <p className="small hint-text m-t-5">
                                            VIA senior product manage
                                            <br /> for UI/UX at REVOX
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </PageScroll>
    </PageContainer>
</div>