membuat halaman utama dashboard 2

 Assalamualaikum wr.wb

Agung Ramadhan

saya ingin menunjukkan tugas saya cara membuat halaman utama dengan DashBoard.

 <li class="nav-item">

    <a class="nav-link text-white" href="#"><i class="fas fa-tachometer-alt mr-2"></i>Dashboard</a><hr class="bg-secondary"></li>

  </li>

  <li class="nav-item">

    <a class="nav-link text-white" href="#"><i class="fas fa-graduation-cap mr-2"></i>Daftar Siswa</a><hr class="bg-secondary"></li>

  </li>

<li class="nav-item">

    <a class="nav-link text-white" href="#"><i class="fas fa-chalkboard-teacher mr-2"></i>Daftar Guru</a><hr class="bg-secondary"></li>

<li class="nav-item">

    <a class="nav-link text-white" href="#"><i class="fas fa-calendar-alt mr-2"></i>Jadwal Pelajaran</a><hr class="bg-secondary"></li>

<li class="nav-item">

    <a class="nav-link text-white" href="#"><i class="fas fa-paper-plane mr-2"></i>Daftar Nilai</a><hr class="bg-secondary">    

    </li>

  </ul>

</div>

  <div class="col-md-10 p-4 pt-2">

<h3><i class="fas fa-tachometer-alt mr-2"></i>DASHBOARD</h3><hr>

<div class="row text-white">

<div class="card bg-info ml-4" style="width: 18rem;">

 

  <div class="card-body">

   <div class="card-body-icon">

   <i class="fas fa-graduation-cap mr-2"></i> 

  </div>

    <h5 class="card-title">Jumlah Siswa</h5>

    <div class="display-4">430</div>

    <a href=""><p class="card-text text-white">Lihat Detail<i class="fas fa-angle-double-right"></i></p></a>

 

  </div>

</div>

<div class="card bg-danger ml-3" style="width: 18rem;">

  <div class="card-body">

   <div class="card-body-icon">

   <i class="fas fa-graduation-cap mr-2"></i> 

  </div>

    <h5 class="card-title">Jumlah Guru</h5>

    <div class="display-4">25</div>

    <a href=""><p class="card-text text-white">Lihat Detail<i class="fas fa-angle-double-right"></i></p></a>

 

  </div>

</div>

<div class="card bg-success ml-4" style="width: 18rem;">

  <div class="card-body">

   <div class="card-body-icon">

   <i class="fas fa-graduation-cap mr-2"></i>

  </div>

    <h5 class="card-title">Jumlah Pegawai</h5>

    <div class="display-4">15</div>

    <a href=""><p class="card-text text-white">Lihat Detail<i class="fas fa-angle-double-right"></i></p></a>

 

  </div>

</div>

Dari gambar di atas adalah hasil dari cara membuat halaman utama dengan DashBoard.