dashboard.php

<div class="fixed-top">
<a href="#offcanvas-slide" class="uk-button uk-button-danger text-white uk-button-large" uk-toggle><strong>MENU</strong></a>

<div id="offcanvas-slide" uk-offcanvas>
    <div class="uk-offcanvas-bar">

        <ul class="uk-nav uk-nav-default">
            <li class="uk-active">
            <img class="img-fluid" src="assets/images/topos.png"/>
            </li>
            <li>
            <img class="img-fluid" src="assets/images/tpos.png"/>
            </li>
            <li class="uk-nav-divider"></li>
            <li class="uk-nav-header uk-active">
            <a href="index.php">
            <span uk-icon="home"></span>
            Home</a></li>
            <li class="uk-nav-divider"></li>
            <li class="uk-nav-header uk-active">
            <a href="?hal=dbs">
            <span uk-icon="database"></span>
            Databased</a>
            </li>
           <!-- <li><a href="#">Item</a></li>
            <li><a href="#">Item</a></li>
            <li class="uk-nav-divider"></li>
            <li><a href="#">Item</a></li>-->
            <li class="uk-nav-divider"></li>
            <li class="uk-nav-header uk-active">
            <a href="?hal=sale">
            <span uk-icon="cart"></span>
            POINT OF SALE</a>
            </li>
            <li class="uk-nav-divider"></li>
            <li class="uk-nav-header uk-active">
            <a href="?hal=lap">
            <span uk-icon="desktop"></span>
            REPORT DETAIL'S</a>
            </li>
            <li class="uk-nav-divider"></li>
            <li class="uk-nav-header uk-active">
            <a href="logout.php">
            <span uk-icon="sign-out"></span>
            SHUT DOWN</a>
            </li>
            <li class="uk-nav-divider"></li>
        </ul>
<!--
       <p>
<small>Modern point of sale web app<br/>
<a href="https://mesinkasironline.web.app">
https://mesinkasironline.web.app</a>
</small>
</p>
-->
    </div>
</div>
</div>
<div class="masthead-followup row m-0 text-center">
<!--<div class="col-12 col-md-12 p-0 p-md-0">
<img class="img-fluid" src="assets/images/topos.png"/>
       <br/>
       <img class="img-fluid" src="assets/images/tpos.png"/>
       </div>-->
       <div class="col-12 col-md-12 p-0 p-md-3 bg-white ">

       <div uk-slider="center: true">

<div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1">

    <ul class="uk-slider-items uk-child-width-1-2@s uk-grid">
        <li>
            <div class="uk-card uk-card-default">
                <div class="uk-card-media-top">
                <img class="img-fluid" src="assets/images/db.png"/>
                </div>
                <div class="uk-card-body">
                <a class="uk-button uk-button-large btn-rouded-pill btn-block btn-danger text-white" href="?hal=dbs">
                    <strong>
                    DATABASED
                    </strong>
                    </a>
                </div>
            </div>
        </li>
        <li class="active">
            <div class="uk-card uk-card-default">
                <div class="uk-card-media-top">
                <img class="img-fluid" src="assets/images/POS.png"/>
                </div>
                <div class="uk-card-body">
                <a class="uk-button uk-button-large btn-rouded-pill btn-block btn-danger text-white" href="?hal=sale">
                    <strong>
                    POINT OF SALE
                    </strong>
                    </a>
                </div>
            </div>
        </li>
        <li>
            <div class="uk-card uk-card-default">
                <div class="uk-card-media-top">
                <img class="img-fluid" src="assets/images/report.png"/>
                </div>
                <div class="uk-card-body">
                <a class="uk-button uk-button-large btn-rouded-pill btn-block btn-danger text-white" href="?hal=lap">
                    <strong>
                    ALL REPORT DETAILS
                    </strong>
                    </a>
                </div>
            </div>
        </li>
      <li>
            <div class="uk-card uk-card-default">
                <div class="uk-card-media-top">
                <img class="img-fluid" src="assets/images/off.png"/>
                </div>
                <div class="uk-card-body">
                    <a class="uk-button uk-button-large btn-rouded-pill btn-block btn-danger text-white" href="logout.php">
                    <strong>
                    LOG OUT
                    </strong>
                    </a>
                </div>
            </div>
        </li>
    </ul>

    <a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#" uk-slidenav-previous uk-slider-item="previous"></a>
    <a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#" uk-slidenav-next uk-slider-item="next"></a>

</div>

<ul class="uk-slider-nav uk-dotnav uk-flex-center uk-margin"></ul>
</div>
</div>
</div>
<div class="col-12 col-md-12 p-3 p-md-3 bg-white ">
<p>Welcome to TOPOS Toko Point of sale modern web app technology.</p>
</div>
</div>