@extends('template')

@section('content')
<div class="pt-lg-0 pt-5 inter">
  <div class="mt-lg-0 mt-4">
    <div class="swiper mySwiper">
      <div class="swiper-wrapper "style="">
        @foreach ($banner as $item)
        <div class="swiper-slide" style="height: 100vh ;" data-title="{{ $item->title }}" data-subtitle="{{{ Str::words(strip_tags($item->deskripsi), 10, ' ...') }}}">
          <a href="{{route('beritabyid',Crypt::encryptString($item->id))}}">
            <img src="{{ asset('images/' . $item->photo) }}"
            alt="">
          </a>
        </div>
        @endforeach
        
      </div>
      <div class="slide-captions">
        
      </div>
      
      <div class="swiper-button-next"></div>
      <div class="swiper-button-prev"></div>
    </div>
    
  </div>  
</div>
<div class="container inter mt-5 center flex-column h-screen">
  <h1 class="text-green-dark m-5">Berita Pramuka dan Kepemudaan</h1>
  <div class="news-container">
    @foreach ($berita as $item)
    <div class="text-green m-2 mb-5">
        <p class="mb-0 ">{{$item->tanggal}}</p>
        <h4 class="text-green-dark fw-bold"style="width:350px;">{{$item->title}}</h4>
        <img class="news-photo rounded" src="{{asset('images/'.$item->photo)}}" alt="">
        <div class="news-wrapper mt-2">
            <p style="line-height:100%;;">{{{ Str::words(strip_tags($item->deskripsi), 25, ' ...') }}} </p>
        </div>
        <a href="{{route('beritabyid',Crypt::encryptString($item->id))}}" class="text-green-dark link">Baca Selengkapnya ></a>
    </div>
    @endforeach

  </div>

   <a href="{{route('lebih_lanjut',$berita->count())}}" class="button-outline mb-5 ">Lihat Semua</a>
   <div class="container "style="padding-left:10%;padding-right:10%;">
    <h3 class="text-center text-green-dark m-5">Tags Kategori Berita</h3>
    <div class="wrapper-wrap center">
        
        <a class=" button-outline m-2" href="{{route('filter_berita','pramuka')}}">Pramuka</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','futsal')}}">Futsal</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','sepakbola')}}">Sepak Bola</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','karang taruna')}}">Karang Taruna</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','gugus depan')}}">Gugus Depan</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','bulu tangkis')}}">Bulu Tangkis</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','kegiatan')}}">Kegiatan</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','anggota')}}">Anggota</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','organisasi')}}">Organisasi</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','kwartir cabang')}}">Kwartir Cabang</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','satuan karya')}}">Satuan Karya</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','pertandingan')}}">Pertandingan</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','berita')}}">Berita</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','agenda')}}">Agenda</a>
        <a class=" button-outline m-2" href="{{route('filter_berita','workshop')}}">Workshop</a>
        
    </div>
  </div>
</div>


<script src="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.js"></script>



@endsection