sigd/resources/views/index.blade.php

240 lines
16 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

@extends('layouts.front')
@section('content')
<section class="relative continer py-[90px]">
<div class="flex flex-col items-center text-center mx-auto py-100 gap-1 w-[80%] md:w-[80%] lg:w-[60%]">
<h1 class="mb-0 font-semibold text-[42px] md:text-[52px] lg:text-[72px]">Sistem Informasi</h1>
<h1 class="mb-0 font-semibold text-[42px] md:text-[52px] lg:text-[72px]">Gas Rumah Kaca Daerah</h1>
<p class="mb-0 text-[#878C91] md:w-[70%]">Platform terintegrasi untuk memantau, melaporkan, dan mengevaluasi status emisi GRK serta kemajuan Rencana Aksi Mitigasi di wilayah Jakarta. Akses data inventarisasi terbaru dan peran serta publik.</p>
<div class="flex flex-col md:flex-row gap-10 md:gap-3 mt-20">
<div><a href="" class="rounded-full bg-[#2084FF] px-10 py-4 text-white">Lihat Rencana Aksi&nbsp;<i class="bx bx-right-arrow-alt"></i></a></div>
<div><a href="" class="rounded-full px-10 py-4 border">Akses Dashboard Terbaru</a></div>
</div>
</div>
</section>
<section class="relative container mx-auto p-10">
<div class="flex flex-col md:flex-row gap-4 justify-between items-center">
<div class="md:w-[50%]"><h1 class="text-[32px] md:text-[42px] font-semibold">Informasi Gas Rumah Kaca Daerah</h1></div>
<div class="md:w-[50%]"><p class="text-[16px] text-[#878C91]">Perhitungan emisi GRK mengikuti standar IPCC terbaru dan divalidasi oleh lembaga lingkungan terkait, serta didukung kerja sama dengan Kementerian LHK untuk memastikan akuntabilitas data.</p></div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-5 mt-[50px]">
<div class="bg-[url({{ asset('assets/images/bg1.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px] bg-blend-overlay">
<h4 class="text-[20px]">Energi</h4>
<p class="font-thin text-sm">We're a UK-based Laravel agency. We'll get your project moving so you can focus on what matters most. You'll have peac.</p>
</div>
<div class="bg-[url({{ asset('assets/images/bg2.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px] bg-blend-overlay">
<h4 class="text-[20px]">Industrial Processes and Product Use</h4>
<p class="font-thin text-sm">As the largest on-shore Laravel development company in the United States, Active Logic is headquartered in.</p>
</div>
<div class="bg-[url({{ asset('assets/images/bg3.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px] bg-blend-overlay">
<h4 class="text-[20px]">Pertanian & Lahan</h4>
<p class="font-thin text-sm">Were the Laravel agency you couldnt afford locally. But were based in Georgia, the country. So, you can.</p>
</div>
<div class="bg-[url({{ asset('assets/images/bg4.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px] bg-blend-overlay">
<h4 class="text-[20px]">Limbah</h4>
<p class="font-thin text-sm">We're the experts in all things Laravel. If you need an app built or rescued, or you need your team built or leveled up, we'v</p>
</div>
</div>
<div class="flex flex-col md:flex-row gap-4 justify-center items-center mt-[45px]">
<div><a href="" class="rounded-full bg-[#2084FF] px-10 py-4 text-white">Lihat Rencana Aksi&nbsp;<i class="bx bx-right-arrow-alt"></i></a></div>
</div>
</section>
<section class="relative mx-auto container p-5">
<div class="bg-[#2084FF] rounded-[10px] pt-20">
<div class="flex flex-row gap-4 justify-center text-center items-center text-white">
<div class="md:w-[70%]"><h1 class="text-[32px] md:text-[42px] font-semibold">Semua yang Anda Butuhkan, Lengkap dan Terverifikasi.</h1></div>
</div>
<div class="flex flex-col lg:flex-row justify-center items-center gap-4 mt-[35px] px-20 lg:w-[90%] mx-auto text-center">
<div class="rounded-full w-full border px-6 py-3 text-white"><a href="">Investasi Sektor</a></div>
<div class="rounded-full w-full border px-6 py-3 text-[#2084FF] bg-white"><a href="">Tren Tahun ke Tahun</a></div>
<div class="rounded-full w-full border px-6 py-3 text-white"><a href="">RAD GRK Interaktif</a></div>
<div class="rounded-full w-full border px-6 py-3 text-white"><a href="">Peta Geografis Aksi</a></div>
</div>
<div class="flex justify-center -mt-[50px]">
<img src="{{ asset('assets/images/dashboard.png') }}" alt="">
</div>
</div>
</section>
<section class="relative mx-auto container p-5">
<div class="py-20">
<div class="flex flex-row gap-4 justify-center text-center items-center">
<div class=""><h1 class="text-[22px] md:text-[32px] font-semibold">Kami menjamin pengujian komprehensif didukung metodologi standar <br> ISO/IEC 17025 dan tim analis tersertifikasi</h1></div>
</div>
<div class="flex md:flex-row flex-col md:justify-between items-center gap-[35px] lg:gap-4 mt-[55px] px-20">
<div class="flex justify-center items-center gap-3">
<div class="bg-[#eee] rounded-full p-3"><img width="45" src="https://upload.wikimedia.org/wikipedia/commons/9/99/Sample_User_Icon.png" alt=""></div>
<div class="flex flex-col gap-1">
<span class="font-semibold text-xl">Ilham</span>
<span class="text-[#878C91] text-sm">Tenaga Ahli</span>
</div>
</div>
<div class="flex justify-between gap-5">
<div><a class="p-3 rounded-full border" href=""><i class="bx bx-left-arrow-alt"></i></a></div>
<div class="text-[#878C91]">01 &nbsp;/&nbsp; 05</div>
<div><a class="p-3 bg-[#2084FF] text-white rounded-full" href=""><i class="bx bx-right-arrow-alt"></i></a></div>
</div>
</div>
</div>
</section>
<section class="relative mx-auto container p-5">
<div class="py-20">
<div class="flex flex-col lg:flex-row gap-4">
<div class="flex flex-col gap-5 lg:w-[40%]">
<h1 class="text-[22px] md:text-5xl">FAQ Inventarisasi dan Aksi Iklim</h1>
<p class="text-[#878C91] mt-5">Sebagai platform informasi terdepan, kami berkomitmen untuk menyediakan sumber daya edukasi yang komprehensif dan
menjawab pertanyaan umum dari publik dan pemangku kepentingan mengenai data emisi dan upaya mitigasi daerah
</p>
<div class="flex gap-3 justify-center items-center mt-5">
<a class="border px-6 py-3 rounded-full" href="">Akses Materi Edukasi</a>
<a class="px-6 py-3 underline" href="">Hubungi Kami</a>
</div>
</div>
<div class="flex flex-col gap-3 lg:w-[60%]">
<div class="flex flex-col gap-3 p-3">
<div class=" flex justify-between items-center">
<div class="w-2/1"><h1 class="font-reguler text-2xl">Apa itu SIGD dan apa tujuannya ?</h1></div>
<div class="w-1/4 text-right"><i class="bx bx-minus"></i></div>
</div>
<div class="deskripsi">
<p class="text-[#878C91]">Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque nobis, voluptates quos odio nihil, cupiditate reiciendis repellat aliquam aperiam autem sit possimus, veniam accusamus? Nam doloribus neque tenetur veniam quae.</p>
</div>
</div>
<hr>
<div class="flex flex-col gap-3 p-3">
<div class=" flex justify-between items-center">
<div class="w-2/1"><h1 class="font-reguler text-2xl">Bagaimanakah metodologi perhitungan emisi yang digunakan ?</h1></div>
<div class="w-1/4 text-right"><i class="bx bx-plus"></i></div>
</div>
<div class="deskripsi hidden">
<p class="text-[#878C91]">Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque nobis, voluptates quos odio nihil, cupiditate reiciendis repellat aliquam aperiam autem sit possimus, veniam accusamus? Nam doloribus neque tenetur veniam quae.</p>
</div>
</div>
<div class="flex flex-col gap-3 p-3">
<div class=" flex justify-between items-center">
<div class="w-2/1"><h1 class="font-reguler text-2xl">Apa saja sektor penyumbang emisi utama di daerah ini ?</h1></div>
<div class="w-1/4 text-right"><i class="bx bx-plus"></i></div>
</div>
<div class="deskripsi hidden">
<p class="text-[#878C91]">Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque nobis, voluptates quos odio nihil, cupiditate reiciendis repellat aliquam aperiam autem sit possimus, veniam accusamus? Nam doloribus neque tenetur veniam quae.</p>
</div>
</div>
<div class="flex flex-col gap-3 p-3">
<div class=" flex justify-between items-center">
<div class="w-2/1"><h1 class="font-reguler text-2xl">Bagaimana masyarakat umum dapat berpartisipasi dalam upaya mitibasi ?</h1></div>
<div class="w-1/4 text-right"><i class="bx bx-plus"></i></div>
</div>
<div class="deskripsi hidden">
<p class="text-[#878C91]">Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque nobis, voluptates quos odio nihil, cupiditate reiciendis repellat aliquam aperiam autem sit possimus, veniam accusamus? Nam doloribus neque tenetur veniam quae.</p>
</div>
</div>
<hr>
</div>
</div>
</div>
</section>
<section class="relative bg-[#efefef] py-20">
<div class="container mx-auto p-5">
<div class="flex flex-col lg:flex-row gap-4">
<div class="lg:w-[60%]">
<h1 class="text-3xl md:text-5xl">Data Emisi GRK & Analisi Iklim Untuk Mendukung Aksi Iklim Daerah</h1>
</div>
<div class="flex flex-col gap-5 lg:w-[40%]">
<div>
<p class="text-[#878C91]">
SIGD menyediakan data emisi GRK yang kredibel dan terstandar,membantu pemerintah dan publik memahami
kondisi emisi serta efektifitas program mitigasi.
</p>
</div>
<div class="mt-5"><a class="border border-[#000] px-6 py-3 rounded-full" href="">Lihat Selengkapnya</a></div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 mt-[50px]">
<div class="p-6 bg-white rounded-[20px] shadow-xl">
<div class="flex flex-col gap-3">
<div class="flex justify-between">
<div class="px-1 py-0 bg-[#2084FF] rounded-full">&nbsp;</div>
</div>
<div class="text-xl md:text-2xl font-reguler">Bagaimana Data GRK Daerah Meningkatkan Keputusan Kebijakan Iklim</div>
<div class="flex justify-between items-center mt-5">
<div class="w-[70%]"><p class="text-[#878C91]">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut laborum assumenda...</p></div>
<div class="w-[30%] text-right flex justify-center items-center"><a href="" class="px-8 py-3 border rounded-full bg-[#2084FF] text-white"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
</div>
</div>
</div>
<div class="p-6 bg-white rounded-[20px] shadow-xl">
<div class="flex flex-col gap-3">
<div class="flex justify-between">
<div class="px-1 py-0 bg-[#2084FF] rounded-full">&nbsp;</div>
</div>
<div class="text-xl md:text-2xl font-reguler">Memahami Tren Emisi dengan Metodologi Berbasis IPCC</div>
<div class="flex justify-between items-center mt-5">
<div class="w-[70%]"><p class="text-[#878C91]">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut laborum assumenda...</p></div>
<div class="w-[30%] text-right flex justify-center items-center"><a href="" class="px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
</div>
</div>
</div>
<div class="p-6 bg-white rounded-[20px] shadow-xl">
<div class="flex flex-col gap-3">
<div class="flex justify-between">
<div class="px-1 py-0 bg-[#2084FF] rounded-full">&nbsp;</div>
</div>
<div class="text-xl md:text-2xl font-reguler">Optimalkan Dampak Aksi Iklim Lewat Pelaporan Emisi yang Transparan</div>
<div class="flex justify-between items-center mt-5">
<div class="w-[70%]"><p class="text-[#878C91]">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut laborum assumenda...</p></div>
<div class="w-[30%] text-right flex justify-center items-center"><a href="" class="px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="relative bg-[#fff] py-20">
<div class="container mx-auto p-5">
<div class="flex flex-col md:flex-row gap-5">
<div class="flex flex-col gap-3 md:w-[50%]">
<div><a href=""><img src="{{ asset('assets/images/logo.png') }}" width="120" alt=""></a></div>
<div class="mt-3">
<p class="text-[#878C91] text-sm">
Sistem Informasi Gas Rumah Kaca Daerah (SIGD) menyediakan data aktivitas, faktor emisi, inventarisasi GRK, serta laporan
pemantauan aksi mitigasi untuk mendukung perencanaan pembangunan rendah karbon.
</p>
</div>
</div>
<div class="flex flex-col gap-3 md:w-[20%] lg:w-[15%]">
<div class="font-semibold mb-5">Tautan Cepat</div>
<div><a href="" class="text-[#878C91]">Dashboard</a></div>
<div><a href="" class="text-[#878C91]">Data Emisi</a></div>
<div><a href="" class="text-[#878C91]">Rencana Aksi</a></div>
<div><a href="" class="text-[#878C91]">Resource</a></div>
<div><a href="" class="text-[#878C91]">Contact</a></div>
</div>
<div class="flex flex-col gap-3 md:w-[20%] lg:w-[15%]">
<div class="font-semibold mb-5">License</div>
<div><a href="" class="text-[#878C91]">Privacy Policy</a></div>
<div><a href="" class="text-[#878C91]">Copyright</a></div>
<div><a href="" class="text-[#878C91]">Email Address</a></div>
</div>
<div class="flex flex-col gap-3 md:w-[20%] lg:w-[15%]">
<div class="font-semibold mb-5">Contact</div>
<div class="flex items-center gap-3">
<div><i class="bx bx-phone"></i></div>
<div><a href="" class="text-[#878C91]">0812634125</a></div>
</div>
<div class="flex items-center gap-3">
<div><i class="bx bx-envelope"></i></div>
<div><a href="" class="text-[#878C91]">support@gasrumahkaca.go.id</a></div>
</div>
<div class="flex items-center gap-3">
<div><i class="bx bx-pin"></i></div>
<div><a href="" class="text-[#878C91]">Jl. Mandala V No.67 1, RT.1/RW.2, Cililitan, Kec. Kramat jati.</a></div>
</div>
</div>
</div>
</div>
</section>
@endsection