350 lines
19 KiB
TypeScript
350 lines
19 KiB
TypeScript
'use client'
|
|
import { Link } from '@nextui-org/link'
|
|
import { Navbar, NavbarContent, NavbarItem, NavbarMenuToggle } from '@nextui-org/navbar'
|
|
import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger } from '@nextui-org/react'
|
|
import { ChevronDownIcon, ChevronRightIcon, FbIcon, IdnIcon, IgIcon, TtIcon, TwIcon, YtIcon } from '../icons'
|
|
import { ThemeSwitch } from '../theme-switch'
|
|
|
|
export default function NavbarPPID() {
|
|
return (
|
|
<Navbar maxWidth='full' height="8rem" className='dark:bg-[#1F1A17]'>
|
|
<div className='w-full h-full flex'>
|
|
<div className='w-1/3 md:w-2/12 flex'>
|
|
<Link href={'/'}>
|
|
<img src="/e-ppid.png" alt="logo" className='w-auto lg:w-full h-auto lg:h-full p-0 lg:p-2 ' />
|
|
</Link>
|
|
</div>
|
|
<div className='w-10/12 hidden md:flex flex-col justify-cente pt-3 space-y-3'>
|
|
<div className='flex items-center justify-end gap-1 md:gap-5'>
|
|
<div className="flex gap-1 lg:gap-3 items-center">
|
|
<div><FbIcon /></div>
|
|
<div><IgIcon /></div>
|
|
<div><YtIcon /></div>
|
|
<div><TwIcon /></div>
|
|
<div><TtIcon /></div>
|
|
</div>
|
|
<div ><IdnIcon /></div>
|
|
</div>
|
|
<div className='flex flex-wrap items-center justify-around'>
|
|
<NavbarItem className='scroll-smooth'>
|
|
<Link href='/portal-ppid' color='foreground'>
|
|
Beranda
|
|
</Link>
|
|
</NavbarItem>
|
|
<Dropdown>
|
|
<NavbarItem>
|
|
<DropdownTrigger>
|
|
<Button
|
|
disableRipple
|
|
className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
|
|
radius="sm"
|
|
variant="light"
|
|
endContent={<ChevronDownIcon className="pt-1" />}
|
|
>
|
|
Informasi Publik
|
|
</Button>
|
|
</DropdownTrigger>
|
|
</NavbarItem>
|
|
<DropdownMenu
|
|
aria-label="tentang"
|
|
title='Tentang'
|
|
className="pt-4"
|
|
classNames={{
|
|
// base: " border-2 border-red-500 bg-white",
|
|
// list: "border-2 gap-2 flex flex-row flex-wrap"
|
|
// list: "gap-2 flex flex-row flex-wrap"s
|
|
}}
|
|
itemClasses={{
|
|
// base: "border border-red-700 w-[350px]"
|
|
base: "w-[350px]"
|
|
}}
|
|
>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/informasi-publik/informasi-serta-merta' color='foreground'>
|
|
Informasi Serta Merta
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/informasi-publik/informasi-berkala' color='foreground'>
|
|
Informasi Berkala
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/informasi-publik/informasi-setiap-saat' color='foreground'>
|
|
Informasi Setiap Saat
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/informasi-publik/informasi-dikecualikan' color='foreground'>
|
|
Informasi Dikecualikan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/informasi-publik/penerangan-satuan' color='foreground'>
|
|
Penerangan Satuan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/informasi-publik/uu-dan-peraturan' color='foreground'>
|
|
UU & Peraturan
|
|
</Link>
|
|
</DropdownItem>
|
|
</DropdownMenu>
|
|
</Dropdown>
|
|
<Dropdown>
|
|
<NavbarItem>
|
|
<DropdownTrigger>
|
|
<Button
|
|
disableRipple
|
|
className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
|
|
radius="sm"
|
|
variant="light"
|
|
endContent={<ChevronDownIcon className="pt-1" />}
|
|
>
|
|
Profile
|
|
</Button>
|
|
</DropdownTrigger>
|
|
</NavbarItem>
|
|
<DropdownMenu
|
|
aria-label="tentang"
|
|
title='Tentang'
|
|
className="pt-4"
|
|
classNames={{
|
|
// base: " border-2 border-red-500 bg-white",
|
|
// list: "border-2 gap-2 flex flex-row flex-wrap"
|
|
// list: "gap-2 flex flex-row flex-wrap"s
|
|
}}
|
|
itemClasses={{
|
|
// base: "border border-red-700 w-[350px]"
|
|
base: "w-[350px]"
|
|
}}
|
|
>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/profile/sejarah-ppid-polri' color='foreground'>
|
|
Sejarah PPID Polri
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/profile/profile-singkat-ppid' color='foreground'>
|
|
Profile Singkat PPID
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/profile/tugas-dan-fungsi-ppid' color='foreground'>
|
|
Tugas dan Fungsi PPID
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/profile/struktur-ppid' color='foreground'>
|
|
Struktur PPID
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/profile/visi-dan-misi-ppid' color='foreground'>
|
|
Visi & Misi PPID
|
|
</Link>
|
|
</DropdownItem>
|
|
</DropdownMenu>
|
|
</Dropdown>
|
|
<Dropdown>
|
|
<NavbarItem>
|
|
<DropdownTrigger>
|
|
<Button
|
|
disableRipple
|
|
className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
|
|
radius="sm"
|
|
variant="light"
|
|
endContent={<ChevronDownIcon className="pt-1" />}
|
|
>
|
|
Layanan Informasi
|
|
</Button>
|
|
</DropdownTrigger>
|
|
</NavbarItem>
|
|
<DropdownMenu
|
|
aria-label="tentang"
|
|
title='Tentang'
|
|
className="pt-4"
|
|
classNames={{
|
|
// base: " border-2 border-red-500 bg-white",
|
|
// list: "border-2 gap-2 flex flex-row flex-wrap"
|
|
// list: "gap-2 flex flex-row flex-wrap"s
|
|
}}
|
|
itemClasses={{
|
|
// base: "border border-red-700 w-[350px]"
|
|
base: "w-[350px]"
|
|
}}
|
|
>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/layanan-informasi/registrasi-permohonan' color='foreground'>
|
|
Registrasi Permohonan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/layanan-informasi/permohonan-informasi' color='foreground'>
|
|
Permohonan Informasi
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/layanan-informasi/permohonan-keberatan' color='foreground'>
|
|
Permohonan Keberatan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/layanan-informasi/statistik-rekapitulasi' color='foreground'>
|
|
Statistik / Rekapitulasi
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/layanan-informasi/ppid-laporan-tahunan' color='foreground'>
|
|
Laporan Informasi Publik Tahunan
|
|
</Link>
|
|
</DropdownItem>
|
|
</DropdownMenu>
|
|
</Dropdown>
|
|
<Dropdown>
|
|
<NavbarItem>
|
|
<DropdownTrigger>
|
|
<Button
|
|
disableRipple
|
|
className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
|
|
radius="sm"
|
|
variant="light"
|
|
endContent={<ChevronDownIcon className="pt-1" />}
|
|
>
|
|
Standar Layanan
|
|
</Button>
|
|
</DropdownTrigger>
|
|
</NavbarItem>
|
|
<DropdownMenu
|
|
aria-label="tentang"
|
|
title='Tentang'
|
|
className="pt-4"
|
|
classNames={{
|
|
// base: " border-2 border-red-500 bg-white",
|
|
// list: "border-2 gap-2 flex flex-row flex-wrap"
|
|
// list: "gap-2 flex flex-row flex-wrap"s
|
|
}}
|
|
itemClasses={{
|
|
// base: "border border-red-700 w-[350px]"
|
|
base: "w-[350px]"
|
|
}}
|
|
>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/standar-layanan/alur-pelayanan-informasi-publik' color='foreground'>
|
|
Alur Pelayanan Informasi Publik Polri
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
>
|
|
<Link href='/portal-ppid/standar-layanan/tata-cara-permohonan-informasi' color='foreground'>
|
|
Tata Cara Permohonan Informasi
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/standar-layanan/mekanisme-keberatan' color='foreground'>
|
|
Mekanisme Keberatan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/standar-layanan/mekanisme-permohonan-penyelesaian-sengketa' color='foreground'>
|
|
Mekanisme Permohonan Penyelesainan Sengketa
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/standar-layanan/waktu-pelayanan' color='foreground'>
|
|
Waktu Pelayanan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/standar-layanan/standar-biaya-pelayanan' color='foreground'>
|
|
Standar Biaya Pelayanan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}>
|
|
<Link href='/portal-ppid/standar-layanan/maklumat-pelayanan' color='foreground'>
|
|
Maklumat Pelayanan
|
|
</Link>
|
|
</DropdownItem>
|
|
</DropdownMenu>
|
|
</Dropdown>
|
|
<NavbarItem>
|
|
<Link href='/portal-ppid/regulasi' color='foreground'>
|
|
Regulasi
|
|
</Link>
|
|
</NavbarItem>
|
|
<NavbarItem>
|
|
<Link href='#footer-ppid' color='foreground'>
|
|
Kontak
|
|
</Link>
|
|
</NavbarItem>
|
|
<div><ThemeSwitch /></div>
|
|
</div>
|
|
</div>
|
|
<NavbarContent className="sm:hidden basis-1 pl-4" justify="end">
|
|
<ThemeSwitch />
|
|
<NavbarMenuToggle />
|
|
</NavbarContent>
|
|
</div>
|
|
{/* <div className='w-full'>
|
|
<div className='hidden md:flex items-end justify-end'>
|
|
<div className='flex items-center justify-between gap-1 md:gap-10'>
|
|
<div className="flex gap-1 lg:gap-3 items-center">
|
|
<div><FbIcon /></div>
|
|
<div><IgIcon /></div>
|
|
<div><YtIcon /></div>
|
|
<div><TwIcon /></div>
|
|
<div><TtIcon /></div>
|
|
</div>
|
|
<div ><IdnIcon /></div>
|
|
</div>
|
|
</div>
|
|
<div className='flex'>
|
|
<div className='w-1/3 lg:w-2/12'>
|
|
<Link href={'/'}>
|
|
<img src="/e-ppid.png" alt="logo" className='w-48' />
|
|
</Link>
|
|
</div>
|
|
<div className='w-2/3 lg:w-9/12 hidden md:flex flex-wrap items-center justify-evenly '>
|
|
|
|
</div>
|
|
<NavbarContent className="sm:hidden basis-1 pl-4" justify="end">
|
|
<ThemeSwitch />
|
|
<NavbarMenuToggle />
|
|
</NavbarContent>
|
|
</div>
|
|
</div> */}
|
|
</Navbar>
|
|
)
|
|
}
|
|
|