Skip to content

Commit

Permalink
Create formulir.html
Browse files Browse the repository at this point in the history
  • Loading branch information
@vatih2675
vatih2675 authored Dec 13, 2024
1 parent 09ce15e commit 64a852e
Showing 1 changed file with 98 additions and 0 deletions.
98 changes: 98 additions & 0 deletions formulir.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
<!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="w-full p-4 sm:p-24 text-gray-700 flex flex-wrap justify-evenly items-center gap-4 sm:gap-10" data-aos="zoom-in" data-aos-easing="linear" data-aos-duration="500">
...
</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 src="bpjph.js"></script>
<script>
// AOS.init();
</script>
<!-- SCRIPT END -->
</body>
</html>

0 comments on commit 64a852e

Please sign in to comment.