humas
/
web-humas-fe
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update: humas polri

This commit is contained in:
amd123 2024-01-29 17:19:46 +07:00
parent 1140b46de8
commit fbd5eb7e20
5 changed files with 103 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/layout.tsx
View File

@ -36,7 +36,7 @@ export default function RootLayout({
<head /> <head />
<body <body
className={clsx( className={clsx(
"min-h-screen bg-background font-sans antialiased", "bg-background font-sans antialiased",
fontSans.variable fontSans.variable
)} )}
> >

26
components/Landing Page/Footer.tsx
View File

@ -1,4 +1,7 @@
import { Button } from '@nextui-org/button'
import { Input } from '@nextui-org/input'
import React from 'react' import React from 'react'
import { MailIcon } from '../icons'
export default function Footer() { export default function Footer() {
return ( return (
@ -44,13 +47,26 @@ export default function Footer() {
<p>Pelayanan Polisiku</p> <p>Pelayanan Polisiku</p>
<p>Pelayanan BINMAS</p> <p>Pelayanan BINMAS</p>
</div> </div>
<div> <div className=''>
<p>Pelayanan BINMAS</p> <p className='text-xl font-bold'>Subscribe</p>
<p>Pelayanan BINMAS</p> <p>Dapatkan info & event terupdate dari kami.</p>
<p>Pelayanan BINMAS</p> <Input
label="Email"
placeholder="Email Anda"
className='w-min pt-2'
startContent={
<MailIcon className="text-xl text-default-400 pointer-events-none flex-shrink-0" />
}
endContent={
<div className="pointer-events-none flex items-center">
<span className="text-default-400 text-small">@gmail.com</span>
</div>
}
/>
<Button className='mt-3 bg-[#DD8306]'>Kontributor Wilayah</Button>
</div> </div>
</div> </div>
<p className='text-center py-4 text-sm flex justify-center font-normal'>&copy; Copyright Humas<p className='text-red-700'>&nbsp; POLRI &reg;</p>&nbsp; All Rights Reserved</p> <div className='text-center py-5 text-xs md:text-medium flex justify-center font-normal'>&copy; Copyright Humas<p className='text-red-700'>&nbsp; POLRI &reg;</p>&nbsp; All Rights Reserved</div>
</div> </div>
) )
} }

20
components/icons.tsx
View File

@ -442,4 +442,22 @@ export const DotsIcon = ({
fill="#969696" fill="#969696"
/> />
</svg> </svg>
); );
export const MailIcon = (props: any) => (
<svg
aria-hidden="true"
fill="none"
focusable="false"
height="1em"
role="presentation"
viewBox="0 0 24 24"
width="1em"
{...props}
>
<path
d="M17 3.5H7C4 3.5 2 5 2 8.5V15.5C2 19 4 20.5 7 20.5H17C20 20.5 22 19 22 15.5V8.5C22 5 20 3.5 17 3.5ZM17.47 9.59L14.34 12.09C13.68 12.62 12.84 12.88 12 12.88C11.16 12.88 10.31 12.62 9.66 12.09L6.53 9.59C6.21 9.33 6.16 8.85 6.41 8.53C6.67 8.21 7.14 8.15 7.46 8.41L10.59 10.91C11.35 11.52 12.64 11.52 13.4 10.91L16.53 8.41C16.85 8.15 17.33 8.2 17.58 8.53C17.84 8.85 17.79 9.33 17.47 9.59Z"
fill="currentColor"
/>
</svg>
);

78
components/navbar.tsx
View File

@ -1,40 +1,31 @@
import { import { Input } from "@nextui-org/input";
Navbar as NextUINavbar,
NavbarContent,
NavbarMenu,
NavbarMenuToggle,
NavbarBrand,
NavbarItem,
NavbarMenuItem,
} from "@nextui-org/navbar";
import { Button } from "@nextui-org/button";
import { Kbd } from "@nextui-org/kbd"; import { Kbd } from "@nextui-org/kbd";
import { Link } from "@nextui-org/link"; import { Link } from "@nextui-org/link";
import { Input } from "@nextui-org/input";
import { link as linkStyles } from "@nextui-org/theme";
import { siteConfig } from "@/config/site";
import NextLink from "next/link";
import clsx from "clsx";
import { ThemeSwitch } from "@/components/theme-switch";
import { import {
TwitterIcon, NavbarBrand,
GithubIcon, NavbarContent,
DiscordIcon, NavbarItem,
HeartFilledIcon, NavbarMenu,
SearchIcon, NavbarMenuItem,
NavbarMenuToggle,
Navbar as NextUINavbar
} from "@nextui-org/navbar";
import {
ChevronDownIcon, ChevronDownIcon,
FbIcon, FbIcon,
IgIcon, IgIcon,
YtIcon, SearchIcon,
TwIcon,
TtIcon, TtIcon,
TwIcon,
YtIcon
} from "@/components/icons"; } from "@/components/icons";
import { ThemeSwitch } from "@/components/theme-switch";
import { Logo } from "@/components/icons"; import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Image } from "@nextui-org/react";
import { Image } from "@nextui-org/react"; import { siteConfig } from "@/config/site";
export const Navbar = () => { export const Navbar = () => {
const searchInput = ( const searchInput = (
@ -59,16 +50,16 @@ export const Navbar = () => {
); );
return ( return (
<NextUINavbar className="h-36 w-full lg:w-full" <NextUINavbar className="h-28 md:h-36"
classNames={{ classNames={{
wrapper: "w-full max-w-full h-[90%]", wrapper: "max-w-full h-[90%]",
}}> }}>
<NavbarBrand className="max-w-fit"> <NavbarBrand className="min-w-max">
<Image <Image
src="/logohumas.png" src="/logohumas.png"
/> />
</NavbarBrand> </NavbarBrand>
<NavbarContent className="hidden sm:flex gap-12 basis-2/3 " justify="center"> <NavbarContent className="hidden md:flex basis-3/5 gap-0 md:gap-4 lg:gap-12 px-auto lg:px-10" justify="center">
<NavbarItem> <NavbarItem>
<Link color="foreground" href="#"> <Link color="foreground" href="#">
<p className="mr-1 font-semibold">Pelayanan Masyarakat</p> <p className="mr-1 font-semibold">Pelayanan Masyarakat</p>
@ -102,7 +93,7 @@ export const Navbar = () => {
<ThemeSwitch /> <ThemeSwitch />
</NavbarItem> </NavbarItem>
</NavbarContent> </NavbarContent>
<NavbarContent className="flex flex-col items-center "> <NavbarContent className="hidden sm:hidden md:hidden lg:flex basis-1/5 flex-col items-center ">
<div className="flex gap-3"> <div className="flex gap-3">
<div><FbIcon /></div> <div><FbIcon /></div>
<div><IgIcon /></div> <div><IgIcon /></div>
@ -112,6 +103,27 @@ export const Navbar = () => {
</div> </div>
<div className="font-bold">{searchInput}</div> <div className="font-bold">{searchInput}</div>
</NavbarContent> </NavbarContent>
<NavbarContent className="sm:hidden basis-1 pl-4" justify="end">
<ThemeSwitch />
<NavbarMenuToggle />
</NavbarContent>
<NavbarMenu>
{/* {searchInput} */}
<div className="mx-4 mt-2 flex flex-col gap-2 pt-10">
{siteConfig.navMenuItems.map((item, index) => (
<NavbarMenuItem key={`${item}-${index}`}>
<Link
href={item.href}
size="lg"
>
{item.label}
</Link>
</NavbarMenuItem>
))}
</div>
</NavbarMenu>
</NextUINavbar> </NextUINavbar>
); );
}; };

34
config/site.ts
View File

@ -8,22 +8,22 @@ export const siteConfig = {
label: "Home", label: "Home",
href: "/", href: "/",
}, },
{ {
label: "Docs", label: "Docs",
href: "/docs", href: "/docs",
}, },
{ {
label: "Pricing", label: "Pricing",
href: "/pricing", href: "/pricing",
}, },
{ {
label: "Blog", label: "Blog",
href: "/blog", href: "/blog",
}, },
{ {
label: "About", label: "About",
href: "/about", href: "/about",
} }
], ],
navMenuItems: [ navMenuItems: [
{ {
@ -64,6 +64,6 @@ export const siteConfig = {
twitter: "https://twitter.com/getnextui", twitter: "https://twitter.com/getnextui",
docs: "https://nextui.org", docs: "https://nextui.org",
discord: "https://discord.gg/9b6yyZKmH4", discord: "https://discord.gg/9b6yyZKmH4",
sponsor: "https://patreon.com/jrgarciadev" sponsor: "https://patreon.com/jrgarciadev"
}, },
}; };