web-humas-fe/components/Portal PPID/PPIDSatkerSidebar.tsx

101 lines
5.6 KiB
TypeScript

'use client'
import { Button, Input } from '@nextui-org/react'
import Link from 'next/link'
export default function PPIDSatkerSidebar() {
return (
<div className='bg-white text-black p-1 md:p-2 lg:p-4 space-y-4'>
<div className='flex justify-center'>
<Link href='/portal-ppid/e-ppid-satker'>
<img src="/e-ppid-satker.png" alt="satker" className='' />
</Link>
</div>
<div className='flex justify-center'>
<Link href='/portal-ppid'>
<img src="/ppid-polri.png" alt="satker" className='' />
</Link>
</div>
<div className='flex justify-center'>
<Link href='portal-ppid/layanan-informasi/registrasi-permohonan'>
<img src="/e-ppid-permohonan-informasi.png" alt="permohonan" />
</Link>
</div>
<div className='bg-[#161616] text-white p-3 rounded-lg flex w-full flex-col items-center space-y-2'>
<div>Permohonan Informasi</div>
<div className='w-full'>
<Input variant='flat' size='sm' type="name" label="Nama Pengguna" className='w-full' />
</div>
<div className='w-full'>
<Input variant='flat' size='sm' type="password" label="Password" className='w-full' />
</div>
<div className='text-xs text-right text-[#DD8306] w-full'>Lupa Password?</div>
<div className='w-full'>
<Link href='portal-ppid/layanan-informasi/permohonan-informasi'>
<Button size='sm' className='bg-[#DD8306] w-full font-semibold'>Masuk</Button>
</Link>
</div>
<div className='w-full'>
<Link href='portal-ppid/layanan-informasi/registrasi-permohonan'>
<Button href='portal-ppid/layanan-informasi/registrasi-permohonan' size='sm' className=' w-full bg-white text-[#DD8306] font-bold'>Register</Button>
</Link>
</div>
</div>
{/* <div>
<GPRKominfo />
</div> */}
{/* <div>
<div className='text-xl font-semibold underline underline-offset-4 decoration-red-600 pb-3'>
Media Update
</div>
<div className='h-[360px] p-2 bg-[#020101] text-white rounded-md border-2 border-white'>
<ScrollShadow hideScrollBar className=" h-[343px]">
<div className='text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md'>
<p>Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari</p>
<p className='py-[2px]'>21-07-2023 13:50</p>
<p className='flex items-center gap-1'><EyeIcon />82</p>
</div>
<div className='text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md'>
<p>Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari</p>
<p className='py-[2px]'>21-07-2023 13:50</p>
<p className='flex items-center gap-1'><EyeIcon />82</p>
</div>
<div className='text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md'>
<p>Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari</p>
<p className='py-[2px]'>21-07-2023 13:50</p>
<p className='flex items-center gap-1'><EyeIcon />82</p>
</div>
<div className='text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md'>
<p>Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari</p>
<p className='py-[2px]'>21-07-2023 13:50</p>
<p className='flex items-center gap-1'><EyeIcon />82</p>
</div>
</ScrollShadow>
</div>
</div> */}
<div>
<div className='text-xl font-semibold underline underline-offset-4 decoration-red-600'>Publikasi
<div className='flex flex-col gap-3 pt-3'>
<img src="/publikasi1.png" alt="publikasi" />
<img src="/publikasi2.png" alt="publikasi" />
<img src="/publikasi3.png" alt="publikasi" />
<img src="/publikasi4.png" alt="publikasi" />
{/* <img src="/publikasi5.png" alt="publikasi" /> */}
<img src="/publikasi6.png" alt="publikasi" />
<img src="/publikasi8.png" alt="publikasi" className='px-1' />
</div>
</div>
</div>
<div>
<div className='text-xl font-semibold underline underline-offset-4 decoration-red-600'>Channel Humas Polri
<div className='flex flex-col gap-3 mt-5 mx-10'>
<img src="/humas1.png" alt="humas-polri" />
<img src="/humas2.png" alt="humas-polri" />
{/* <img src="/humas3.png" alt="humas-polri" /> */}
<img src="/humas4.png" alt="humas-polri" />
</div>
</div>
</div>
</div>
)
}