@extends('layouts.user.user-layout')
@section('dashboard-content')
   <!-- menu -->
   @include('layouts.user.template-part.menu')
<div class="page-content-wrapper">
      <!-- Welcome Toast -->
      <div class="toast toast-autohide custom-toast-1 toast-success home-page-toast" role="alert" aria-live="assertive" aria-atomic="true" data-bs-delay="7000" data-bs-autohide="true">
        <div class="toast-body">
          <svg class="bi bi-bookmark-check text-white" width="30" height="30" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
            <path fill-rule="evenodd" d="M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.777.416L8 13.101l-5.223 2.815A.5.5 0 0 1 2 15.5V2zm2-1a1 1 0 0 0-1 1v12.566l4.723-2.482a.5.5 0 0 1 .554 0L13 14.566V2a1 1 0 0 0-1-1H4z"></path>
            <path fill-rule="evenodd" d="M10.854 5.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 7.793l2.646-2.647a.5.5 0 0 1 .708 0z"></path>
          </svg>
          <div class="toast-text ms-3 me-2">
            <p class="mb-1 text-white">Welcome to Pointlearn !</p><small class="d-block">Silahkan Pilih menu untuk pembelajaran materi</small>
          </div>
        </div>
        <button class="btn btn-close btn-close-white position-absolute p-1" type="button" data-bs-dismiss="toast" aria-label="Close"></button>
      </div>
      <!-- Tiny Slider One Wrapper -->
      <div class="tiny-slider-one-wrapper">
        <div class="tiny-slider-one">
              
                 
          <!-- Single Hero Slide -->
          <div> 
            <div class="single-hero-slide bg-overlay" style="background-image: url('{{asset('pointlearn')}}/img/bg-img/40.png')">
              <div class="h-100 d-flex align-items-center text-center">
                <div class="container">
                  <h3 class="text-white mb-1">Welcome to Pointlearn</h3>
                  <p class="text-white mb-4">Aplikasi yang berguna untuk memantau perkembangan materi siswa yang bersifat point di setiap modul pembelajaran.</p>
                </div>
              </div>
            </div>
          </div>
          <!-- Single Hero Slide -->
          <div> 
            <div class="single-hero-slide bg-overlay" style="background-image: url('{{asset('pointlearn')}}/img/bg-img/19.png')">
              <div class="h-100 d-flex align-items-center text-center">
                <div class="container">
                  <h3 class="text-white mb-1">Pantau Poin Mu</h3>
                  <p class="text-white mb-4">Kemudahan mendapatkan point di setiap pembelajaran</p>
                </div>
              </div>
            </div>
          </div>
          <!-- Single Hero Slide -->
          
        </div>
      </div>
      <div class="pt-3"></div>
      
      
      @foreach($listmateri as $item)
      <div class="container">
        <div class="card card-bg-img bg-img bg-overlay mb-3" style="background-image: url('{{asset('pointlearn')}}/img/bg-img/19.png')">
          <div class="card-body direction-rtl p-5">
            <h2 class="text-white">{{$item->nama}}</h2>
            <p class="mb-4 text-white">Materi ini untuk jenjang <span>#Kelas {{$item->kelas}} {{$item->jenjang}}, {{$item->pendidik}} Sebagai guru pengampu matapelajaran tersebut</span></p><a class="btn btn-warning" href="{{ route('siswa.detaillistmateri', ['id' => $item->id]) }}">Pelajari</a>
          </div>
        </div>
      </div>
      @endforeach
      
      <div class="pb-3"></div>
    </div>

@endsection