Implement Navbar using Bootstrap

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
<style type="text/css">
    .rounded {
        border-radius: 0.35rem !important;
    }

    .bg-nav-pills {
        background-color: #EEF2F7 !important;
    }

    .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
        color: #FFFFFE !important;
        background-color: #3688FC !important;
    }
</style>
<div class="container" style="padding-top:10px;">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    <div class="align-items-center d-sm-flex justify-content-sm-between mb-3">
                        <ul class="nav nav-pills bg-nav-pills p-1 rounded pull-right" id="pills-tab" role="tablist">
                            <li class="nav-item" role="presentation">
                                <a href="#day-status" data-bs-toggle="tab" aria-expanded="false" class="nav-link py-1 active">
                                    <span class="">Day</span>
                                </a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a href="#week-status" data-bs-toggle="tab" aria-expanded="false" class="nav-link py-1">
                                    <span class="">Week</span>
                                </a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a href="#month-status" data-bs-toggle="tab" aria-expanded="false" class="nav-link py-1">
                                    <span class="">Month</span>
                                </a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a href="#year-status" data-bs-toggle="tab" aria-expanded="false" class="nav-link py-1">
                                    <span class="">Year</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>