95 lines
4.4 KiB
PHP
95 lines
4.4 KiB
PHP
<section id="hero" class="hero section">
|
|
<div class="container" data-aos="fade-up" data-aos-delay="100">
|
|
<div class="row align-items-center">
|
|
<div class="col-lg-6">
|
|
<div class="hero-content" data-aos="fade-up" data-aos-delay="200">
|
|
<div class="company-badge mb-4">
|
|
<i class="bi bi-gear-fill me-2"></i> Ayo ciptakan kedamaian bersama
|
|
</div>
|
|
<h1 class="mb-4">
|
|
Pemerintahan Kantor <br> Desa Pelem
|
|
<span class="accent-text">Siap Disiplin</span>
|
|
</h1>
|
|
<p class="mb-4 mb-md-5">
|
|
Sekarang, informasi dan absensi pegawai desa bisa dipantau langsung lewat website resmi desa.
|
|
Yuk cek biar kita semua bisa sama-sama menjaga kedisiplinan dan transparansi kerja aparat desa.
|
|
Mudah, cepat, dan terbuka untuk semua
|
|
</p>
|
|
<div class="hero-buttons">
|
|
<a href="#about" class="btn btn-primary me-0 me-sm-2 mx-1">Baca Lebih Lanjut</a>
|
|
{{-- <a href="https://www.youtube.com/watch?v=Y7f98aduVJ8"
|
|
class="btn btn-link mt-2 mt-sm-0 glightbox">
|
|
<i class="bi bi-play-circle me-1"></i> Video Tentang Desa Pelem
|
|
</a> --}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-6">
|
|
<div class="hero-image" data-aos="zoom-out" data-aos-delay="300">
|
|
<img src="{{ asset('landing/assets/img/illustration-1.webp') }}" alt="Hero Image" class="img-fluid">
|
|
|
|
<div class="customers-badge">
|
|
<div class="customer-avatars">
|
|
<img src="{{ asset('landing/assets/img/avatar-1.webp') }}" alt="Customer 1" class="avatar">
|
|
<img src="{{ asset('landing/assets/img/avatar-2.webp') }}" alt="Customer 2" class="avatar">
|
|
<img src="{{ asset('landing/assets/img/avatar-3.webp') }}" alt="Customer 3" class="avatar">
|
|
<img src="{{ asset('landing/assets/img/avatar-4.webp') }}" alt="Customer 4" class="avatar">
|
|
<img src="{{ asset('landing/assets/img/avatar-5.webp') }}" alt="Customer 5" class="avatar">
|
|
<span class="avatar more">12+</span>
|
|
</div>
|
|
<p class="mb-0 mt-2">12,000+ lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row stats-row gy-4 mt-5" data-aos="fade-up" data-aos-delay="500">
|
|
<!-- Desa -->
|
|
<div class="col-lg-3 col-md-6">
|
|
<div class="stat-item">
|
|
<div class="stat-icon"><i class="bi bi-house-door"></i></div>
|
|
<div class="stat-content">
|
|
<h4>Desa Pelem</h4>
|
|
<p class="mb-0">Nganjuk, Kertosono</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Dusun -->
|
|
<div class="col-lg-3 col-md-6">
|
|
<div class="stat-item">
|
|
<div class="stat-icon"><i class="bi bi-diagram-3"></i></div>
|
|
<div class="stat-content">
|
|
<h4>Dusun</h4>
|
|
<p class="mb-0">Memiliki 3 Dusun</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Penduduk -->
|
|
<div class="col-lg-3 col-md-6">
|
|
<div class="stat-item">
|
|
<div class="stat-icon"><i class="bi bi-people"></i></div>
|
|
<div class="stat-content">
|
|
<h4>Penduduk</h4>
|
|
<p class="mb-0">Jumlah Penduduk 8571</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Luas Wilayah -->
|
|
<div class="col-lg-3 col-md-6">
|
|
<div class="stat-item">
|
|
<div class="stat-icon"><i class="bi bi-map"></i></div>
|
|
<div class="stat-content">
|
|
<h4>Luas Wilayah</h4>
|
|
<p class="mb-0">1,79 ㎢</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|