%PDF- <> %âãÏÓ endobj 2 0 obj <> endobj 3 0 obj <>/ExtGState<>/ProcSet[/PDF/Text/ImageB/ImageC/ImageI] >>/Annots[ 28 0 R 29 0 R] /MediaBox[ 0 0 595.5 842.25] /Contents 4 0 R/Group<>/Tabs/S>> endobj ºaâÚÎΞ-ÌE1ÍØÄ÷{òò2ÿ ÛÖ^ÔÀá TÎ{¦?§®¥kuµùÕ5sLOšuY>endobj 2 0 obj<>endobj 2 0 obj<>endobj 2 0 obj<>endobj 2 0 obj<> endobj 2 0 obj<>endobj 2 0 obj<>es 3 0 R>> endobj 2 0 obj<> ox[ 0.000000 0.000000 609.600000 935.600000]/Fi endobj 3 0 obj<> endobj 7 1 obj<>/ProcSet[/PDF/Text/ImageB/ImageC/ImageI]>>/Subtype/Form>> stream
<?php
/**
* Halaman publik: Galeri Video (kumpulan video YouTube kegiatan).
*/
require_once __DIR__ . '/config/config.php';
require_once __DIR__ . '/includes/queries.php';
$videoList = get_galeri_video_list();
$pageTitle = 'Galeri Video — ' . APP_NAME_SHORT;
$activeNav = 'galeri';
require __DIR__ . '/partials/head.php';
require __DIR__ . '/partials/navbar.php';
?>
<section class="relative overflow-hidden bg-gradient-to-br from-mateng-green to-mateng-blue text-white py-14">
<?php require __DIR__ . '/partials/sekda-header.php'; ?>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<nav class="text-sm text-green-100 mb-3">
<a href="<?= e(url('index.php')) ?>" class="hover:underline">Beranda</a><span class="mx-2">/</span>
<span>Galeri Kegiatan</span><span class="mx-2">/</span><span>Galeri Video</span>
</nav>
<h1 class="text-3xl md:text-4xl font-extrabold mb-2">Galeri Video</h1>
<p class="text-green-50 max-w-2xl">Dokumentasi video kegiatan PPID & Pemerintah Kabupaten Mamuju Tengah.</p>
</div>
</section>
<main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-10 w-full">
<?php if (empty($videoList)): ?>
<div class="text-center py-20 bg-white rounded-2xl border border-slate-100">
<i class="fab fa-youtube text-5xl text-slate-300 mb-4"></i>
<p class="text-slate-500 font-medium">Belum ada galeri video.</p>
</div>
<?php else: ?>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
<?php foreach ($videoList as $v): ?>
<button type="button" class="galeri-video-open group text-left" data-yt="<?= e($v['youtube_id']) ?>" data-judul="<?= e($v['judul']) ?>">
<div class="relative rounded-2xl overflow-hidden border border-slate-100 shadow-sm bg-slate-900 aspect-video">
<img src="https://img.youtube.com/vi/<?= e($v['youtube_id']) ?>/hqdefault.jpg" alt="<?= e($v['judul']) ?>" loading="lazy" class="w-full h-full object-cover opacity-90 group-hover:opacity-100 group-hover:scale-105 transition-all duration-500">
<span class="absolute inset-0 flex items-center justify-center">
<span class="w-14 h-14 rounded-full bg-red-600/90 group-hover:bg-red-600 text-white flex items-center justify-center shadow-lg transition-colors"><i class="fas fa-play text-lg ml-0.5"></i></span>
</span>
</div>
<h3 class="font-bold text-slate-800 mt-3 leading-snug group-hover:text-mateng-green transition-colors line-clamp-2"><?= e($v['judul']) ?></h3>
<p class="text-xs text-slate-400 mt-1"><i class="far fa-calendar mr-1"></i><?= e(tanggal_id($v['tanggal'] ?: $v['created_at'])) ?></p>
</button>
<?php endforeach; ?>
</div>
<?php require __DIR__ . '/partials/galeri-video-lightbox.php'; ?>
<?php endif; ?>
<div class="mt-8">
<a href="<?= e(url('galeri.php')) ?>" class="inline-flex items-center gap-2 text-mateng-green font-semibold hover:underline"><i class="fas fa-images"></i> Lihat Galeri Foto</a>
</div>
</main>
<?php require __DIR__ . '/partials/footer.php'; ?>