452 lines
16 KiB
TypeScript
452 lines
16 KiB
TypeScript
"use client";
|
|
import { Link } from "@heroui/link";
|
|
import {
|
|
Navbar,
|
|
NavbarContent,
|
|
NavbarItem,
|
|
NavbarMenuToggle,
|
|
} from "@heroui/navbar";
|
|
import {
|
|
Button,
|
|
Dropdown,
|
|
DropdownItem,
|
|
DropdownMenu,
|
|
DropdownTrigger,
|
|
} from "@heroui/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 />} key="ism">
|
|
<Link
|
|
href="/portal-ppid/informasi-publik/informasi-serta-merta"
|
|
color="foreground"
|
|
>
|
|
Informasi Serta Merta
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="ib">
|
|
<Link
|
|
href="/portal-ppid/informasi-publik/informasi-berkala"
|
|
color="foreground"
|
|
>
|
|
Informasi Berkala
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="iss">
|
|
<Link
|
|
href="/portal-ppid/informasi-publik/informasi-setiap-saat"
|
|
color="foreground"
|
|
>
|
|
Informasi Setiap Saat
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="ik">
|
|
<Link
|
|
href="/portal-ppid/informasi-publik/informasi-dikecualikan"
|
|
color="foreground"
|
|
>
|
|
Informasi Dikecualikan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="ps">
|
|
<Link
|
|
href="/portal-ppid/informasi-publik/penerangan-satuan"
|
|
color="foreground"
|
|
>
|
|
Penerangan Satuan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="uu">
|
|
<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 />} key="history">
|
|
<Link
|
|
href="/portal-ppid/profile/sejarah-ppid-polri"
|
|
color="foreground"
|
|
>
|
|
Sejarah PPID Polri
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="profile">
|
|
<Link
|
|
href="/portal-ppid/profile/profile-singkat-ppid"
|
|
color="foreground"
|
|
>
|
|
Profile Singkat PPID
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="fungsi">
|
|
<Link
|
|
href="/portal-ppid/profile/tugas-dan-fungsi-ppid"
|
|
color="foreground"
|
|
>
|
|
Tugas dan Fungsi PPID
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="struktur">
|
|
<Link
|
|
href="/portal-ppid/profile/struktur-ppid"
|
|
color="foreground"
|
|
>
|
|
Struktur PPID
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="visi">
|
|
<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 />} key="regis">
|
|
<Link
|
|
href="/portal-ppid/layanan-informasi/registrasi-permohonan"
|
|
color="foreground"
|
|
>
|
|
Registrasi Permohonan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
key="p-informasi"
|
|
>
|
|
<Link
|
|
href="/portal-ppid/layanan-informasi/permohonan-informasi"
|
|
color="foreground"
|
|
>
|
|
Permohonan Informasi
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
key="p-keberatan"
|
|
>
|
|
<Link
|
|
href="/portal-ppid/layanan-informasi/permohonan-keberatan"
|
|
color="foreground"
|
|
>
|
|
Permohonan Keberatan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="statistik">
|
|
<Link
|
|
href="/portal-ppid/layanan-informasi/statistik-rekapitulasi"
|
|
color="foreground"
|
|
>
|
|
Statistik / Rekapitulasi
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="laporan">
|
|
<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 />}
|
|
key="pelauyanan"
|
|
>
|
|
<Link
|
|
href="/portal-ppid/standar-layanan/alur-pelayanan-informasi-publik"
|
|
color="foreground"
|
|
>
|
|
Alur Pelayanan Informasi Publik Polri
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
key="permohonan"
|
|
>
|
|
<Link
|
|
href="/portal-ppid/standar-layanan/tata-cara-permohonan-informasi"
|
|
color="foreground"
|
|
>
|
|
Tata Cara Permohonan Informasi
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="keberatan">
|
|
<Link
|
|
href="/portal-ppid/standar-layanan/mekanisme-keberatan"
|
|
color="foreground"
|
|
>
|
|
Mekanisme Keberatan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="sengketa">
|
|
<Link
|
|
href="/portal-ppid/standar-layanan/mekanisme-permohonan-penyelesaian-sengketa"
|
|
color="foreground"
|
|
>
|
|
Mekanisme Permohonan Penyelesainan Sengketa
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem
|
|
endContent={<ChevronRightIcon />}
|
|
key="waktu-pelayanan"
|
|
>
|
|
<Link
|
|
href="/portal-ppid/standar-layanan/waktu-pelayanan"
|
|
color="foreground"
|
|
>
|
|
Waktu Pelayanan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="sbp">
|
|
<Link
|
|
href="/portal-ppid/standar-layanan/standar-biaya-pelayanan"
|
|
color="foreground"
|
|
>
|
|
Standar Biaya Pelayanan
|
|
</Link>
|
|
</DropdownItem>
|
|
<DropdownItem endContent={<ChevronRightIcon />} key="maklumat">
|
|
<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"
|
|
className="scroll-smooth"
|
|
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>
|
|
);
|
|
}
|