update seputar
marszayn
parent
ce6b09a951
commit
ff1e690e63
|
|
@ -11,6 +11,12 @@ namespace MyApp.Namespace
|
||||||
return View();
|
return View();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
[HttpGet("video")]
|
||||||
|
public IActionResult Video()
|
||||||
|
{
|
||||||
|
return View();
|
||||||
|
}
|
||||||
|
|
||||||
[HttpGet("kontak-kami")]
|
[HttpGet("kontak-kami")]
|
||||||
public IActionResult Kontak()
|
public IActionResult Kontak()
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -18,172 +18,344 @@
|
||||||
<!-- Breadcumb -->
|
<!-- Breadcumb -->
|
||||||
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
|
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
|
||||||
|
|
||||||
|
|
||||||
<section class="py-12 bg-gray-50">
|
<section class="py-12 bg-gray-50">
|
||||||
<div class="container mx-auto px-4">
|
<div class="container mx-auto max-w-6xl px-4">
|
||||||
<!-- Search and Filter Section -->
|
|
||||||
|
<!-- Filter Tabs -->
|
||||||
<div class="mb-8">
|
<div class="mb-8">
|
||||||
<div class="flex flex-col md:flex-row gap-4 items-center justify-between">
|
<div class="flex flex-wrap items-center justify-center gap-2 mb-6">
|
||||||
<!-- Search Bar -->
|
<button class="filter-tab active px-6 py-2 rounded-sm font-medium transition-all" data-category="">
|
||||||
<div class="w-full md:w-1/2">
|
Semua
|
||||||
<div class="relative">
|
</button>
|
||||||
<input type="text" placeholder="Cari berita..."
|
<button class="filter-tab px-6 py-2 rounded-sm font-medium transition-all" data-category="lingkungan">Lingkungan</button>
|
||||||
class="w-full px-4 py-3 pl-10 pr-4 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
|
<button class="filter-tab px-6 py-2 rounded-sm font-medium transition-all" data-category="kebersihan">Kebersihan</button>
|
||||||
<div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
|
<button class="filter-tab px-6 py-2 rounded-sm font-medium transition-all" data-category="kegiatan">Kegiatan</button>
|
||||||
<svg class="h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
<button class="filter-tab px-6 py-2 rounded-sm font-medium transition-all" data-category="pengumuman">Pengumuman</button>
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="flex flex-col md:flex-row gap-4 items-center justify-center mb-6">
|
||||||
|
<div class="relative w-full">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="search-input"
|
||||||
|
placeholder="Cari berita..."
|
||||||
|
class="w-full px-4 py-3 pr-11 pl-4 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500 transition"
|
||||||
|
autocomplete="off"
|
||||||
|
>
|
||||||
|
<div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
|
||||||
|
<i class="h-5 w-5 text-gray-400" data-lucide="search"></i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Category Filter -->
|
<div class="">
|
||||||
<div class="w-full md:w-auto">
|
<select id="year-filter" class="px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
|
||||||
<select class="px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
|
<option value="">Semua Tahun</option>
|
||||||
<option value="">Semua Kategori</option>
|
<option value="2024">2024</option>
|
||||||
<option value="lingkungan">Lingkungan</option>
|
<option value="2023">2023</option>
|
||||||
<option value="kebersihan">Kebersihan</option>
|
<option value="2022">2022</option>
|
||||||
<option value="kegiatan">Kegiatan</option>
|
<option value="2021">2021</option>
|
||||||
<option value="pengumuman">Pengumuman</option>
|
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Trending News Section -->
|
<!-- News -->
|
||||||
<div class="mb-12">
|
|
||||||
<h2 class="text-2xl font-bold text-gray-800 mb-6">Berita Trending</h2>
|
|
||||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
|
||||||
<!-- Main Trending News -->
|
|
||||||
<div class="lg:col-span-1">
|
|
||||||
<div class="relative overflow-hidden rounded-xl shadow-lg group cursor-pointer">
|
|
||||||
<img src="https://via.placeholder.com/600x400" alt="Trending News"
|
|
||||||
class="w-full h-80 object-cover group-hover:scale-105 transition-transform duration-300">
|
|
||||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent"></div>
|
|
||||||
<div class="absolute bottom-0 left-0 right-0 p-6 text-white">
|
|
||||||
<span class="inline-block px-3 py-1 bg-red-600 text-xs font-semibold rounded-full mb-3">TRENDING</span>
|
|
||||||
<h3 class="text-xl font-bold mb-2">Judul Berita Trending Utama Yang Menarik Perhatian</h3>
|
|
||||||
<p class="text-sm opacity-90 mb-2">Lorem ipsum dolor sit amet consectetur adipisicing elit...</p>
|
|
||||||
<span class="text-xs opacity-75">15 Januari 2024</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Side Trending News -->
|
|
||||||
<div class="space-y-4">
|
|
||||||
<div class="flex gap-4 p-4 bg-white rounded-lg shadow hover:shadow-md transition-shadow cursor-pointer">
|
|
||||||
<img src="https://via.placeholder.com/120x80" alt="News" class="w-24 h-20 object-cover rounded-lg flex-shrink-0">
|
|
||||||
<div class="flex-1">
|
|
||||||
<span class="inline-block px-2 py-1 bg-orange-100 text-orange-800 text-xs font-medium rounded mb-2">HOT</span>
|
|
||||||
<h4 class="font-semibold text-gray-800 mb-1 line-clamp-2">Judul Berita Trending Kedua</h4>
|
|
||||||
<span class="text-xs text-gray-500">12 Januari 2024</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex gap-4 p-4 bg-white rounded-lg shadow hover:shadow-md transition-shadow cursor-pointer">
|
|
||||||
<img src="https://via.placeholder.com/120x80" alt="News" class="w-24 h-20 object-cover rounded-lg flex-shrink-0">
|
|
||||||
<div class="flex-1">
|
|
||||||
<span class="inline-block px-2 py-1 bg-green-100 text-green-800 text-xs font-medium rounded mb-2">NEW</span>
|
|
||||||
<h4 class="font-semibold text-gray-800 mb-1 line-clamp-2">Judul Berita Trending Ketiga</h4>
|
|
||||||
<span class="text-xs text-gray-500">10 Januari 2024</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex gap-4 p-4 bg-white rounded-lg shadow hover:shadow-md transition-shadow cursor-pointer">
|
|
||||||
<img src="https://via.placeholder.com/120x80" alt="News" class="w-24 h-20 object-cover rounded-lg flex-shrink-0">
|
|
||||||
<div class="flex-1">
|
|
||||||
<span class="inline-block px-2 py-1 bg-blue-100 text-blue-800 text-xs font-medium rounded mb-2">UPDATE</span>
|
|
||||||
<h4 class="font-semibold text-gray-800 mb-1 line-clamp-2">Judul Berita Trending Keempat</h4>
|
|
||||||
<span class="text-xs text-gray-500">8 Januari 2024</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- All News Section -->
|
|
||||||
<div>
|
<div>
|
||||||
<h2 class="text-2xl font-bold text-gray-800 mb-6">Semua Berita</h2>
|
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" id="news-grid">
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" id="news-grid">
|
||||||
<!-- News Card 1 -->
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer"
|
||||||
<article class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer">
|
data-category="lingkungan" data-year="2024" data-title="Program Penghijauan Kota Jakarta Tahun 2024" data-date="2024-01-15">
|
||||||
<img src="https://via.placeholder.com/400x250" alt="News" class="w-full h-48 object-cover">
|
<img src="@Url.Content("~/assets/images/home/berita1.jpg")" alt="News" class="w-full h-48 object-cover">
|
||||||
<div class="p-6">
|
<div class="p-6">
|
||||||
<div class="flex items-center gap-2 mb-3">
|
<div class="flex items-center gap-2 mb-3">
|
||||||
<span class="px-2 py-1 bg-green-100 text-green-800 text-xs font-medium rounded">Lingkungan</span>
|
<span class="px-2 py-1 bg-green-100 text-green-800 text-xs font-medium rounded">Lingkungan</span>
|
||||||
<span class="text-xs text-gray-500">5 Januari 2024</span>
|
<span class="text-xs text-gray-500">15 Januari 2024</span>
|
||||||
</div>
|
</div>
|
||||||
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Program Penghijauan Kota Jakarta Tahun 2024</h3>
|
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Program Penghijauan Kota Jakarta Tahun 2024</h3>
|
||||||
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quia, voluptatem...</p>
|
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Program penghijauan ini bertujuan untuk meningkatkan kualitas udara di Jakarta melalui penanaman pohon di berbagai titik strategis...</p>
|
||||||
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- News Card 2 -->
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer"
|
||||||
<article class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer">
|
data-category="kebersihan" data-year="2024" data-title="Operasi Kebersihan Lingkungan di Seluruh DKI Jakarta" data-date="2024-01-12">
|
||||||
<img src="https://via.placeholder.com/400x250" alt="News" class="w-full h-48 object-cover">
|
<img src="@Url.Content("~/assets/images/home/berita1.jpg")" alt="News" class="w-full h-48 object-cover">
|
||||||
<div class="p-6">
|
<div class="p-6">
|
||||||
<div class="flex items-center gap-2 mb-3">
|
<div class="flex items-center gap-2 mb-3">
|
||||||
<span class="px-2 py-1 bg-blue-100 text-blue-800 text-xs font-medium rounded">Kebersihan</span>
|
<span class="px-2 py-1 bg-blue-100 text-blue-800 text-xs font-medium rounded">Kebersihan</span>
|
||||||
<span class="text-xs text-gray-500">3 Januari 2024</span>
|
<span class="text-xs text-gray-500">12 Januari 2024</span>
|
||||||
</div>
|
</div>
|
||||||
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Operasi Kebersihan Lingkungan di Seluruh DKI Jakarta</h3>
|
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Operasi Kebersihan Lingkungan di Seluruh DKI Jakarta</h3>
|
||||||
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quia, voluptatem...</p>
|
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Dinas Lingkungan Hidup DKI Jakarta menggelar operasi kebersihan massal untuk menjaga kebersihan kota...</p>
|
||||||
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- News Card 3 -->
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer"
|
||||||
<article class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer">
|
data-category="kegiatan" data-year="2024" data-title="Workshop Pengelolaan Sampah Ramah Lingkungan" data-date="2024-01-10">
|
||||||
<img src="https://via.placeholder.com/400x250" alt="News" class="w-full h-48 object-cover">
|
<img src="@Url.Content("~/assets/images/home/berita1.jpg")" alt="News" class="w-full h-48 object-cover">
|
||||||
<div class="p-6">
|
<div class="p-6">
|
||||||
<div class="flex items-center gap-2 mb-3">
|
<div class="flex items-center gap-2 mb-3">
|
||||||
<span class="px-2 py-1 bg-purple-100 text-purple-800 text-xs font-medium rounded">Kegiatan</span>
|
<span class="px-2 py-1 bg-purple-100 text-purple-800 text-xs font-medium rounded">Kegiatan</span>
|
||||||
<span class="text-xs text-gray-500">1 Januari 2024</span>
|
<span class="text-xs text-gray-500">10 Januari 2024</span>
|
||||||
</div>
|
</div>
|
||||||
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Workshop Pengelolaan Sampah Ramah Lingkungan</h3>
|
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Workshop Pengelolaan Sampah Ramah Lingkungan</h3>
|
||||||
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quia, voluptatem...</p>
|
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Workshop ini mengajarkan masyarakat cara mengelola sampah dengan baik dan ramah lingkungan...</p>
|
||||||
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- More news cards would be loaded dynamically -->
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer"
|
||||||
|
data-category="pengumuman" data-year="2024" data-title="Pengumuman Jadwal Pengangkutan Sampah Hari Raya" data-date="2024-01-08">
|
||||||
|
<img src="@Url.Content("~/assets/images/home/berita1.jpg")" alt="News" class="w-full h-48 object-cover">
|
||||||
|
<div class="p-6">
|
||||||
|
<div class="flex items-center gap-2 mb-3">
|
||||||
|
<span class="px-2 py-1 bg-yellow-100 text-yellow-800 text-xs font-medium rounded">Pengumuman</span>
|
||||||
|
<span class="text-xs text-gray-500">8 Januari 2024</span>
|
||||||
|
</div>
|
||||||
|
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Pengumuman Jadwal Pengangkutan Sampah Hari Raya</h3>
|
||||||
|
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Informasi penting mengenai jadwal pengangkutan sampah selama periode hari raya...</p>
|
||||||
|
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer"
|
||||||
|
data-category="lingkungan" data-year="2023" data-title="Monitoring Kualitas Air Jakarta 2023" data-date="2023-12-20">
|
||||||
|
<img src="@Url.Content("~/assets/images/home/berita1.jpg")" alt="News" class="w-full h-48 object-cover">
|
||||||
|
<div class="p-6">
|
||||||
|
<div class="flex items-center gap-2 mb-3">
|
||||||
|
<span class="px-2 py-1 bg-green-100 text-green-800 text-xs font-medium rounded">Lingkungan</span>
|
||||||
|
<span class="text-xs text-gray-500">20 Desember 2023</span>
|
||||||
|
</div>
|
||||||
|
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Monitoring Kualitas Air Jakarta 2023</h3>
|
||||||
|
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Hasil monitoring kualitas air di berbagai wilayah Jakarta menunjukkan peningkatan yang signifikan...</p>
|
||||||
|
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer"
|
||||||
|
data-category="kegiatan" data-year="2023" data-title="Kampanye Reduce Reuse Recycle" data-date="2023-12-15">
|
||||||
|
<img src="@Url.Content("~/assets/images/home/berita1.jpg")" alt="News" class="w-full h-48 object-cover">
|
||||||
|
<div class="p-6">
|
||||||
|
<div class="flex items-center gap-2 mb-3">
|
||||||
|
<span class="px-2 py-1 bg-purple-100 text-purple-800 text-xs font-medium rounded">Kegiatan</span>
|
||||||
|
<span class="text-xs text-gray-500">15 Desember 2023</span>
|
||||||
|
</div>
|
||||||
|
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Kampanye Reduce Reuse Recycle</h3>
|
||||||
|
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Kampanye 3R untuk mengajak masyarakat Jakarta berpartisipasi dalam menjaga lingkungan...</p>
|
||||||
|
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Load More Button -->
|
<!-- Pagination -->
|
||||||
<div class="text-center mt-10">
|
<div class="flex justify-center items-center mt-10 space-x-2" id="pagination">
|
||||||
<button id="load-more-btn"
|
<button class="pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50" data-page="prev" disabled>
|
||||||
class="px-8 py-3 bg-green-600 text-white font-medium rounded-lg hover:bg-green-700 transition-colors duration-300 focus:ring-4 focus:ring-green-200">
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
Muat Lebih Banyak
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button class="pagination-btn px-4 py-2 bg-green-600 text-white rounded-lg" data-page="1">1</button>
|
||||||
|
<button class="pagination-btn px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50" data-page="2">2</button>
|
||||||
|
<button class="pagination-btn px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50" data-page="3">3</button>
|
||||||
|
|
||||||
|
<button class="pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50" data-page="next">
|
||||||
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<register-block dynamic-section="css" key="cssPageBerita">
|
||||||
|
<style>
|
||||||
|
.filter-tab {
|
||||||
|
background-color: #e5e7eb;
|
||||||
|
color: #374151;
|
||||||
|
border-radius: 1rem;
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
.filter-tab:hover {
|
||||||
|
background-color: #d1d5db;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-tab.active {
|
||||||
|
background-color: #16a34a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.filter-tab.active:hover {
|
||||||
|
background-color: #15803d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-badge {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-clamp-2 {
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-clamp-3 {
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</register-block>
|
||||||
|
|
||||||
|
<register-block dynamic-section="scripts" key="jsPageBerita">
|
||||||
<script>
|
<script>
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
const loadMoreBtn = document.getElementById('load-more-btn');
|
const filterTabs = document.querySelectorAll('.filter-tab');
|
||||||
const newsGrid = document.getElementById('news-grid');
|
const searchInput = document.getElementById('search-input');
|
||||||
|
const yearFilter = document.getElementById('year-filter');
|
||||||
|
const newsCards = document.querySelectorAll('.news-card');
|
||||||
|
const paginationBtns = document.querySelectorAll('.pagination-btn');
|
||||||
|
|
||||||
loadMoreBtn.addEventListener('click', function() {
|
let currentCategory = '';
|
||||||
// Simulate loading more news
|
let currentSearchTerm = '';
|
||||||
const newNewsHtml = `
|
let currentYear = '';
|
||||||
<article class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300 cursor-pointer">
|
let currentPage = 1;
|
||||||
<img src="https://via.placeholder.com/400x250" alt="News" class="w-full h-48 object-cover">
|
const itemsPerPage = 6;
|
||||||
<div class="p-6">
|
|
||||||
<div class="flex items-center gap-2 mb-3">
|
|
||||||
<span class="px-2 py-1 bg-yellow-100 text-yellow-800 text-xs font-medium rounded">Pengumuman</span>
|
|
||||||
<span class="text-xs text-gray-500">28 Desember 2023</span>
|
|
||||||
</div>
|
|
||||||
<h3 class="font-bold text-gray-800 mb-2 line-clamp-2">Berita Baru yang Dimuat Secara Dinamis</h3>
|
|
||||||
<p class="text-gray-600 text-sm mb-4 line-clamp-3">Lorem ipsum dolor sit amet consectetur adipisicing elit...</p>
|
|
||||||
<a href="#" class="text-green-600 hover:text-green-700 font-medium text-sm">Baca Selengkapnya →</a>
|
|
||||||
</div>
|
|
||||||
</article>
|
|
||||||
`;
|
|
||||||
|
|
||||||
newsGrid.insertAdjacentHTML('beforeend', newNewsHtml);
|
// Filter functionality
|
||||||
|
function filterNews() {
|
||||||
|
let visibleCards = [];
|
||||||
|
|
||||||
|
newsCards.forEach(card => {
|
||||||
|
const cardCategory = card.dataset.category;
|
||||||
|
const cardYear = card.dataset.year;
|
||||||
|
const cardTitle = card.dataset.title.toLowerCase();
|
||||||
|
|
||||||
|
const matchCategory = !currentCategory || cardCategory === currentCategory;
|
||||||
|
const matchYear = !currentYear || cardYear === currentYear;
|
||||||
|
const matchSearch = !currentSearchTerm || cardTitle.includes(currentSearchTerm.toLowerCase());
|
||||||
|
|
||||||
|
if (matchCategory && matchYear && matchSearch) {
|
||||||
|
visibleCards.push(card);
|
||||||
|
card.style.display = 'block';
|
||||||
|
} else {
|
||||||
|
card.style.display = 'none';
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Update pagination
|
||||||
|
updatePagination(visibleCards.length);
|
||||||
|
paginateCards(visibleCards);
|
||||||
|
}
|
||||||
|
|
||||||
|
function paginateCards(visibleCards) {
|
||||||
|
const startIndex = (currentPage - 1) * itemsPerPage;
|
||||||
|
const endIndex = startIndex + itemsPerPage;
|
||||||
|
|
||||||
|
visibleCards.forEach((card, index) => {
|
||||||
|
if (index >= startIndex && index < endIndex) {
|
||||||
|
card.style.display = 'block';
|
||||||
|
} else {
|
||||||
|
card.style.display = 'none';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function updatePagination(totalItems) {
|
||||||
|
const totalPages = Math.ceil(totalItems / itemsPerPage);
|
||||||
|
const pagination = document.getElementById('pagination');
|
||||||
|
|
||||||
|
// Clear existing pagination
|
||||||
|
pagination.innerHTML = '';
|
||||||
|
|
||||||
|
// Previous button
|
||||||
|
const prevBtn = document.createElement('button');
|
||||||
|
prevBtn.className = 'pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50';
|
||||||
|
prevBtn.innerHTML = '<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>';
|
||||||
|
prevBtn.disabled = currentPage === 1;
|
||||||
|
prevBtn.addEventListener('click', () => {
|
||||||
|
if (currentPage > 1) {
|
||||||
|
currentPage--;
|
||||||
|
updatePaginationState();
|
||||||
|
filterNews();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
pagination.appendChild(prevBtn);
|
||||||
|
|
||||||
|
// Page numbers
|
||||||
|
for (let i = 1; i <= totalPages; i++) {
|
||||||
|
const pageBtn = document.createElement('button');
|
||||||
|
pageBtn.className = `pagination-btn px-4 py-2 rounded-lg ${i === currentPage ? 'bg-green-600 text-white' : 'border border-gray-300 hover:bg-gray-50'}`;
|
||||||
|
pageBtn.textContent = i;
|
||||||
|
pageBtn.addEventListener('click', () => {
|
||||||
|
currentPage = i;
|
||||||
|
updatePaginationState();
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
pagination.appendChild(pageBtn);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Next button
|
||||||
|
const nextBtn = document.createElement('button');
|
||||||
|
nextBtn.className = 'pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50';
|
||||||
|
nextBtn.innerHTML = '<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>';
|
||||||
|
nextBtn.disabled = currentPage === totalPages;
|
||||||
|
nextBtn.addEventListener('click', () => {
|
||||||
|
if (currentPage < totalPages) {
|
||||||
|
currentPage++;
|
||||||
|
updatePaginationState();
|
||||||
|
filterNews();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
pagination.appendChild(nextBtn);
|
||||||
|
}
|
||||||
|
|
||||||
|
function updatePaginationState() {
|
||||||
|
const paginationBtns = document.querySelectorAll('.pagination-btn');
|
||||||
|
paginationBtns.forEach(btn => {
|
||||||
|
if (btn.textContent == currentPage) {
|
||||||
|
btn.className = 'pagination-btn px-4 py-2 bg-green-600 text-white rounded-lg';
|
||||||
|
} else if (!isNaN(btn.textContent)) {
|
||||||
|
btn.className = 'pagination-btn px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Event listeners
|
||||||
|
filterTabs.forEach(tab => {
|
||||||
|
tab.addEventListener('click', function() {
|
||||||
|
filterTabs.forEach(t => t.classList.remove('active'));
|
||||||
|
this.classList.add('active');
|
||||||
|
currentCategory = this.dataset.category;
|
||||||
|
currentPage = 1;
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
// Tambahkan badge ke tab aktif saat load awal
|
||||||
|
const activeTab = document.querySelector('.filter-tab.active');
|
||||||
|
if (activeTab && !activeTab.querySelector('.active-badge')) {
|
||||||
|
const badge = document.createElement('span');
|
||||||
|
badge.className = 'active-badge absolute top-1 right-1';
|
||||||
|
activeTab.appendChild(badge);
|
||||||
|
}
|
||||||
|
|
||||||
|
searchInput.addEventListener('input', function() {
|
||||||
|
currentSearchTerm = this.value;
|
||||||
|
currentPage = 1;
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
|
||||||
|
yearFilter.addEventListener('change', function() {
|
||||||
|
currentYear = this.value;
|
||||||
|
currentPage = 1;
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initial load
|
||||||
|
filterNews();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
</register-block>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,20 @@
|
||||||
|
@{
|
||||||
|
Layout = "_Layout";
|
||||||
|
|
||||||
|
ViewData["Title"] = "Detail Berita - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["Description"] = "Kegiatan dan Informasi Terkini dari Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["Keywords"] = "Detail Berita, Dokumen Informasi, Kinerja, Lingkungan Hidup, DLH, Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["OgTitle"] = "Detail Berita - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["OgDescription"] = "Kegiatan dan Informasi Terkini dari Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["TwitterTitle"] = "Detail Berita - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["TwitterDescription"] = "Kegiatan dan Informasi Terkini dari Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
|
||||||
|
// Breadcumb
|
||||||
|
ViewData["BreadcrumbText"] = "Detail Berita";
|
||||||
|
ViewData["TitleBeforeHighlight"] = "Detail";
|
||||||
|
ViewData["TitleHighlight"] = "Berita";
|
||||||
|
}
|
||||||
|
|
||||||
|
<!-- Breadcumb -->
|
||||||
|
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
|
||||||
|
|
||||||
|
|
@ -2,18 +2,139 @@
|
||||||
Layout = "_Layout";
|
Layout = "_Layout";
|
||||||
|
|
||||||
ViewData["Title"] = "Kontak Kami - Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["Title"] = "Kontak Kami - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
ViewData["Description"] = "Kegiatan dan Informasi Terkini dari Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["Description"] = "Hubungi Dinas Lingkungan Hidup DKI Jakarta untuk informasi, konsultasi, dan layanan lingkungan hidup";
|
||||||
ViewData["Keywords"] = "Kontak Kami, Dokumen Informasi, Kinerja, Lingkungan Hidup, DLH, Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["Keywords"] = "Kontak Kami, Dokumen Informasi, Kinerja, Lingkungan Hidup, DLH, Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
ViewData["OgTitle"] = "Kontak Kami - Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["OgTitle"] = "Kontak Kami - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
ViewData["OgDescription"] = "Kegiatan dan Informasi Terkini dari Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["OgDescription"] = "Hubungi Dinas Lingkungan Hidup DKI Jakarta untuk informasi, konsultasi, dan layanan lingkungan hidup";
|
||||||
ViewData["TwitterTitle"] = "Kontak Kami - Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["TwitterTitle"] = "Kontak Kami - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
ViewData["TwitterDescription"] = "Kegiatan dan Informasi Terkini dari Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["TwitterDescription"] = "Hubungi Dinas Lingkungan Hidup DKI Jakarta untuk informasi, konsultasi, dan layanan lingkungan hidup";
|
||||||
|
|
||||||
// Breadcumb
|
// Breadcumb
|
||||||
ViewData["BreadcrumbText"] = "Kontak Kami";
|
ViewData["BreadcrumbText"] = "Kontak Kami";
|
||||||
ViewData["TitleBeforeHighlight"] = "Kegiatan dan Informasi Terkini";
|
ViewData["TitleBeforeHighlight"] = "Kontak";
|
||||||
ViewData["TitleHighlight"] = "dari Dinas Lingkungan Hidup DKI Jakarta";
|
ViewData["TitleHighlight"] = "Kami";
|
||||||
}
|
}
|
||||||
|
|
||||||
<!-- Breadcumb -->
|
<!-- Breadcumb -->
|
||||||
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
|
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
|
||||||
|
|
||||||
|
|
||||||
|
<div class="flex justify-center">
|
||||||
|
<div class="w-full max-w-6xl py-12">
|
||||||
|
<div class="text-center mb-8">
|
||||||
|
<h1 class="text-3xl font-bold mb-4">Kontak Kami</h1>
|
||||||
|
<p class="text-gray-600 max-w-4xl mx-auto">Hubungi kami untuk mendapatkan informasi, konsultasi, dan berbagai layanan terkait lingkungan hidup. Tim Dinas Lingkungan Hidup DKI Jakarta siap membantu Anda dalam upaya menjaga dan melestarikan lingkungan hidup di Jakarta.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="max-w-6xl mx-auto px-4 py-8">
|
||||||
|
<div class="grid md:grid-cols-3 gap-6 mb-12">
|
||||||
|
<div class="bg-white rounded-xl shadow-lg p-8 hover:shadow-xl transition-shadow duration-300 border border-gray-100">
|
||||||
|
<div class="flex flex-col items-center text-center">
|
||||||
|
<div class="w-16 h-16 bg-amber-100 rounded-full flex items-center justify-center mb-4">
|
||||||
|
<svg class="w-8 h-8 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"></path>
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Alamat</h3>
|
||||||
|
<p class="text-gray-600 leading-relaxed">Jl. Mandala V No.67, RT.1/RW.2, Cililitan, Kramatjati, Jakarta Timur 13640</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-white rounded-xl shadow-lg p-8 hover:shadow-xl transition-shadow duration-300 border border-gray-100">
|
||||||
|
<div class="flex flex-col items-center text-center">
|
||||||
|
<div class="w-16 h-16 bg-amber-100 rounded-full flex items-center justify-center mb-4">
|
||||||
|
<svg class="w-8 h-8 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Kontak</h3>
|
||||||
|
<div class="space-y-2">
|
||||||
|
<p><a href="tel:+62218092744" class="text-amber-600 hover:text-amber-800 transition-colors">(021) 8092744</a></p>
|
||||||
|
<p><a href="https://wa.me/6281234567890" class="text-amber-600 hover:text-amber-800 transition-colors flex items-center justify-center gap-2">
|
||||||
|
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488z"/>
|
||||||
|
</svg>
|
||||||
|
WhatsApp: +62 812-3456-7890
|
||||||
|
</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-white rounded-xl shadow-lg p-8 hover:shadow-xl transition-shadow duration-300 border border-gray-100">
|
||||||
|
<div class="flex flex-col items-center text-center">
|
||||||
|
<div class="w-16 h-16 bg-amber-100 rounded-full flex items-center justify-center mb-4">
|
||||||
|
<svg class="w-8 h-8 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 4.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Email</h3>
|
||||||
|
<p class="mb-4"><a href="mailto:dinaslh@jakarta.go.id" class="text-amber-600 hover:text-amber-800 transition-colors">dinaslh@jakarta.go.id</a></p>
|
||||||
|
<div class="flex space-x-4 justify-center">
|
||||||
|
<a href="https://www.facebook.com/DinasLingkunganHidupDKIjakarta/?locale=id_ID" class="w-10 h-10 bg-amber-500 rounded-full flex items-center justify-center text-white hover:bg-amber-400 transition-colors" title="Facebook">
|
||||||
|
<i data-lucide="facebook" class="w-5 h-5"></i>
|
||||||
|
</a>
|
||||||
|
<a href="https://x.com/dinaslhdki" class="w-10 h-10 bg-amber-500 rounded-full flex items-center justify-center text-white hover:bg-amber-400 transition-colors" title="Twitter">
|
||||||
|
<i data-lucide="twitter" class="w-5 h-5"></i>
|
||||||
|
</a>
|
||||||
|
<a href="https://www.instagram.com/dinaslhdki/" class="w-10 h-10 bg-amber-500 rounded-full flex items-center justify-center text-white hover:bg-amber-400 transition-colors" title="Instagram">
|
||||||
|
<i data-lucide="instagram" class="w-5 h-5"></i>
|
||||||
|
</a>
|
||||||
|
<a href="https://www.youtube.com/@@DLHDKIJakarta" class="w-10 h-10 bg-amber-500 rounded-full flex items-center justify-center text-white hover:bg-amber-400 transition-colors" title="YouTube">
|
||||||
|
<i data-lucide="youtube" class="w-5 h-5"></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Map Section -->
|
||||||
|
<div class="bg-white rounded-xl shadow-lg p-8 border border-gray-100">
|
||||||
|
<div class="flex items-center gap-3 mb-6">
|
||||||
|
<div class="w-10 h-10 bg-amber-100 rounded-full flex items-center justify-center">
|
||||||
|
<svg class="w-6 h-6 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 20l-5.447-2.724A1 1 0 013 16.382V5.618a1 1 0 011.447-.894L9 7m0 13l6-3m-6 3V7m6 10l4.553 2.276A1 1 0 0021 18.382V7.618a1 1 0 00-.553-.894L15 4m0 13V4m0 0L9 7"></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<h3 class="text-2xl font-semibold text-gray-900">Lokasi Kami</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="rounded-lg overflow-hidden shadow-md mb-6" style="height: 400px;">
|
||||||
|
<iframe
|
||||||
|
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3966.0130874655033!2d106.87106870000001!3d-6.2620057!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e69f322c223a8fd%3A0xa17bd1894dfbca3c!2sDinas%20LH%20DKI!5e0!3m2!1sid!2sid!4v1737517255876!5m2!1sid!2sid"
|
||||||
|
class="w-full h-full border-0"
|
||||||
|
allowfullscreen="true"
|
||||||
|
loading="lazy"
|
||||||
|
referrerpolicy="no-referrer-when-downgrade">
|
||||||
|
</iframe>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-gray-50 rounded-lg p-6">
|
||||||
|
<div class="flex items-center gap-3 mb-4">
|
||||||
|
<div class="w-8 h-8 bg-amber-100 rounded-full flex items-center justify-center">
|
||||||
|
<svg class="w-5 h-5 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<h3 class="text-xl font-semibold text-gray-900">Jam Operasional</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||||
|
<div class="bg-white rounded-lg p-4 border border-gray-200">
|
||||||
|
<p class="text-sm text-gray-500 mb-1">Senin - Kamis</p>
|
||||||
|
<p class="font-semibold text-gray-900">08.00 - 16.00 WIB</p>
|
||||||
|
</div>
|
||||||
|
<div class="bg-white rounded-lg p-4 border border-gray-200">
|
||||||
|
<p class="text-sm text-gray-500 mb-1">Jumat</p>
|
||||||
|
<p class="font-semibold text-gray-900">08.00 - 15.00 WIB</p>
|
||||||
|
</div>
|
||||||
|
<div class="bg-white rounded-lg p-4 border border-gray-200">
|
||||||
|
<p class="text-sm text-gray-500 mb-1">Sabtu - Minggu</p>
|
||||||
|
<p class="font-semibold text-red-600">Tutup</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div></svg>
|
||||||
|
|
@ -0,0 +1,264 @@
|
||||||
|
@{
|
||||||
|
Layout = "_Layout";
|
||||||
|
|
||||||
|
ViewData["Title"] = "Video - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["Description"] = "Kumpulan Video Edukasi dan Dokumentasi Kegiatan Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["Keywords"] = "Video, Dokumen Informasi, Kinerja, Lingkungan Hidup, DLH, Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["OgTitle"] = "Video - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["OgDescription"] = "Kumpulan Video Edukasi dan Dokumentasi Kegiatan Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["TwitterTitle"] = "Video - Dinas Lingkungan Hidup DKI Jakarta";
|
||||||
|
ViewData["TwitterDescription"] = "Kumpulan Video Edukasi dan Dokumentasi Kegiatan Lingkungan Hidup DKI Jakarta";
|
||||||
|
|
||||||
|
// Breadcumb
|
||||||
|
ViewData["BreadcrumbText"] = "Video";
|
||||||
|
ViewData["TitleBeforeHighlight"] = "Video";
|
||||||
|
ViewData["TitleHighlight"] = "Terkini";
|
||||||
|
}
|
||||||
|
|
||||||
|
<!-- Breadcumb -->
|
||||||
|
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
|
||||||
|
|
||||||
|
<section class="py-12 bg-gray-50">
|
||||||
|
<div class="container mx-auto max-w-6xl px-4">
|
||||||
|
|
||||||
|
<!-- Search and Year Filter -->
|
||||||
|
<div class="mb-8">
|
||||||
|
<div class="flex flex-col md:flex-row gap-4 items-center justify-center mb-6">
|
||||||
|
<div class="relative w-full">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="search-input"
|
||||||
|
placeholder="Cari video..."
|
||||||
|
class="w-full px-4 py-3 pr-11 pl-4 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500 transition"
|
||||||
|
autocomplete="off"
|
||||||
|
>
|
||||||
|
<div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
|
||||||
|
<i class="h-5 w-5 text-gray-400" data-lucide="search"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<select id="year-filter" class="px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
|
||||||
|
<option value="">Semua Tahun</option>
|
||||||
|
<option value="2024">2024</option>
|
||||||
|
<option value="2023">2023</option>
|
||||||
|
<option value="2022">2022</option>
|
||||||
|
<option value="2021">2021</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Video Grid -->
|
||||||
|
<div>
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" id="news-grid">
|
||||||
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300"
|
||||||
|
data-year="2024" data-title="Video Penghijauan Jakarta 2024" data-date="2024-01-15" data-desc="Video dokumentasi program penghijauan di Jakarta tahun 2024.">
|
||||||
|
<div class="aspect-w-16 aspect-h-9 w-full">
|
||||||
|
<iframe class="w-full h-48" src="https://www.youtube.com/embed/05NdDFoOHPE" title="Video Penghijauan Jakarta 2024" frameborder="0" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
|
<div class="p-6">
|
||||||
|
<h3 class="font-bold text-gray-800 mb-1 line-clamp-2">Video Penghijauan Jakarta 2024</h3>
|
||||||
|
<div class="text-xs text-gray-500 mb-2">15 Januari 2024</div>
|
||||||
|
<div class="text-gray-600 text-sm line-clamp-3">Video dokumentasi program penghijauan di Jakarta tahun 2024.</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300"
|
||||||
|
data-year="2024" data-title="Operasi Kebersihan DKI" data-date="2024-01-12" data-desc="Liputan operasi kebersihan lingkungan di seluruh DKI Jakarta.">
|
||||||
|
<div class="aspect-w-16 aspect-h-9 w-full">
|
||||||
|
<iframe class="w-full h-48" src="https://www.youtube.com/embed/ZIPBeKs4" title="Operasi Kebersihan DKI" frameborder="0" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
|
<div class="p-6">
|
||||||
|
<h3 class="font-bold text-gray-800 mb-1 line-clamp-2">Operasi Kebersihan DKI</h3>
|
||||||
|
<div class="text-xs text-gray-500 mb-2">12 Januari 2024</div>
|
||||||
|
<div class="text-gray-600 text-sm line-clamp-3">Liputan operasi kebersihan lingkungan di seluruh DKI Jakarta.</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
<article class="news-card bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300"
|
||||||
|
data-year="2024" data-title="Workshop Pengelolaan Sampah" data-date="2024-01-10" data-desc="Workshop edukasi pengelolaan sampah ramah lingkungan.">
|
||||||
|
<div class="aspect-w-16 aspect-h-9 w-full">
|
||||||
|
<iframe class="w-full h-48" src="https://www.youtube.com/embed/F0R5Wu2EY5c" title="Workshop Pengelolaan Sampah" frameborder="0" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
|
<div class="p-6">
|
||||||
|
<h3 class="font-bold text-gray-800 mb-1 line-clamp-2">Workshop Pengelolaan Sampah</h3>
|
||||||
|
<div class="text-xs text-gray-500 mb-2">10 Januari 2024</div>
|
||||||
|
<div class="text-gray-600 text-sm line-clamp-3">Workshop edukasi pengelolaan sampah ramah lingkungan.</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Pagination -->
|
||||||
|
<div class="flex justify-center items-center mt-10 space-x-2" id="pagination">
|
||||||
|
<button class="pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50" data-page="prev" disabled>
|
||||||
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button class="pagination-btn px-4 py-2 bg-green-600 text-white rounded-lg" data-page="1">1</button>
|
||||||
|
<button class="pagination-btn px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50" data-page="2">2</button>
|
||||||
|
<button class="pagination-btn px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50" data-page="3">3</button>
|
||||||
|
|
||||||
|
<button class="pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50" data-page="next">
|
||||||
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<register-block dynamic-section="css" key="jsPageVideo">
|
||||||
|
<style>
|
||||||
|
.filter-tab {
|
||||||
|
background-color: #e5e7eb;
|
||||||
|
color: #374151;
|
||||||
|
border-radius: 1rem;
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
.filter-tab:hover {
|
||||||
|
background-color: #d1d5db;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-tab.active {
|
||||||
|
background-color: #16a34a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.filter-tab.active:hover {
|
||||||
|
background-color: #15803d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-badge {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-clamp-2 {
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-clamp-3 {
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</register-block>
|
||||||
|
|
||||||
|
<register-block dynamic-section="scripts" key="jsPageVideo">
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const searchInput = document.getElementById('search-input');
|
||||||
|
const yearFilter = document.getElementById('year-filter');
|
||||||
|
const newsCards = document.querySelectorAll('.news-card');
|
||||||
|
// Pagination
|
||||||
|
let currentSearchTerm = '';
|
||||||
|
let currentYear = '';
|
||||||
|
let currentPage = 1;
|
||||||
|
const itemsPerPage = 6;
|
||||||
|
|
||||||
|
function filterNews() {
|
||||||
|
let visibleCards = [];
|
||||||
|
newsCards.forEach(card => {
|
||||||
|
const cardYear = card.dataset.year;
|
||||||
|
const cardTitle = card.dataset.title.toLowerCase();
|
||||||
|
const matchYear = !currentYear || cardYear === currentYear;
|
||||||
|
const matchSearch = !currentSearchTerm || cardTitle.includes(currentSearchTerm.toLowerCase());
|
||||||
|
if (matchYear && matchSearch) {
|
||||||
|
visibleCards.push(card);
|
||||||
|
card.style.display = 'block';
|
||||||
|
} else {
|
||||||
|
card.style.display = 'none';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
updatePagination(visibleCards.length);
|
||||||
|
paginateCards(visibleCards);
|
||||||
|
}
|
||||||
|
|
||||||
|
function paginateCards(visibleCards) {
|
||||||
|
const startIndex = (currentPage - 1) * itemsPerPage;
|
||||||
|
const endIndex = startIndex + itemsPerPage;
|
||||||
|
visibleCards.forEach((card, index) => {
|
||||||
|
if (index >= startIndex && index < endIndex) {
|
||||||
|
card.style.display = 'block';
|
||||||
|
} else {
|
||||||
|
card.style.display = 'none';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function updatePagination(totalItems) {
|
||||||
|
const totalPages = Math.ceil(totalItems / itemsPerPage);
|
||||||
|
const pagination = document.getElementById('pagination');
|
||||||
|
pagination.innerHTML = '';
|
||||||
|
// Previous button
|
||||||
|
const prevBtn = document.createElement('button');
|
||||||
|
prevBtn.className = 'pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50';
|
||||||
|
prevBtn.innerHTML = '<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>';
|
||||||
|
prevBtn.disabled = currentPage === 1;
|
||||||
|
prevBtn.addEventListener('click', () => {
|
||||||
|
if (currentPage > 1) {
|
||||||
|
currentPage--;
|
||||||
|
updatePaginationState();
|
||||||
|
filterNews();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
pagination.appendChild(prevBtn);
|
||||||
|
// Page numbers
|
||||||
|
for (let i = 1; i <= totalPages; i++) {
|
||||||
|
const pageBtn = document.createElement('button');
|
||||||
|
pageBtn.className = `pagination-btn px-4 py-2 rounded-lg ${i === currentPage ? 'bg-green-600 text-white' : 'border border-gray-300 hover:bg-gray-50'}`;
|
||||||
|
pageBtn.textContent = i;
|
||||||
|
pageBtn.addEventListener('click', () => {
|
||||||
|
currentPage = i;
|
||||||
|
updatePaginationState();
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
pagination.appendChild(pageBtn);
|
||||||
|
}
|
||||||
|
// Next button
|
||||||
|
const nextBtn = document.createElement('button');
|
||||||
|
nextBtn.className = 'pagination-btn px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50';
|
||||||
|
nextBtn.innerHTML = '<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>';
|
||||||
|
nextBtn.disabled = currentPage === totalPages;
|
||||||
|
nextBtn.addEventListener('click', () => {
|
||||||
|
if (currentPage < totalPages) {
|
||||||
|
currentPage++;
|
||||||
|
updatePaginationState();
|
||||||
|
filterNews();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
pagination.appendChild(nextBtn);
|
||||||
|
}
|
||||||
|
|
||||||
|
function updatePaginationState() {
|
||||||
|
const paginationBtns = document.querySelectorAll('.pagination-btn');
|
||||||
|
paginationBtns.forEach(btn => {
|
||||||
|
if (btn.textContent == currentPage) {
|
||||||
|
btn.className = 'pagination-btn px-4 py-2 bg-green-600 text-white rounded-lg';
|
||||||
|
} else if (!isNaN(btn.textContent)) {
|
||||||
|
btn.className = 'pagination-btn px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
searchInput.addEventListener('input', function() {
|
||||||
|
currentSearchTerm = this.value;
|
||||||
|
currentPage = 1;
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
|
||||||
|
yearFilter.addEventListener('change', function() {
|
||||||
|
currentYear = this.value;
|
||||||
|
currentPage = 1;
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initial load
|
||||||
|
filterNews();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</register-block>
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
@addTagHelper *, InfiniLore.Lucide
|
@addTagHelper *, InfiniLore.Lucide
|
||||||
|
|
||||||
<div id="mega-menu-5" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40">
|
<div id="mega-menu-5" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40">
|
||||||
<div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-2 gap-4">
|
<div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
<a href="@Url.Action("Berita", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
|
<a href="@Url.Action("Berita", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
|
||||||
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="newspaper"></i></div>
|
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="newspaper"></i></div>
|
||||||
<div>
|
<div>
|
||||||
|
|
@ -10,6 +10,13 @@
|
||||||
<p class="text-sm text-gray-500">Kegiatan dan informasi terkini dari DLH.</p>
|
<p class="text-sm text-gray-500">Kegiatan dan informasi terkini dari DLH.</p>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
|
<a href="@Url.Action("Video", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
|
||||||
|
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="video"></i></div>
|
||||||
|
<div>
|
||||||
|
<div class="font-medium text-gray-900 hover:text-orange-700">Video</div>
|
||||||
|
<p class="text-sm text-gray-500">Kegiatan dan Video terkini dari DLH.</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
<a href="@Url.Action("Kontak", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
|
<a href="@Url.Action("Kontak", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
|
||||||
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="phone"></i></div>
|
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="phone"></i></div>
|
||||||
<div>
|
<div>
|
||||||
|
|
|
||||||
|
|
@ -93,7 +93,7 @@
|
||||||
<h4 class="font-semibold text-xl md:text-2xl">Tentang<br class="hidden md:block"> Kami</h4>
|
<h4 class="font-semibold text-xl md:text-2xl">Tentang<br class="hidden md:block"> Kami</h4>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col space-y-2">
|
<div class="flex flex-col space-y-2">
|
||||||
<a href="#" class="hover:underline">Visi Misi</a>
|
@* <a href="#" class="hover:underline">Visi Misi</a> *@
|
||||||
<a href="#" class="hover:underline">Struktur Organisasi</a>
|
<a href="#" class="hover:underline">Struktur Organisasi</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -13,7 +13,7 @@ using System.Reflection;
|
||||||
[assembly: System.Reflection.AssemblyCompanyAttribute("dlh-net")]
|
[assembly: System.Reflection.AssemblyCompanyAttribute("dlh-net")]
|
||||||
[assembly: System.Reflection.AssemblyConfigurationAttribute("Debug")]
|
[assembly: System.Reflection.AssemblyConfigurationAttribute("Debug")]
|
||||||
[assembly: System.Reflection.AssemblyFileVersionAttribute("1.0.0.0")]
|
[assembly: System.Reflection.AssemblyFileVersionAttribute("1.0.0.0")]
|
||||||
[assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0+854ebf398ca960fe17b41b1ef5ca4d8b7138c8fe")]
|
[assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0+ce6b09a951eabe1d771c3062f5b20e6853a5712f")]
|
||||||
[assembly: System.Reflection.AssemblyProductAttribute("dlh-net")]
|
[assembly: System.Reflection.AssemblyProductAttribute("dlh-net")]
|
||||||
[assembly: System.Reflection.AssemblyTitleAttribute("dlh-net")]
|
[assembly: System.Reflection.AssemblyTitleAttribute("dlh-net")]
|
||||||
[assembly: System.Reflection.AssemblyVersionAttribute("1.0.0.0")]
|
[assembly: System.Reflection.AssemblyVersionAttribute("1.0.0.0")]
|
||||||
|
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
c80e0e390873eb3277c7e8d1ec78cff7c786fdc6d279095127bd2d0c6f9fc73c
|
50241745ee749d4cb358417c1d708ab3089752260da74657a5b4bd229d9f74f3
|
||||||
|
|
|
||||||
|
|
@ -160,10 +160,18 @@ build_metadata.AdditionalFiles.CssScope =
|
||||||
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2VwdXRhclxCZXJpdGEuY3NodG1s
|
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2VwdXRhclxCZXJpdGEuY3NodG1s
|
||||||
build_metadata.AdditionalFiles.CssScope =
|
build_metadata.AdditionalFiles.CssScope =
|
||||||
|
|
||||||
|
[C:/laragon/www/dlh-net/Views/Seputar/DetailBerita.cshtml]
|
||||||
|
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2VwdXRhclxEZXRhaWxCZXJpdGEuY3NodG1s
|
||||||
|
build_metadata.AdditionalFiles.CssScope =
|
||||||
|
|
||||||
[C:/laragon/www/dlh-net/Views/Seputar/Kontak.cshtml]
|
[C:/laragon/www/dlh-net/Views/Seputar/Kontak.cshtml]
|
||||||
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2VwdXRhclxLb250YWsuY3NodG1s
|
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2VwdXRhclxLb250YWsuY3NodG1s
|
||||||
build_metadata.AdditionalFiles.CssScope =
|
build_metadata.AdditionalFiles.CssScope =
|
||||||
|
|
||||||
|
[C:/laragon/www/dlh-net/Views/Seputar/Video.cshtml]
|
||||||
|
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2VwdXRhclxWaWRlby5jc2h0bWw=
|
||||||
|
build_metadata.AdditionalFiles.CssScope =
|
||||||
|
|
||||||
[C:/laragon/www/dlh-net/Views/Shared/Components/FlipBook/FlipBook.cshtml]
|
[C:/laragon/www/dlh-net/Views/Shared/Components/FlipBook/FlipBook.cshtml]
|
||||||
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2hhcmVkXENvbXBvbmVudHNcRmxpcEJvb2tcRmxpcEJvb2suY3NodG1s
|
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcU2hhcmVkXENvbXBvbmVudHNcRmxpcEJvb2tcRmxpcEJvb2suY3NodG1s
|
||||||
build_metadata.AdditionalFiles.CssScope =
|
build_metadata.AdditionalFiles.CssScope =
|
||||||
|
|
|
||||||
|
|
@ -6440,4 +6440,4 @@ C:\laragon\www\dlh-net\obj\Debug\net9.0\rpswa.dswa.cache.json
|
||||||
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjimswa.dswa.cache.json
|
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjimswa.dswa.cache.json
|
||||||
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmrazor.dswa.cache.json
|
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmrazor.dswa.cache.json
|
||||||
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmcshtml.dswa.cache.json
|
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmcshtml.dswa.cache.json
|
||||||
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\hc40dw3fux-ymjnsy4hf6.gz
|
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\hc40dw3fux-icjhhgs8zp.gz
|
||||||
|
|
|
||||||
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
||||||
tYTHXdZlEpDTNz+PACFcSRSmqSA080IMHFUyXyZu0MQ=
|
MGBkcf8BzLqzlGyg1sPt/5VlO3+r3Nc9VfvDL4GSRxE=
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -70,6 +70,8 @@
|
||||||
--color-cyan-500: oklch(71.5% 0.143 215.221);
|
--color-cyan-500: oklch(71.5% 0.143 215.221);
|
||||||
--color-cyan-600: oklch(60.9% 0.126 221.723);
|
--color-cyan-600: oklch(60.9% 0.126 221.723);
|
||||||
--color-cyan-800: oklch(45% 0.085 224.283);
|
--color-cyan-800: oklch(45% 0.085 224.283);
|
||||||
|
--color-sky-500: oklch(68.5% 0.169 237.323);
|
||||||
|
--color-sky-600: oklch(58.8% 0.158 241.966);
|
||||||
--color-blue-50: oklch(97% 0.014 254.604);
|
--color-blue-50: oklch(97% 0.014 254.604);
|
||||||
--color-blue-100: oklch(93.2% 0.032 255.585);
|
--color-blue-100: oklch(93.2% 0.032 255.585);
|
||||||
--color-blue-200: oklch(88.2% 0.059 254.128);
|
--color-blue-200: oklch(88.2% 0.059 254.128);
|
||||||
|
|
@ -166,6 +168,7 @@
|
||||||
--tracking-widest: 0.1em;
|
--tracking-widest: 0.1em;
|
||||||
--leading-tight: 1.25;
|
--leading-tight: 1.25;
|
||||||
--leading-relaxed: 1.625;
|
--leading-relaxed: 1.625;
|
||||||
|
--radius-sm: 0.25rem;
|
||||||
--radius-md: 0.375rem;
|
--radius-md: 0.375rem;
|
||||||
--radius-lg: 0.5rem;
|
--radius-lg: 0.5rem;
|
||||||
--radius-xl: 0.75rem;
|
--radius-xl: 0.75rem;
|
||||||
|
|
@ -441,6 +444,9 @@
|
||||||
.right-0 {
|
.right-0 {
|
||||||
right: calc(var(--spacing) * 0);
|
right: calc(var(--spacing) * 0);
|
||||||
}
|
}
|
||||||
|
.right-1 {
|
||||||
|
right: calc(var(--spacing) * 1);
|
||||||
|
}
|
||||||
.right-2 {
|
.right-2 {
|
||||||
right: calc(var(--spacing) * 2);
|
right: calc(var(--spacing) * 2);
|
||||||
}
|
}
|
||||||
|
|
@ -1162,6 +1168,12 @@
|
||||||
.min-w-0 {
|
.min-w-0 {
|
||||||
min-width: calc(var(--spacing) * 0);
|
min-width: calc(var(--spacing) * 0);
|
||||||
}
|
}
|
||||||
|
.min-w-\[160px\] {
|
||||||
|
min-width: 160px;
|
||||||
|
}
|
||||||
|
.min-w-\[180px\] {
|
||||||
|
min-width: 180px;
|
||||||
|
}
|
||||||
.flex-1 {
|
.flex-1 {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
@ -1315,6 +1327,9 @@
|
||||||
.resize {
|
.resize {
|
||||||
resize: both;
|
resize: both;
|
||||||
}
|
}
|
||||||
|
.appearance-none {
|
||||||
|
appearance: none;
|
||||||
|
}
|
||||||
.columns-2 {
|
.columns-2 {
|
||||||
columns: 2;
|
columns: 2;
|
||||||
}
|
}
|
||||||
|
|
@ -1369,6 +1384,9 @@
|
||||||
.justify-end {
|
.justify-end {
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
}
|
}
|
||||||
|
.justify-start {
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
.gap-0 {
|
.gap-0 {
|
||||||
gap: calc(var(--spacing) * 0);
|
gap: calc(var(--spacing) * 0);
|
||||||
}
|
}
|
||||||
|
|
@ -1555,6 +1573,9 @@
|
||||||
.rounded-md {
|
.rounded-md {
|
||||||
border-radius: var(--radius-md);
|
border-radius: var(--radius-md);
|
||||||
}
|
}
|
||||||
|
.rounded-sm {
|
||||||
|
border-radius: var(--radius-sm);
|
||||||
|
}
|
||||||
.rounded-xl {
|
.rounded-xl {
|
||||||
border-radius: var(--radius-xl);
|
border-radius: var(--radius-xl);
|
||||||
}
|
}
|
||||||
|
|
@ -1861,6 +1882,9 @@
|
||||||
.bg-pink-50 {
|
.bg-pink-50 {
|
||||||
background-color: var(--color-pink-50);
|
background-color: var(--color-pink-50);
|
||||||
}
|
}
|
||||||
|
.bg-pink-600 {
|
||||||
|
background-color: var(--color-pink-600);
|
||||||
|
}
|
||||||
.bg-purple-50 {
|
.bg-purple-50 {
|
||||||
background-color: var(--color-purple-50);
|
background-color: var(--color-purple-50);
|
||||||
}
|
}
|
||||||
|
|
@ -1891,6 +1915,9 @@
|
||||||
.bg-rose-600 {
|
.bg-rose-600 {
|
||||||
background-color: var(--color-rose-600);
|
background-color: var(--color-rose-600);
|
||||||
}
|
}
|
||||||
|
.bg-sky-500 {
|
||||||
|
background-color: var(--color-sky-500);
|
||||||
|
}
|
||||||
.bg-slate-100 {
|
.bg-slate-100 {
|
||||||
background-color: var(--color-slate-100);
|
background-color: var(--color-slate-100);
|
||||||
}
|
}
|
||||||
|
|
@ -2599,9 +2626,21 @@
|
||||||
.pr-1 {
|
.pr-1 {
|
||||||
padding-right: calc(var(--spacing) * 1);
|
padding-right: calc(var(--spacing) * 1);
|
||||||
}
|
}
|
||||||
|
.pr-3 {
|
||||||
|
padding-right: calc(var(--spacing) * 3);
|
||||||
|
}
|
||||||
.pr-4 {
|
.pr-4 {
|
||||||
padding-right: calc(var(--spacing) * 4);
|
padding-right: calc(var(--spacing) * 4);
|
||||||
}
|
}
|
||||||
|
.pr-10 {
|
||||||
|
padding-right: calc(var(--spacing) * 10);
|
||||||
|
}
|
||||||
|
.pr-11 {
|
||||||
|
padding-right: calc(var(--spacing) * 11);
|
||||||
|
}
|
||||||
|
.pr-12 {
|
||||||
|
padding-right: calc(var(--spacing) * 12);
|
||||||
|
}
|
||||||
.pb-0 {
|
.pb-0 {
|
||||||
padding-bottom: calc(var(--spacing) * 0);
|
padding-bottom: calc(var(--spacing) * 0);
|
||||||
}
|
}
|
||||||
|
|
@ -2632,12 +2671,18 @@
|
||||||
.pl-3 {
|
.pl-3 {
|
||||||
padding-left: calc(var(--spacing) * 3);
|
padding-left: calc(var(--spacing) * 3);
|
||||||
}
|
}
|
||||||
|
.pl-4 {
|
||||||
|
padding-left: calc(var(--spacing) * 4);
|
||||||
|
}
|
||||||
.pl-8 {
|
.pl-8 {
|
||||||
padding-left: calc(var(--spacing) * 8);
|
padding-left: calc(var(--spacing) * 8);
|
||||||
}
|
}
|
||||||
.pl-10 {
|
.pl-10 {
|
||||||
padding-left: calc(var(--spacing) * 10);
|
padding-left: calc(var(--spacing) * 10);
|
||||||
}
|
}
|
||||||
|
.pl-11 {
|
||||||
|
padding-left: calc(var(--spacing) * 11);
|
||||||
|
}
|
||||||
.pl-12 {
|
.pl-12 {
|
||||||
padding-left: calc(var(--spacing) * 12);
|
padding-left: calc(var(--spacing) * 12);
|
||||||
}
|
}
|
||||||
|
|
@ -2876,6 +2921,9 @@
|
||||||
.text-orange-600 {
|
.text-orange-600 {
|
||||||
color: var(--color-orange-600);
|
color: var(--color-orange-600);
|
||||||
}
|
}
|
||||||
|
.text-orange-700 {
|
||||||
|
color: var(--color-orange-700);
|
||||||
|
}
|
||||||
.text-orange-800 {
|
.text-orange-800 {
|
||||||
color: var(--color-orange-800);
|
color: var(--color-orange-800);
|
||||||
}
|
}
|
||||||
|
|
@ -2888,12 +2936,18 @@
|
||||||
.text-purple-600 {
|
.text-purple-600 {
|
||||||
color: var(--color-purple-600);
|
color: var(--color-purple-600);
|
||||||
}
|
}
|
||||||
|
.text-purple-700 {
|
||||||
|
color: var(--color-purple-700);
|
||||||
|
}
|
||||||
.text-purple-800 {
|
.text-purple-800 {
|
||||||
color: var(--color-purple-800);
|
color: var(--color-purple-800);
|
||||||
}
|
}
|
||||||
.text-red-500 {
|
.text-red-500 {
|
||||||
color: var(--color-red-500);
|
color: var(--color-red-500);
|
||||||
}
|
}
|
||||||
|
.text-red-600 {
|
||||||
|
color: var(--color-red-600);
|
||||||
|
}
|
||||||
.text-rose-600 {
|
.text-rose-600 {
|
||||||
color: var(--color-rose-600);
|
color: var(--color-rose-600);
|
||||||
}
|
}
|
||||||
|
|
@ -2970,6 +3024,11 @@
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
.placeholder-gray-400 {
|
||||||
|
&::placeholder {
|
||||||
|
color: var(--color-gray-400);
|
||||||
|
}
|
||||||
|
}
|
||||||
.opacity-0 {
|
.opacity-0 {
|
||||||
opacity: 0%;
|
opacity: 0%;
|
||||||
}
|
}
|
||||||
|
|
@ -3213,6 +3272,11 @@
|
||||||
.ring-inset {
|
.ring-inset {
|
||||||
--tw-ring-inset: inset;
|
--tw-ring-inset: inset;
|
||||||
}
|
}
|
||||||
|
.group-focus-within\:text-green-500 {
|
||||||
|
&:is(:where(.group):focus-within *) {
|
||||||
|
color: var(--color-green-500);
|
||||||
|
}
|
||||||
|
}
|
||||||
.group-hover\:block {
|
.group-hover\:block {
|
||||||
&:is(:where(.group):hover *) {
|
&:is(:where(.group):hover *) {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3285,6 +3349,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.group-hover\:border-gray-300 {
|
||||||
|
&:is(:where(.group):hover *) {
|
||||||
|
@media (hover: hover) {
|
||||||
|
border-color: var(--color-gray-300);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.group-hover\:border-white\/50 {
|
.group-hover\:border-white\/50 {
|
||||||
&:is(:where(.group):hover *) {
|
&:is(:where(.group):hover *) {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3510,6 +3581,14 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:-translate-y-0\.5 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
--tw-translate-y: calc(var(--spacing) * -0.5);
|
||||||
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:-translate-y-1 {
|
.hover\:-translate-y-1 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3561,6 +3640,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:border-gray-300 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
border-color: var(--color-gray-300);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:border-orange-400 {
|
.hover\:border-orange-400 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3582,6 +3668,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-amber-400 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-amber-400);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-amber-700 {
|
.hover\:bg-amber-700 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3596,6 +3689,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-blue-200 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-blue-200);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-blue-700 {
|
.hover\:bg-blue-700 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3624,6 +3724,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-gray-300 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-gray-300);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-green-100 {
|
.hover\:bg-green-100 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3631,6 +3738,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-green-200 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-green-200);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-green-600 {
|
.hover\:bg-green-600 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3659,6 +3773,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-orange-200 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-orange-200);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-orange-500 {
|
.hover\:bg-orange-500 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3687,6 +3808,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-pink-700 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-pink-700);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-purple-100 {
|
.hover\:bg-purple-100 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3694,6 +3822,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-purple-200 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-purple-200);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-purple-700 {
|
.hover\:bg-purple-700 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3715,6 +3850,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:bg-sky-600 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
background-color: var(--color-sky-600);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:bg-slate-700 {
|
.hover\:bg-slate-700 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3818,6 +3960,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:text-amber-800 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
color: var(--color-amber-800);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:text-blue-800 {
|
.hover\:text-blue-800 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3874,6 +4023,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:text-green-800 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
color: var(--color-green-800);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:text-orange-500 {
|
.hover\:text-orange-500 {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3902,6 +4058,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.hover\:text-purple-800 {
|
||||||
|
&:hover {
|
||||||
|
@media (hover: hover) {
|
||||||
|
color: var(--color-purple-800);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.hover\:text-white {
|
.hover\:text-white {
|
||||||
&:hover {
|
&:hover {
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
|
|
@ -3983,6 +4146,11 @@
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.focus\:bg-white {
|
||||||
|
&:focus {
|
||||||
|
background-color: var(--color-white);
|
||||||
|
}
|
||||||
|
}
|
||||||
.focus\:ring-2 {
|
.focus\:ring-2 {
|
||||||
&:focus {
|
&:focus {
|
||||||
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
||||||
|
|
@ -4000,6 +4168,11 @@
|
||||||
--tw-ring-color: var(--color-blue-500);
|
--tw-ring-color: var(--color-blue-500);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.focus\:ring-green-100 {
|
||||||
|
&:focus {
|
||||||
|
--tw-ring-color: var(--color-green-100);
|
||||||
|
}
|
||||||
|
}
|
||||||
.focus\:ring-green-200 {
|
.focus\:ring-green-200 {
|
||||||
&:focus {
|
&:focus {
|
||||||
--tw-ring-color: var(--color-green-200);
|
--tw-ring-color: var(--color-green-200);
|
||||||
|
|
@ -4029,6 +4202,11 @@
|
||||||
scale: var(--tw-scale-x) var(--tw-scale-y);
|
scale: var(--tw-scale-x) var(--tw-scale-y);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.disabled\:opacity-50 {
|
||||||
|
&:disabled {
|
||||||
|
opacity: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
.sm\:mb-6 {
|
.sm\:mb-6 {
|
||||||
@media (width >= 40rem) {
|
@media (width >= 40rem) {
|
||||||
margin-bottom: calc(var(--spacing) * 6);
|
margin-bottom: calc(var(--spacing) * 6);
|
||||||
|
|
@ -4570,6 +4748,11 @@
|
||||||
height: 35vh;
|
height: 35vh;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.lg\:w-1\/2 {
|
||||||
|
@media (width >= 64rem) {
|
||||||
|
width: calc(1/2 * 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
.lg\:w-1\/3 {
|
.lg\:w-1\/3 {
|
||||||
@media (width >= 64rem) {
|
@media (width >= 64rem) {
|
||||||
width: calc(1/3 * 100%);
|
width: calc(1/3 * 100%);
|
||||||
|
|
@ -4585,6 +4768,11 @@
|
||||||
width: calc(var(--spacing) * 8);
|
width: calc(var(--spacing) * 8);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.lg\:w-auto {
|
||||||
|
@media (width >= 64rem) {
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
.lg\:flex-1 {
|
.lg\:flex-1 {
|
||||||
@media (width >= 64rem) {
|
@media (width >= 64rem) {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|
@ -4620,6 +4808,16 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.lg\:justify-between {
|
||||||
|
@media (width >= 64rem) {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.lg\:justify-center {
|
||||||
|
@media (width >= 64rem) {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
.lg\:justify-start {
|
.lg\:justify-start {
|
||||||
@media (width >= 64rem) {
|
@media (width >= 64rem) {
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue