ptb-fe/pages/app/timeline.dikti.bak

                <div className="p-3">
                    <Row>
                        <Col xl="9">
                            <ul className="timeline">
                                <li className="timeline-separator" data-datetime="Today"></li>
                                <li className="timeline-inverted">
                                    <div className="timeline-badge info">
                                        <em className="far fa-file"></em>
                                    </div>
                                    <div className="timeline-card">
                                        <div className="popover right">
                                            <div className="arrow"></div>
                                            <div className="popover-body">
                                                <div className="d-flex align-items-center mb-3">
                                                    <img className="mr-3 rounded-circle thumb48" src="/static/img/user/admin.png" alt="Avatar"/>
                                                    <p className="m-0">
                                                        {/* <a className="text-muted" href=""> */}
                                                            <strong>Admin</strong>
                                                        {/* </a> */}
                                                        <br/>Upload Bukti Perbaikan 
                                                        {/* <em className="fa fa-paperclip"></em> */}
                                                        <Dropdown isOpen={this.state.dropdownOpenUpload} toggle={this.toggleDDUpload}>
                                                            {/* <em className="fa fa-graduation-cap fa-fw mr-3"></em>Status */}
                                                                {/* <p className="m-0"><br/> Upload Bukti Perbaikan </p> */}
                                                                <DropdownToggle caret color="link">
                                                                    <em className="fa fa-paperclip"></em>
                                                                </DropdownToggle>
                                                                <DropdownMenu className="animated fadeInUpShort">
                                                                    <DropdownItem>
                                                                        <em className="fa fa-lock mr-2"></em>Upload
                                                                    </DropdownItem>
                                                                </DropdownMenu>
                                                            </Dropdown>
                                                        </p> 
                                                        {/* <li> */}


                                                        {/* </li> */}
                                                </div>
                                                {/* <a href="">
                                                    <img className="img-fluid img-thumbnail" src="/static/img/mockup.png" alt="Img"/>
                                                </a> */}
                                                <p className="text-muted my-2">3 Logs</p>
                                                <div className="media bb p-2">
                                                    <img className="mr-2 rounded-circle thumb32" src="/static/img/user/user.png" alt="Avatar"/>
                                                    <div className="media-body">
                                                        <p className="m-0">
                                                            <a href="">
                                                                <strong>Universitas Username</strong>
                                                            </a>
                                                        </p>
                                                        <div className="text-sm text-muted">Uploaded Document File BBB.pdf</div>
                                                    </div>
                                                    <small className="ml-auto text-muted">12m ago</small>
                                                </div>
                                                <div className="media bb p-2">
                                                    <img className="mr-2 rounded-circle thumb32" src="/static/img/user/user.png" alt="Avatar"/>
                                                    <div className="media-body">
                                                        <p className="m-0">
                                                            <a href="">
                                                                <strong>Universitas Username</strong>
                                                            </a>
                                                        </p>
                                                        <div className="text-sm text-muted">Uploaded Document File CCC.pdf</div>
                                                    </div>
                                                    <small className="ml-auto text-muted">30m ago</small>
                                                </div>
                                                <div className="media bb p-2">
                                                    <img className="mr-2 rounded-circle thumb32" src="/static/img/user/user.png" alt="Avatar"/>
                                                    <div className="media-body">
                                                        <p className="m-0">
                                                            <a href="">
                                                                <strong>Universitas Username</strong>
                                                            </a>
                                                        </p>
                                                        <div className="text-sm text-muted">Uploaded Document File AAA.pdf</div>
                                                    </div>
                                                    <small className="ml-auto text-muted">30m ago</small>
                                                </div>
                                                {/* <form className="mt-2" method="post" action="#">
                                                    <textarea className="form-control no-resize" placeholder="Comment..." rows="1"></textarea>
                                                </form> */}
                                            </div>
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div className="timeline-badge danger">
                                        <em className="fas fa-ticket-alt"></em>
                                    </div>
                                    <div className="timeline-card">
                                        <div className="popover left">
                                            <div className="arrow"></div>
                                            <div className="popover-body">
                                                <div className="d-flex align-items-center mb-3">
                                                    <img className="mr-3 rounded-circle thumb48" src="/static/img/user/admin.png" alt="Avatar"/>
                                                    <p className="m-0">
                                                        {/* <a className="text-muted" href=""> */}
                                                            <strong>Admin</strong>
                                                        {/* </a> */}
                                                        <br/>opened project
                                                        <a className="ml-2" href="">#548795</a>
                                                    </p>
                                                </div>
                                                <p>
                                                    <em>&mdash; Project description sample</em>
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                                <li className="timeline-end">
                                    <a className="timeline-badge">
                                        <em className="fa fa-plus"></em>
                                    </a>
                                </li>
                            </ul>
                        </Col>
                        <Col xl="3">
                            <div className="card card-default">
                                <div className="card-body">
                                    <div className="text-center">
                                        <h3 className="mt-0">{this.props.data.nama}</h3>
                                        <p>{this.props.data.sk_pendirian}</p>
                                    </div>
                                    <hr/>
                                    <ul className="list-unstyled px-4">
                                        <li>
                                            <em className="fa fa-globe fa-fw mr-3"></em>{this.props.data.website}
                                        </li>
                                        <li>
                                            <em className="fa fa-graduation-cap fa-fw mr-3"></em>Status Pelanggaran : Tidak Ada
                                        </li>
                                        {/* <li>
                                            <Dropdown isOpen={this.state.dropdownOpen} toggle={this.toggleDD}>
                                            <em className="fa fa-graduation-cap fa-fw mr-3"></em>Status
                                            
                                                <DropdownToggle caret color="link">
                                                </DropdownToggle>
                                                <DropdownMenu className="animated fadeInUpShort">
                                                    <DropdownItem>
                                                        <em className="fa fa-lock mr-2"></em>Status Sample 1
                                                    </DropdownItem>
                                                    <DropdownItem>
                                                        <em className="fa fa-lock-open mr-2"></em>Status Sample 2
                                                    </DropdownItem>
                                                    <DropdownItem>
                                                        <em className="fa fa-low-vision mr-2"></em>Status Sample 3
                                                    </DropdownItem>
                                                </DropdownMenu>
                                            </Dropdown>
                                        </li> */}
                                        {/* <li>
                                            <em className="fa fa-graduation-cap fa-fw mr-3"></em>
                                            <div class="dropdown">
                                                <button type="button" aria-haspopup="true" aria-expanded="false" class="btn btn-secondary">Status
                                                </button>
                                                <div tabindex="-1" role="menu" aria-hidden="true" class="animated bounceInDown dropdown-menu"><button type="button" tabindex="0" class="dropdown-item">Action</button><button type="button" tabindex="0" class="dropdown-item">Another action</button><button type="button" tabindex="0" class="dropdown-item active">Active Item</button><div tabindex="-1" class="dropdown-divider"></div><button type="button" tabindex="0" class="dropdown-item">Separated link</button></div>
                                            </div>
                                        </li> */}
                                       {/* <li> */}
                                        {/* <em className="fa fa-graduation-cap fa-fw mr-3"></em> */}
                                                {/* <Dropdown isOpen={this.state.dropdownOpen} toggle={this.toggleDD}>
                                                <DropdownToggle caret color="link">
                                                    <em className="fa fa-paperclip">Status</em>
                                                </DropdownToggle>
                                                <DropdownMenu className="animated fadeInUpShort">
                                                    <DropdownItem>
                                                        <em className="fa fa-download mr-2"></em>Download
                                                    </DropdownItem>
                                                    <DropdownItem>
                                                        <em className="fa fa-share mr-2"></em>Send to
                                                    </DropdownItem>
                                                    <DropdownItem>
                                                        <em className="fa fa-times mr-2"></em>Delete
                                                    </DropdownItem>
                                                </DropdownMenu>
                                            </Dropdown> */}
                                        {/* </li> */}
                                    </ul>
                                </div>
                            </div>
                            
                        </Col>
                    </Row>
                </div>