Skip to content

Commit

Permalink
Create informasi.html
Browse files Browse the repository at this point in the history
  • Loading branch information
vatih2675 authored Dec 13, 2024
1 parent 585abc6 commit b7f3b61
Showing 1 changed file with 215 additions and 0 deletions.
215 changes: 215 additions & 0 deletions informasi.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,215 @@
<!doctype html>
<html class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>P3H YM Gorontalo | RUSLAN SAMUEL</title>
<link rel="shortcut icon" href="assets/Icon Halal Indonesia 2.png" type="image/x-icon">
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
<!-- <link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet"> -->
<style>
::-webkit-scrollbar{
width: 0;
}
</style>
</head>
<body id="beranda" class="cursor-default">
<nav class="bg-white w-full sm:px-24 flex justify-between items-center shadow-md sticky top-0 absolute" z-index="999">
<a href="#beranda" class="flex justify-center items-center gap-2 ps-4 py-2">
<img src="" alt="Halal Indonesia" class="h-4 sm:h-8 elLogoHalal">
<img src="" alt="LP3H YM Gorontalo" class="h-4 sm:h-8 elLogoLp3h">
<div class="flex flex-col justify-center items-start">
<h1 class="sm:text-base text-sm font-bold text-purple-900 uppercase elNama"></h1>
<h2 class="sm:block hidden text-xs text-purple-700 elProfesi"></h2>
</div>
</a>
<div class="flex justify-center items-center" id="elMenu"></div>
</nav>
<section class="w-full p-4 sm:p-0 shadow-md" style="background-image: url('assets/abstract-dark-purple-3d-background-with-purple-and-white-lines-paper-cut-style-textured-usable-for-decorative-web-layout-poster-banner-corporate-brochure-and-seminar-template-design-vector.jpg'); background-position: center; background-repeat: no-repeat; background-size: cover;">
<div class="w-full h-full flex flex-col sm:flex-row justify-start sm:justify-between items-start sm:items-center p-0 sm:p-24 gap-4 sm:gap-0">
<div class="flex justify-center items-center gap-3 sm:gap-7">
<img src="" alt="Halal Indonesia" class="h-14 sm:h-44 elLogoHalalPutih">
<div class="flex flex-col justify-center items-start sm:gap-3">
<h1 class="font-black text-lg sm:text-5xl text-white uppercase elNama" data-aos="fade-down" data-aos-easing="linear" data-aos-duration="500"></h1>
<h2 class="text-xs sm:text-3xl text-purple-500" data-aos="fade-right" data-aos-easing="linear" data-aos-duration="500">Pendamping <span class="text-white">Proses Produk Halal</span></h2>
<h3 class="text-xs sm:text-3xl text-purple-500" data-aos="fade-up" data-aos-easing="linear" data-aos-duration="500">No. Registrasi : <span class="text-white elNoreg"></span></h3>
</div>
</div>
<div class="sm:flex-col sm:flex hidden justify-center items-start gap-10 p-8 rounded-3xl bg-purple-300/80 shadow-xl gap-5">
<div class="flex justify-center items-center gap-2">
<img src="" alt="BPJPH" class="w-12 sm:w-24 elLogoBpjph">
<div class="flex flex-col justify-center items-start">
<h1 class="font-black text-4xl">BPJPH</h1>
<h1 class="text-xs">BADAN PENYELENGGARA</h1>
<h1 class="text-xs">JAMINAN PRODUK HALAL</h1>
<h1 class="text-xs">KEMENTRIAN AGAMA RI</h1>
</div>
</div>
<div class="flex justify-center items-center gap-2">
<img src="" alt="LP3H YM Gorontalo" class="w-12 sm:w-24 elLogoLp3h">
<div class="flex flex-col justify-center items-start">
<h1 class="font-black text-4xl">LP3H</h1>
<h1 class="text-xs">YAYASAN MATAHARI</h1>
<h1 class="text-xs font-black">G O R O N T A L O</h1>
</div>
</div>
</div>
</div>
</section>
<section class="p-4 sm:p-24 text-gray-700" data-aos="zoom-in" data-aos-easing="linear" data-aos-duration="500">
<h1 class="font-bold text-lg sm:text-2xl text-center text-purple-800 mb-1 sm:mb-3">DOKUMEN PELAKU USAHA</h1>
<div class="w-full sm:w-9/12 mx-auto">
<table class="w-full text-xs sm:text-base">
<thead>
<tr>
<th class="border border-gray-300 bg-purple-800 text-white" width="45%">DOKUMEN</th>
<th class="border border-gray-300 bg-purple-800 text-white">KETERANGAN</th>
</tr>
</thead>
<tbody>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">Surat Permohonan Sertifikat Halal</td>
<td class="border border-gray-300 p-1 sm:p-2">Tersedia di SiHalal (terbentuk otomatis oleh sistem)</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">NIB (wajib / dibuat dulu jika tidak ada) <span class="text-red-500">*</span></td>
<td class="border border-gray-300 p-1 sm:p-2">Diisi di SiHalal (akan diintegrasi dengan OSS BKPM)</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2 align-top sm-align-middle">
<p class="font-bold">Penyelia Halal</p>
<p>- Penetapan</p>
<p>- KTP <span class="text-red-500">*</span></p>
<p>- DRH</p>
</td>
<td class="border border-gray-300 p-1 sm:p-2 align-top sm-align-middle">
<p>&nbsp;</p>
<p>Tersedia di SiHalal (terbentuk otomatis oleh sistem)</p>
<p>Diunggah di SiHalal</p>
<p>Diisi di Sihalal</p>
</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">Nama Produk <span class="text-red-500">*</span></td>
<td class="border border-gray-300 p-1 sm:p-2">Diisi di SiHalal (dengan foto produk)</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">Daftar Bahan Produk <span class="text-red-500">*</span></td>
<td class="border border-gray-300 p-1 sm:p-2">Diisi di SiHalal</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">Proses Produk Halal <span class="text-red-500">*</span></td>
<td class="border border-gray-300 p-1 sm:p-2">Diisi di SiHalal (deskripsi proses pembuatan produk halal)</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">Izin Edar / SLHS (jika ada)</td>
<td class="border border-gray-300 p-1 sm:p-2">Diunggah di SiHalal</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">SJPH</td>
<td class="border border-gray-300 p-1 sm:p-2">Tersedia di SiHalal (terbentuk otomatis oleh sistem)</td>
</tr>
<tr>
<td class="border border-gray-300 p-1 sm:p-2">Akad / Ikrar Pernyataan Kehalalan Produk</td>
<td class="border border-gray-300 p-1 sm:p-2">Tersedia di SiHalal (terbentuk otomatis oleh sistem)</td>
</tr>
</tbody>
</table>
<span class="italic text-xs"><span class="text-red-500">*</span> Disediakan dari Pelaku Usaha (PU)</span>
</div>
</section>
<section class="p-4 sm:p-24 text-purple-300 bg-gradient-to-r from-purple-900 to-purple-600 shadow-md">
<h1 class="font-bold text-lg sm:text-2xl text-center text-white mb-1 sm:mb-3">BIAYA PENGAJUAN</h1>
<p class="text-center text-sm sm:text-base mx-auto w-full sm:w-6/12">Biaya pengajuan sertifikasi halal secara <span class="italic">"Self Declare"</span> oleh Pelaku Usaha (PU) di Provinsi Gorontalo berbeda-beda tiap wilayah Kabupaten/Kota</p>
<div class="w-full sm:w-7/12 mx-auto">
<div class="flex flex-col sm:flex-row justify-center items-center gap-1 sm:gap-3 my-5 sm:my-10">
<span class="text-sm">Mulai dari</span>
<span class="font-bold text-3xl px-3 py-1 bg-white rounded-r-full rounded-l-full text-purple-600">Rp. 305.000</span>
<span class="text-sm hidden">sampai dengan</span>
<span class="font-bold text-3xl px-3 py-1 bg-white rounded-r-full rounded-l-full text-purple-600 hidden">Rp. 505.000</span>
</div>
<!-- <table class="w-full text-white">
<thead>
<tr>
<th class="border border-gray-300 bg-white text-purple-800">WILAYAH</th>
<th class="border border-gray-300 bg-white text-purple-800">TARIF (Rp)</th>
</tr>
</thead>
<tbody>
<tr>
<td class="border border-gray-300 p-2">Kota Gorontalo</td>
<td class="border border-gray-300 p-2 text-end">305.000</td>
</tr>
<tr>
<td class="border border-gray-300 p-2">Kab. Bone Bolango</td>
<td class="border border-gray-300 p-2 text-end">330.000</td>
</tr>
<tr>
<td class="border border-gray-300 p-2">Kab. Gorontalo</td>
<td class="border border-gray-300 p-2 text-end">355.000</td>
</tr>
<tr>
<td class="border border-gray-300 p-2">Kab. Gorontalo Utara</td>
<td class="border border-gray-300 p-2 text-end">405.000</td>
</tr>
<tr>
<td class="border border-gray-300 p-2">Kab. Boalemo</td>
<td class="border border-gray-300 p-2 text-end">455.000</td>
</tr>
<tr>
<td class="border border-gray-300 p-2">Kab. Pohuwato</td>
<td class="border border-gray-300 p-2 text-end">505.000</td>
</tr>
</tbody>
</table> -->
<span class="italic text-xs text-center block">Tarif dihitung tiap pengajuan.</span>
<span class="italic text-xs text-center block">Satu pengajuan maksimal 10 produk.</span>
<span class="italic text-xs text-center block">Tarif sudah termasuk administrasi dan biaya lainnya.</span>
</div>
</section>
<section class="p-4 sm:p-24 flex flex-col justify-center items-center text-gray-700">
<span class="text-base sm:text-xl font-black text-purple-600">Bagi Pelaku Usaha Mikro dan Kecil</span>
<span class="text-lg sm:text-3xl font-medium text-purple-800">Penahapan Kewajiban Bersertifikat Halal</span>
<span class="mb-4 text-sm sm:text-base text-center">Untuk produk makanan, minuman, hasil sembelihan dan jasa penyembelihan</span>
<span class="text-xs px-2 py-1 rounded-r-full rounded-l-full bg-purple-600 text-white">Mulai Tanggal</span>
<span class="text-lg font-bold text-purple-800 mb-3">17 Oktober 2019</span>
<span class="text-xs px-2 py-1 rounded-r-full rounded-l-full bg-purple-600 text-white">Sampai Tanggal</span>
<span class="text-lg font-bold text-purple-800 mb-4">17 Oktober 2026</span>
<span class="text-xs italic text-center">(Sumber : Pasal 160 PP No. 42 Tahun 2024 tentang Penyelenggaraan Bidang Jaminan Produk Halal)</span>
</section>
<section class="px-4 sm:px-24 py-4 flex justify-center items-center gap-10 text-purple-300 bg-gradient-to-l from-green-500 to-orange-500 shadow-md">
<span onclick="window.open('https://s.id/RuslanSamuel-P3H')" class="text-white hover:underline cursor-pointer sm:text-base text-xs">Hubungi sekarang untuk pendampingan proses produk halal</span>
</section>
<section class="px-4 sm:px-24 py-4 sm:py-10 flex flex-col sm:flex-row justify-center items-center gap-4 sm:gap-10 text-purple-300 bg-gradient-to-l from-purple-900 to-purple-600 shadow-md">
<div class="w-full sm:w-1/3 flex flex-col justify-center items-start order-1">
<a href="#beranda" class="flex flex-col justify-center items-start mb-4">
<h1 class="text-2xl font-bold text-white uppercase elNama"></h1>
<h2 class="text-white elProfesi"></h2>
</a>
<div class="flex flex-col justify-center items-start gap-1 text-xs">
<span class="cursor-pointer flex gap-1 justify-start items-start text-white hover:underline elAlamat"></span>
<span class="cursor-pointer flex gap-1 justify-start items-start text-white hover:underline elWhatsapp"></span>
<span class="cursor-pointer flex gap-1 justify-start items-start text-white hover:underline elEmail"></span>
<span class="cursor-pointer flex gap-1 justify-start items-start text-white hover:underline elWebsite"></span>
</div>
</div>
<div class="w-full sm:w-1/3 mx-auto flex justify-around sm:justify-center items-center gap-6 order-3 sm:order-2">
<img src="" alt="Halal Indonesia" class="h-12 sm:h-28 elLogoHalalPutih">
<img src="" alt="BPJPH" class="h-12 sm:h-28 elLogoBpjph">
<img src="" alt="LP3H YM Gorontalo" class="h-12 sm:h-28 elLogoLp3h">
</div>
<div class="w-full sm:w-1/3 h-full flex justify-center items-center order-2 sm:order-3">
<iframe src="" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade" class="w-full aspect-video rounded-xl shadow-md elMaps"></iframe>
</div>
</section>

<!-- SCRIPT START -->
<!-- <script src="https://unpkg.com/[email protected]/dist/aos.js"></script> -->
<script src="script.js"></script>
<script>
// AOS.init();
</script>
<!-- SCRIPT END -->
</body>
</html>

0 comments on commit b7f3b61

Please sign in to comment.