Forward_Station_Server/nav.php

<header class="main-header">
   
    <!-- Header Navbar: style can be found in header.less -->
    <nav class="navbar navbar-static-top">
      <!-- Sidebar toggle button-->
      <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
        <span class="sr-only">Toggle navigation</span>
      </a>

      <div class="navbar-custom-menu">
        <ul class="nav navbar-nav">
          <!-- User Account: style can be found in dropdown.less -->
        <!--   <li><h5 style="color:#fff;text-align: center;font-size: 24px;font-family: 'Lobster', helvetica, arial;">Forward&nbsp;&nbsp;&nbsp; Station&nbsp;&nbsp;&nbsp; Server</h5></li>
         -->  <li class="dropdown user user-menu pull-right">
            <a href="#" class="dropdown-toggle mind" data-toggle="dropdown">
              <img src="dist/img/profile.jpg" class="user-image" alt="User Image">
              <span class="hidden-xs" style="color: white;">Admin</span>
            </a>
            <ul class="dropdown-menu">
              <!-- User image -->
              <li class="user-header">
                <img src="dist/img/profile.jpg" class="img-circle" alt="User Image">

                <p>
                  
                  <small>Member since Nov. 2012</small>
                </p>
              </li>
              <!-- Menu Footer-->
              <li class="user-footer">
                <div class="pull-left">
                  <a href="#" class="btn btn-default btn-flat">Profile</a>
                </div>
                <div class="pull-right">
                  <a href="logout.php" class="btn btn-default btn-flat">Sign out</a>
                </div>
              </li>
            </ul>
          </li>
        </ul>
      </div>
    </nav>
  </header>
  <!-- Left side column. contains the logo and sidebar -->
  <aside class="main-sidebar">
    <!-- sidebar: style can be found in sidebar.less -->
    <section class="sidebar">
      <!-- Sidebar user panel -->

      <div class="user-panel">
        <div class="pull-left image">
            <img src="dist/img/Autoleum Logo.jpg" class="-circle" alt="User Image">
        </div>
        <div class="pull-left info">
          <p style="color: #1fb9bb;margin-top: 10px;font-size:25px;font-family: 'Lobster', helvetica, arial;">Autoleum</p>
        </div>
      </div>
      <ul class="sidebar-menu" data-widget="tree" style="background:#c1cbd0;" id="mainNavMenu">
        <li class="header">MAIN NAVIGATION</li>
        <li class="active treeview" >
          <a href="#"  style="margin-bottom: 20px;">
            <i class="fa fa-calculator " style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp; <span>Operations</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li style="margin-top: 20px;"><a href="shifts.php" class="collapse-item"><i class="far fa-calendar-alt" style="font-size:15px;"></i>&nbsp; Shifts</a></li>
            <li> <a href="#" class="collapse-item" onclick="changePages('sales.php');"><i class="fa fa-industry"></i>&nbsp; Sales</a></li>
           <li><a href="#" class="collapse-item" onclick="changePages('updatePrices.php');"><i class="fas fa-money-check-alt"></i>&nbsp; Update Prices</a></li>
            <li><a href="#" class="collapse-item" onclick="changePages('deliveries.php');"><i class="fas fa-truck"></i>&nbsp; Deliveries</a></li>
            <li> <a href="#" class="collapse-item" onclick="changePages('about.php');"><i class="fas fa-award"></i>&nbsp; About</a></li>   
          </ul>
        </li>
        <li class="treeview" style="color:cyan;">
          <a href="#">
            <i class="fa fa-pie-chart" style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp;
            <span>Reports</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a class="collapse-item" href="#" onclick="changePages('shiftPumpReport.php');"><i class="fas fa-gas-pump"></i>&nbsp;Shift Pump Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('shiftSaleReport.php');"><i class="fas fa-bars"></i>&nbsp;Shift Sale Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('shiftTankReport.php');"><i class="fas fa-sort-amount-up"></i>&nbsp;Shift Tank Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('shiftGradeReport.php');"><i class="fas fa-chart-bar"></i>&nbsp;Shift Grade Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('creditSaleReport.php');"><i class="fas fa-align-center"></i>&nbsp;Credit Sale Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('reconciliationReport.php');"><i class="fas fa-book"></i>&nbsp;Reconciliation Report</a></li>
          </ul>
        </li>
        <li class="treeview">
          <a href="#">
            <i class="fa fa-users" style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp;
            <span>Admin</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
              <li><a class="collapse-item" href="#" onclick="changePages('customers.php');"><i class="fas fa-users"></i>&nbsp;Customers</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('suppliers.php');"><i class="fas fa-user-tie"></i>&nbsp;Suppliers</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('users.php');"><i class="fas fa-grin"></i>&nbsp;User</a></li>
          </ul>
        </li>
        <li class="header">Footer</li>
         <li class="treeview">
          <a href="#">
            <i class="fa fa-wrench" style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp;
            <span>Configurations</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
          <li><a class="collapse-item" href="#" onclick="changePages('configurations.php');"><i class="far fa-calendar-alt" style="font-size:15px;"></i>&nbsp; Configurations</a></li>
          <li><a class="collapse-item" href="#" onclick="changePages('fuelPoints.php');"><i class="fa fa-industry"></i>&nbsp;Fuel Points</a></li>
          </ul>
        </li>
        <li class="treeview"><a href="#"><i class="fas fa-fw fa-table"></i>&nbsp; &nbsp;&nbsp;&nbsp; <span>Exit</span></a></li>
      </ul>
    </section>
    <!-- /.sidebar -->
  </aside>