update: humas polri

2024-01-29 17:19:46 +07:00 · 2024-01-29 17:19:46 +07:00 · fbd5eb7e20
parent 1140b46de8
commit fbd5eb7e20
5 changed files with 103 additions and 57 deletions
--- a/app/layout.tsx
+++ b/app/layout.tsx
@ -36,7 +36,7 @@ export default function RootLayout({
 			<head />
 			<body
 				className={clsx(
-					"min-h-screen bg-background font-sans antialiased",
+					"bg-background font-sans antialiased",
 					fontSans.variable
 				)}
 			>
--- a/components/Landing
+++ b/components/Landing
@ -1,4 +1,7 @@
+import { Button } from '@nextui-org/button'
+import { Input } from '@nextui-org/input'
 import React from 'react'
+import { MailIcon } from '../icons'

 export default function Footer() {
    return (
@ -44,13 +47,26 @@ export default function Footer() {
                    <p>Pelayanan Polisiku</p>
                    <p>Pelayanan BINMAS</p>
                </div>
-                <div>
-                    <p>Pelayanan BINMAS</p>
-                    <p>Pelayanan BINMAS</p>
-                    <p>Pelayanan BINMAS</p>
+                <div className=''>
+                    <p className='text-xl font-bold'>Subscribe</p>
+                    <p>Dapatkan info & event terupdate dari kami.</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>
-            <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>
    )
 }
--- a/components/icons.tsx
+++ b/components/icons.tsx
@ -442,4 +442,22 @@ export const DotsIcon = ({
 			fill="#969696"
 		/>
 	</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>
+);
--- a/components/navbar.tsx
+++ b/components/navbar.tsx
@ -1,40 +1,31 @@
-import {
-	Navbar as NextUINavbar,
-	NavbarContent,
-	NavbarMenu,
-	NavbarMenuToggle,
-	NavbarBrand,
-	NavbarItem,
-	NavbarMenuItem,
-} from "@nextui-org/navbar";
-import { Button } from "@nextui-org/button";
+import { Input } from "@nextui-org/input";
 import { Kbd } from "@nextui-org/kbd";
 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 {
-	TwitterIcon,
-	GithubIcon,
-	DiscordIcon,
-	HeartFilledIcon,
-	SearchIcon,
+	NavbarBrand,
+	NavbarContent,
+	NavbarItem,
+	NavbarMenu,
+	NavbarMenuItem,
+	NavbarMenuToggle,
+	Navbar as NextUINavbar
+} from "@nextui-org/navbar";
+
+
+
+import {
 	ChevronDownIcon,
 	FbIcon,
 	IgIcon,
-	YtIcon,
-	TwIcon,
+	SearchIcon,
 	TtIcon,
+	TwIcon,
+	YtIcon
 } from "@/components/icons";
+import { ThemeSwitch } from "@/components/theme-switch";

-import { Logo } from "@/components/icons";
-import { Image } from "@nextui-org/react";
+import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Image } from "@nextui-org/react";
+import { siteConfig } from "@/config/site";

 export const Navbar = () => {
 	const searchInput = (
@ -59,16 +50,16 @@ export const Navbar = () => {
 	);

 	return (
-		<NextUINavbar className="h-36 w-full lg:w-full"
+		<NextUINavbar className="h-28 md:h-36"
 			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
 					src="/logohumas.png"
 				/>
 			</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>
 					<Link color="foreground" href="#">
 						<p className="mr-1 font-semibold">Pelayanan Masyarakat</p>
@ -102,7 +93,7 @@ export const Navbar = () => {
 					<ThemeSwitch />
 				</NavbarItem>
 			</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><FbIcon /></div>
 					<div><IgIcon /></div>
@ -112,6 +103,27 @@ export const Navbar = () => {
 				</div>
 				<div className="font-bold">{searchInput}</div>
 			</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>
 	);
 };
--- a/config/site.ts
+++ b/config/site.ts
@ -8,22 +8,22 @@ export const siteConfig = {
 			label: "Home",
 			href: "/",
 		},
-    {
-      label: "Docs",
-      href: "/docs",
-    },
-    {
-      label: "Pricing",
-      href: "/pricing",
-    },
-    {
-      label: "Blog",
-      href: "/blog",
-    },
-    {
-      label: "About",
-      href: "/about",
-    }
+		{
+			label: "Docs",
+			href: "/docs",
+		},
+		{
+			label: "Pricing",
+			href: "/pricing",
+		},
+		{
+			label: "Blog",
+			href: "/blog",
+		},
+		{
+			label: "About",
+			href: "/about",
+		}
 	],
 	navMenuItems: [
 		{
@ -64,6 +64,6 @@ export const siteConfig = {
 		twitter: "https://twitter.com/getnextui",
 		docs: "https://nextui.org",
 		discord: "https://discord.gg/9b6yyZKmH4",
-    sponsor: "https://patreon.com/jrgarciadev"
+		sponsor: "https://patreon.com/jrgarciadev"
 	},
 };