add: web-humas-polri
This commit is contained in:
amd123
parent
52306eda0d
commit
1140b46de8
|
|
@ -6,6 +6,8 @@ import { Providers } from "./providers";
|
|||
import { Navbar } from "@/components/navbar";
|
||||
import { Link } from "@nextui-org/link";
|
||||
import clsx from "clsx";
|
||||
import Image from "next/image";
|
||||
import Footer from "@/components/Landing Page/Footer";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: {
|
||||
|
|
@ -39,22 +41,19 @@ export default function RootLayout({
|
|||
)}
|
||||
>
|
||||
<Providers themeProps={{ attribute: "class", defaultTheme: "dark" }}>
|
||||
<div className="relative flex flex-col h-screen">
|
||||
<div className="relative">
|
||||
<Navbar />
|
||||
<main className="container mx-auto max-w-7xl pt-16 px-6 flex-grow">
|
||||
{children}
|
||||
</main>
|
||||
<footer className="w-full flex items-center justify-center py-3">
|
||||
<Link
|
||||
isExternal
|
||||
className="flex items-center gap-1 text-current"
|
||||
href="https://nextui-docs-v2.vercel.app?utm_source=next-app-template"
|
||||
title="nextui.org homepage"
|
||||
>
|
||||
<span className="text-default-600">Powered by</span>
|
||||
<p className="text-primary">NextUI</p>
|
||||
</Link>
|
||||
</footer>
|
||||
<section className="md:absolute md:top-0 w-full ">
|
||||
<img
|
||||
alt="banner"
|
||||
src="/headerbannerpng.png"
|
||||
className=" w-full"
|
||||
/>
|
||||
<main className="pt-8 px-2 md:px-6 flex-grow">
|
||||
{children}
|
||||
</main>
|
||||
<Footer />
|
||||
</section>
|
||||
</div>
|
||||
</Providers>
|
||||
</body>
|
||||
|
|
|
|||
50
app/page.tsx
50
app/page.tsx
|
|
@ -1,51 +1,11 @@
|
|||
import { Link } from "@nextui-org/link";
|
||||
import { Snippet } from "@nextui-org/snippet";
|
||||
import { Code } from "@nextui-org/code"
|
||||
import { button as buttonStyles } from "@nextui-org/theme";
|
||||
import { siteConfig } from "@/config/site";
|
||||
import { title, subtitle } from "@/components/primitives";
|
||||
import { GithubIcon } from "@/components/icons";
|
||||
import BodyLayout from "@/components/Landing Page/BodyLayout";
|
||||
import HeaderNews from "@/components/Landing Page/HeaderNews";
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<section className="flex flex-col items-center justify-center gap-4 py-8 md:py-10">
|
||||
<div className="inline-block max-w-lg text-center justify-center">
|
||||
<h1 className={title()}>Make </h1>
|
||||
<h1 className={title({ color: "violet" })}>beautiful </h1>
|
||||
<br />
|
||||
<h1 className={title()}>
|
||||
websites regardless of your design experience.
|
||||
</h1>
|
||||
<h2 className={subtitle({ class: "mt-4" })}>
|
||||
Beautiful, fast and modern React UI library.
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-3">
|
||||
<Link
|
||||
isExternal
|
||||
href={siteConfig.links.docs}
|
||||
className={buttonStyles({ color: "primary", radius: "full", variant: "shadow" })}
|
||||
>
|
||||
Documentation
|
||||
</Link>
|
||||
<Link
|
||||
isExternal
|
||||
className={buttonStyles({ variant: "bordered", radius: "full" })}
|
||||
href={siteConfig.links.github}
|
||||
>
|
||||
<GithubIcon size={20} />
|
||||
GitHub
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="mt-8">
|
||||
<Snippet hideSymbol hideCopyButton variant="flat">
|
||||
<span>
|
||||
Get started by editing <Code color="primary">app/page.tsx</Code>
|
||||
</span>
|
||||
</Snippet>
|
||||
</div>
|
||||
<section>
|
||||
<HeaderNews />
|
||||
<BodyLayout />
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
'use client'
|
||||
import CategorySatker from './CategorySatker'
|
||||
import ENewsPolri from './ENewsPolri'
|
||||
import MediaSocial from './MediaSocial'
|
||||
import RegionalNews from './RegionalNews'
|
||||
import SidebarNav from './SidebarNav'
|
||||
|
||||
export default function BodyLayout() {
|
||||
return (
|
||||
<div className='md:flex bg-white text-black mt-8 pb-8'>
|
||||
<div className='w-auto md:w-[75%] space-y-5'>
|
||||
<CategorySatker />
|
||||
<RegionalNews />
|
||||
<MediaSocial />
|
||||
<ENewsPolri />
|
||||
</div>
|
||||
<div className='w-auto md:w-[25%]'>
|
||||
<SidebarNav />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
// h-[3700px]
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
import { Button } from '@nextui-org/button';
|
||||
import { Image } from '@nextui-org/react';
|
||||
import { ChevronLeftWhite, ChevronRightWhite } from '../icons';
|
||||
|
||||
export default function CategorySatker() {
|
||||
const list = [
|
||||
{
|
||||
img: "/temp/poldametro.svg",
|
||||
title: "Polda Metro Jaya"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-sumut.svg",
|
||||
title: "Polda Sumatra Utara"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-banten.svg",
|
||||
title: "Polda Banten"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-jateng.svg",
|
||||
title: "Polda Jawa Tengah"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-jatim.svg",
|
||||
title: "Polda Jawa Timur"
|
||||
},
|
||||
];
|
||||
return (
|
||||
<div className='text-center bg-[#DD8306] rounded-none md:rounded-lg h-auto md:h-[338px] space-y-7 m-auto md:m-10 flex flex-col justify-center'>
|
||||
<div className='text-white font-bold text-2xl underline underline-offset-4 decoration-red-600'>Kategori Satker</div>
|
||||
<div className='flex items-center justify-around'>
|
||||
<div><ChevronLeftWhite /></div>
|
||||
<div className="gap-2 md:gap-4 grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5">
|
||||
{list.map((item, index) => (
|
||||
<div className='w-[157px] h-[141px] flex flex-col items-center justify-evenly'>
|
||||
<Image
|
||||
radius="lg"
|
||||
className="h-[59px]"
|
||||
src={item.img}
|
||||
/>
|
||||
<p className='text-xs font-bold text-white'>{item.title}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div><ChevronRightWhite /></div>
|
||||
</div>
|
||||
<div>
|
||||
<Button
|
||||
className='bg-white text-[#DD8306] font-bold'
|
||||
size='sm'
|
||||
>
|
||||
Lihat Lebih Banyak
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
import { Button, Card, CardBody, CardFooter, } from '@nextui-org/react'
|
||||
import Image from 'next/image';
|
||||
import React from 'react'
|
||||
import { ChevronLeftWhite, ChevronRightIcon } from '../icons';
|
||||
|
||||
export default function ENewsPolri() {
|
||||
const eNews = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Tribrata News Edisi 32 /IV-VI/ENews Polri/2024",
|
||||
img: "/headernews.png",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Tribrata News Edisi 32 /IV-VI/ 2024",
|
||||
img: "/headernews.png",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Tribrata News Edisi 32 /IV-VI/ 2024",
|
||||
img: "/headernews.png",
|
||||
},
|
||||
];
|
||||
return (
|
||||
<div className='bg-[#1F1A17] text-center rounded-none md:rounded-lg h-auto md:h-[338px] space-y-7 m-auto md:m-10 flex flex-col justify-center items-center'>
|
||||
<p className='text-white font-bold text-2xl underline underline-offset-4 decoration-red-600'>E-Majalah Polri</p>
|
||||
<div className='flex flex-row w-full items-center justify-between'>
|
||||
<ChevronLeftWhite />
|
||||
<div className='md:flex space-y-4 md:space-y-0 gap-4'>
|
||||
{eNews.map((data) => (
|
||||
<div key={data.id} className='h-auto md:h-[200px] w-[274px]'>
|
||||
<Card className='text-white'
|
||||
isFooterBlurred
|
||||
>
|
||||
<Image
|
||||
alt="Woman listing to music"
|
||||
className="object-cover h-full"
|
||||
height={100}
|
||||
src={data.img}
|
||||
width={100}
|
||||
layout='responsive'
|
||||
/>
|
||||
<CardFooter className="before:bg-white/10 border-white/20 border-1 overflow-hidden py-1 md:absolute before:rounded-xl bottom-1 w-[calc(100%_-_8px)] shadow-small ml-1 z-10">
|
||||
<p className='text-xs text-left'>{data.title}</p>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<ChevronRightIcon color='white' />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
import React from 'react'
|
||||
|
||||
export default function Footer() {
|
||||
return (
|
||||
<div className='relative text-xs leading-4 md:leading-loose lg:leading-8 font-semibold '>
|
||||
<div className='h-[620px] md:h-[720px] lg:h-auto bg-black'>
|
||||
<img src="/footer.png" alt="" className='w-full h-full object-cover object-left-top opacity-50' />
|
||||
|
||||
</div>
|
||||
<div className="absolute top-0 left-0 w-full grid grid-cols-3 md:grid-cols-5 lg:grid-cols-5 gap-2 md:gap-4 px-1 md:px-10 lg:px-20 pt-5 md:pt-16 pb-5 md:pb-20 text-white">
|
||||
<div className='pb-2 md:pb-0'>
|
||||
<p>Berita Terkini</p>
|
||||
<p>Info Komnas Anak</p>
|
||||
<p>Info Komnas Perempuan</p>
|
||||
<p>Kontak</p>
|
||||
</div>
|
||||
<div className='pb-2 md:pb-0'>
|
||||
<p>Tentang PPID</p>
|
||||
<p>Profil Pimpinan Polri</p>
|
||||
<p>Struktur Organisasi</p>
|
||||
<p>Visi & Misi</p>
|
||||
<p>Logo</p>
|
||||
</div>
|
||||
<div className='pb-2 md:pb-0'>
|
||||
<p>Informasi Berkala</p>
|
||||
<p>Informasi Serta Merta</p>
|
||||
<p>Informasi Setiap Saat</p>
|
||||
<p>Informasi Dikecualikan</p>
|
||||
<p>UU & Peraturan</p>
|
||||
<p>Penerangan Satuan</p>
|
||||
</div>
|
||||
<div className='pb-2 md:pb-0'>
|
||||
<p>SP2HP</p>
|
||||
<p>Formulir Permohonan Informasi</p>
|
||||
<p>Pelayanan SIM</p>
|
||||
<p>Pelayanan E-Rikkes SIM</p>
|
||||
<p>Pelayana Test Psikologi SIM</p>
|
||||
<p>Pelayanan E-Avis</p>
|
||||
<p>Pelayanan STNK & BPKP</p>
|
||||
<p>Pelayanan SKCK</p>
|
||||
<p>Pelayanan Karantina Presisi</p>
|
||||
<p>Pelayanan Propam Presisi</p>
|
||||
<p>Pelayanan Dumas Presisi</p>
|
||||
<p>Pelayanan Polisiku</p>
|
||||
<p>Pelayanan BINMAS</p>
|
||||
</div>
|
||||
<div>
|
||||
<p>Pelayanan BINMAS</p>
|
||||
<p>Pelayanan BINMAS</p>
|
||||
<p>Pelayanan BINMAS</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className='text-center py-4 text-sm flex justify-center font-normal'>© Copyright Humas<p className='text-red-700'> POLRI ®</p> All Rights Reserved</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
import { Button, Card, CardBody, CardFooter, ScrollShadow } from '@nextui-org/react'
|
||||
import React from 'react'
|
||||
import { EyeIcon } from '../icons'
|
||||
import Image from 'next/image'
|
||||
|
||||
export default function HeaderNews() {
|
||||
return (
|
||||
<div className='md:flex items-center text-center bg-black dark:bg-white rounded-md gap-3 p-2'>
|
||||
<div className='w-auto md:w-[25%] p-2 bg-[#020101] text-white rounded-md'>
|
||||
<p className='text-lg font-bold h-10'>Berita Terkini</p>
|
||||
<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 className='m-2'>
|
||||
<Button
|
||||
className='w-full bg-[#DD8306] font-bold rounded-bl-md rounded-br-md focus:outline-none'
|
||||
radius='none'
|
||||
>
|
||||
Lihat Semua
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-auto md:w-[50%]'>
|
||||
<Card
|
||||
isFooterBlurred
|
||||
radius="lg"
|
||||
className="border-none"
|
||||
>
|
||||
<Image
|
||||
alt="Woman listing to music"
|
||||
className="object-cover"
|
||||
height={660}
|
||||
src="/headernews.png"
|
||||
width={460}
|
||||
layout="responsive"
|
||||
/>
|
||||
<CardFooter className="before:bg-white/10 border-white/20 border-1 overflow-hidden py-1 md:absolute before:rounded-xl rounded-large bottom-1 w-[calc(100%_-_8px)] shadow-small ml-1 z-10">
|
||||
<div className='text-white'>
|
||||
<p className='text-left font-semibold'>Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari</p>
|
||||
<p className='py-[2px] text-left text-sm'>21-07-2023 13:50</p>
|
||||
<p className='flex items-center gap-1 text-sm'><EyeIcon />82</p>
|
||||
</div>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</div>
|
||||
<div className='w-auto md:w-[25%] p-2 rounded-md text-white dark:text-black '>
|
||||
<div className='text-lg font-bold border-5 border-blue-950 rounded-tr-lg rounded-tl-lg'>
|
||||
<img src="/gprheader.png" alt="gpr" className='w-full' />
|
||||
</div>
|
||||
<div className='overflow-y-scroll h-[343px] border-5 border-blue-950 text-black'>
|
||||
<div className='text-xs text-left m-2 p-2 bg-[#FFFFFF] rounded-md border-dashed border-2 border-sky-500'>
|
||||
<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-[#FFFFFF] rounded-md border-dashed border-2 border-sky-500'>
|
||||
<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-[#FFFFFF] rounded-md border-dashed border-2 border-sky-500'>
|
||||
<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-[#FFFFFF] rounded-md border-dashed border-2 border-sky-500'>
|
||||
<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>
|
||||
<div className=' border-5 border-blue-950 rounded-bl-lg rounded-br-lg'>
|
||||
<img src="/gprfooter.png" alt="gpr" className='w-full' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,276 @@
|
|||
import { Card, CardBody } from '@nextui-org/react'
|
||||
import React from 'react'
|
||||
import { ChevronRightIcon, DotsIcon, FbIcon, IconX, IgIcon, TtIcon, TwitterIcon, YtIcon } from '../icons'
|
||||
|
||||
export default function MediaSocial() {
|
||||
|
||||
const dummyData = [
|
||||
{
|
||||
id: 1,
|
||||
logo: "/logohumas.png",
|
||||
division: "Divisi Humas Polri",
|
||||
type: "/temp/offical.svg",
|
||||
username: "@DivHumas_Polri",
|
||||
followIcon: "/temp/iconX.svg",
|
||||
description:
|
||||
"Pada pembukaan KTT ke-43 ASEAN, Presiden RI, H. Joko Widodo menegaskan bahwa kesatuan ASEAN sampai saat ini masih terjaga dan terpelihara dengan baik.",
|
||||
imageUrl: "/headernews.png",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
logo: "/logohumas.png",
|
||||
division: "Divisi Humas Polri",
|
||||
username: "@DivHumas_Polri",
|
||||
type: "/temp/offical.svg",
|
||||
followIcon: "/temp/iconX.svg",
|
||||
description:
|
||||
"Pada pembukaan KTT ke-43 ASEAN, Presiden RI, H. Joko Widodo menegaskan bahwa kesatuan ASEAN sampai saat ini masih terjaga dan terpelihara dengan baik.",
|
||||
imageUrl: "/headernews.png",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
logo: "/logohumas.png",
|
||||
division: "Divisi Humas Polri",
|
||||
type: "/temp/offical.svg",
|
||||
username: "@DivHumas_Polri",
|
||||
followIcon: "/temp/iconX.svg",
|
||||
description:
|
||||
"Pada pembukaan KTT ke-43 ASEAN, Presiden RI, H. Joko Widodo menegaskan bahwa kesatuan ASEAN sampai saat ini masih terjaga dan terpelihara dengan baik.",
|
||||
imageUrl: "/headernews.png",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
logo: "/logohumas.png",
|
||||
division: "Divisi Humas Polri",
|
||||
username: "@DivHumas_Polri",
|
||||
followIcon: "/temp/iconX.svg",
|
||||
description:
|
||||
"Pada pembukaan KTT ke-43 ASEAN, Presiden RI, H. Joko Widodo menegaskan bahwa kesatuan ASEAN sampai saat ini masih terjaga dan terpelihara dengan baik.",
|
||||
imageUrl: "/headernews.png",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
logo: "/logohumas.png",
|
||||
division: "Divisi Humas Polri",
|
||||
username: "@DivHumas_Polri",
|
||||
followIcon: "/temp/iconX.svg",
|
||||
description:
|
||||
"Pada pembukaan KTT ke-43 ASEAN, Presiden RI, H. Joko Widodo menegaskan bahwa kesatuan ASEAN sampai saat ini masih terjaga dan terpelihara dengan baik.",
|
||||
imageUrl: "/headernews.png",
|
||||
},
|
||||
];
|
||||
|
||||
const limitedData = dummyData.slice(0, 3);
|
||||
|
||||
return (
|
||||
<div className='m-auto md:m-10 space-y-5 md:space-y-10'>
|
||||
<p className='text-2xl font- underline underline-offset-8 decoration-red-700'>MediaSocial</p>
|
||||
<div>
|
||||
<div className='flex items-center justify-between pb-3'>
|
||||
<div className='font-semibold flex items-center'>
|
||||
<TwitterIcon color='#1DA1F2' />
|
||||
<p className='pl-2'>Twitter</p>
|
||||
</div>
|
||||
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
|
||||
</div>
|
||||
<div className='md:flex gap-4 justify-center'>
|
||||
{limitedData.map((data) => (
|
||||
<div
|
||||
key={data.id}
|
||||
className='bg-white text-black h-[400px] w-auto md:w-[315px] border-2 rounded-md px-5 py-3'
|
||||
>
|
||||
<div className='h-[20%] flex items-center text-xs justify-between'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='h-[50px]'>
|
||||
<img src={data.logo} alt="logo" className='h-[50px]' />
|
||||
</div>
|
||||
<div className='flex flex-col gap-1'>
|
||||
<p className='flex gap-1'>{data.division} <img src={data.type} alt="" /></p>
|
||||
<p className='text-blue-500'>{data.username}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='space-y-1 flex flex-col items-end'>
|
||||
<div><img src={data.followIcon} alt="" /></div>
|
||||
<p className='text-blue-500 font-bold'>Follow</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[35%] text-xs'>
|
||||
{data.description}
|
||||
<a className='text-blue-500'><br />Lihat Selengkapnya</a>
|
||||
</div>
|
||||
<div className='h-[45%]'>
|
||||
<div className='flex justify-center'>
|
||||
<img src={data.imageUrl} alt="header" className='h-[165px]' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className='flex items-center justify-between pb-3'>
|
||||
<div className='font-semibold flex items-center'>
|
||||
<IgIcon height={50} color='#1DA1F2' />
|
||||
<p className='pl-2'>Instagram</p>
|
||||
</div>
|
||||
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
|
||||
</div>
|
||||
<div className='md:flex gap-4 justify-center'>
|
||||
{limitedData.map((data) => (
|
||||
<div
|
||||
key={data.id}
|
||||
className='bg-white text-black h-[400px] w-auto md:w-[315px] border-2 rounded-md px-5 py-3'
|
||||
>
|
||||
<div className='h-[20%] flex items-center text-xs justify-between'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='h-[50px]'>
|
||||
<img src={data.logo} alt="logo" className='h-[50px]' />
|
||||
</div>
|
||||
<div className='flex flex-col gap-1'>
|
||||
<p className='flex gap-1'>{data.division} <img src={data.type} alt="" /></p>
|
||||
<p className='text-blue-500'>{data.username}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex flex-col items-end'>
|
||||
<div><img src='/temp/iconIG.svg' alt="" /></div>
|
||||
<p className='text-blue-500 font-bold'><u>Lihat Profile</u></p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[35%] text-xs'>
|
||||
{data.description}
|
||||
<a className='text-blue-500'><br />Lihat Selengkapnya</a>
|
||||
</div>
|
||||
<div className='h-[45%]'>
|
||||
<div className='flex justify-center'>
|
||||
<img src={data.imageUrl} alt="header" className='h-[165px]' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className='flex items-center justify-between pb-3'>
|
||||
<div className='font-semibold flex items-center'>
|
||||
<FbIcon color='#1DA1F2' />
|
||||
Facebook
|
||||
</div>
|
||||
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
|
||||
</div>
|
||||
<div className='md:flex gap-4 justify-center'>
|
||||
{limitedData.map((data) => (
|
||||
<div
|
||||
key={data.id}
|
||||
className='bg-white text-black h-[400px] w-auto md:w-[315px] border-2 rounded-md px-5 py-3'
|
||||
>
|
||||
<div className='h-[20%] flex items-center text-xs justify-between'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='h-[50px]'>
|
||||
<img src={data.logo} alt="logo" className='h-[50px]' />
|
||||
</div>
|
||||
<div className='flex flex-col gap-1 justify-center'>
|
||||
<p className='flex gap-1'>{data.division} <img src={data.type} alt="" /></p>
|
||||
</div>
|
||||
</div>
|
||||
<div className=''>
|
||||
<div className='flex gap-1 text-blue-500'><img src="/temp/share.svg" alt="" />Share</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[35%] text-xs'>
|
||||
{data.description}
|
||||
<a className='text-blue-500'><br />Lihat Selengkapnya</a>
|
||||
</div>
|
||||
<div className='h-[45%]'>
|
||||
<div className='flex justify-center'>
|
||||
<img src={data.imageUrl} alt="header" className='h-[165px]' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className='flex items-center justify-between pb-3'>
|
||||
<div className='font-semibold flex items-center'>
|
||||
<TtIcon color='#1DA1F2' />
|
||||
Tiktok
|
||||
</div>
|
||||
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
|
||||
</div>
|
||||
<div className='md:flex gap-4 justify-center'>
|
||||
{limitedData.map((data) => (
|
||||
<div
|
||||
key={data.id}
|
||||
className='bg-white text-black h-[400px] w-auto md:w-[315px] border-2 rounded-md px-5 py-3'
|
||||
>
|
||||
<div className='h-[20%] flex items-center text-xs justify-between'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='h-[50px]'>
|
||||
<img src={data.logo} alt="logo" className='h-[50px]' />
|
||||
</div>
|
||||
<div className='flex flex-col gap-1 justify-center'>
|
||||
<p className='flex gap-1'>{data.division} <img src={data.type} alt="" /></p>
|
||||
</div>
|
||||
</div>
|
||||
<div className=''>
|
||||
<div className='flex gap-1 text-blue-500'><img src="/temp/share.svg" alt="" />Share</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[35%] text-xs'>
|
||||
{data.description}
|
||||
<a className='text-blue-500'><br />Lihat Selengkapnya</a>
|
||||
</div>
|
||||
<div className='h-[45%]'>
|
||||
<div className='flex justify-center'>
|
||||
<img src={data.imageUrl} alt="header" className='h-[165px]' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className='flex items-center justify-between pb-3'>
|
||||
<div className='font-semibold flex items-center'>
|
||||
<YtIcon color='#1DA1F2' />
|
||||
Youtube
|
||||
</div>
|
||||
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
|
||||
</div>
|
||||
<div className='md:flex gap-4 justify-center'>
|
||||
{limitedData.map((data) => (
|
||||
<div
|
||||
key={data.id}
|
||||
className='bg-white text-black h-[400px] w-auto md:w-[315px] border-2 rounded-md px-5 py-3'
|
||||
>
|
||||
<div className='h-[20%] flex items-center text-xs justify-between'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='h-[50px]'>
|
||||
<img src={data.logo} alt="logo" className='h-[50px]' />
|
||||
</div>
|
||||
<div className='flex flex-col gap-1 justify-center'>
|
||||
<p className='flex gap-1'>{data.division} <img src={data.type} alt="" /></p>
|
||||
{/* <p className='text-blue-500'>{data.username}</p> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className='space-y-1 flex flex-col items-end'>
|
||||
<div><DotsIcon /></div>
|
||||
{/* <p className='text-blue-500 font-bold'>Follow</p> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[35%] text-xs'>
|
||||
{data.description}
|
||||
<a className='text-blue-500'><br />Lihat Selengkapnya</a>
|
||||
</div>
|
||||
<div className='h-[45%]'>
|
||||
<div className='flex justify-center'>
|
||||
<img src={data.imageUrl} alt="header" className='h-[165px]' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
import { Button } from '@nextui-org/button';
|
||||
import { Image } from '@nextui-org/react';
|
||||
import { ChevronLeftWhite, ChevronRightWhite } from '../icons';
|
||||
|
||||
export default function RegionalNews() {
|
||||
const list = [
|
||||
{
|
||||
img: "/temp/poldametro.svg",
|
||||
title: "Polda Metro Jaya"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-sumut.svg",
|
||||
title: "Polda Sumatra Utara"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-banten.svg",
|
||||
title: "Polda Banten"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-jateng.svg",
|
||||
title: "Polda Jawa Tengah"
|
||||
},
|
||||
{
|
||||
img: "/temp/polda-jatim.svg",
|
||||
title: "Polda Jawa Timur"
|
||||
},
|
||||
];
|
||||
return (
|
||||
<div className='text-center border-3 border-[#DD8306] rounded-none md:rounded-lg h-auto md:h-[338px] space-y-7 m-auto md:m-10 flex flex-col justify-center'>
|
||||
<div className='font-bold text-2xl underline underline-offset-4 decoration-red-600 text-[#DD8306]'>Berita Wilayah</div>
|
||||
<div className='flex items-center justify-around'>
|
||||
<div><ChevronLeftWhite color='orange' /></div>
|
||||
<div className="gap-2 md:gap-4 grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5">
|
||||
{list.map((item, index) => (
|
||||
<div className='w-[157px] h-[141px] flex flex-col items-center justify-evenly'>
|
||||
<Image
|
||||
radius="lg"
|
||||
className="h-[59px]"
|
||||
src={item.img}
|
||||
/>
|
||||
<p className='text-xs font-bold text-[#DD8306]'>{item.title}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div><ChevronRightWhite color='orange' /></div>
|
||||
</div>
|
||||
<div>
|
||||
<Button
|
||||
className='bg-[#DD8306] text-white font-bold'
|
||||
size='sm'
|
||||
>
|
||||
Lihat Lebih Banyak
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
import { ScrollShadow } from '@nextui-org/react'
|
||||
import React from 'react'
|
||||
import { EyeIcon } from '../icons'
|
||||
|
||||
export default function SidebarNav() {
|
||||
return (
|
||||
<>
|
||||
<div className='space-y-4'>
|
||||
<div className='text-xl font-semibold underline underline-offset-4 decoration-red-600'>
|
||||
Media Update
|
||||
</div>
|
||||
<div className='h-[360px] p-2 bg-[#020101] text-white rounded-md'>
|
||||
<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 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="/publikasi7.png" alt="publikasi" />
|
||||
</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 m-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 className='text-xl font-semibold underline underline-offset-4 decoration-red-600 pb-5'>Info Eksternal</div>
|
||||
<div className='flex flex-col space-y-4'>
|
||||
<div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto md:w-[300px] p-4 shadow-md'>
|
||||
<img src="/eksternal1.png" alt="" className='w-full' />
|
||||
<p className='leading-tight text-blue-500 pt-3'>Berita BPS</p>
|
||||
<p className='text-xs text-gray-500 pt-1'>Berita terbaru dari Badan Pusat Statistika Indonesia</p>
|
||||
<p className='leading-tight text-blue-500 pt-2'>Pengumuman BPS</p>
|
||||
<p className='text-xs text-gray-500 pt-1s'>Pengumuman terbaru dari Badan Pusat Statistika Indonesia</p>
|
||||
</div>
|
||||
<div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto md:w-[300px] p-4 shadow-md'>
|
||||
<img src="/eksternal2.png" alt="" className='w-full' />
|
||||
<p className='leading-tight text-blue-500 pt-5'>Berita KPU</p>
|
||||
<p className='text-xs text-gray-500 pt-1'>Berita terbaru dari Komisi Pemilihan Umum Indonesia</p>
|
||||
<p className='leading-tight text-blue-500 pt-2'>Pengumuman KPU</p>
|
||||
<p className='text-xs text-gray-500 pt-1s'>Pengumuman terbaru dari Komisi Pemilihan Umum Indonesia</p>
|
||||
</div>
|
||||
<div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto md:w-[300px] p-4 shadow-md'>
|
||||
<img src="/eksternal3.png" alt="" className='w-full' />
|
||||
<p className='leading-tight text-blue-500 pt-5'>Berita BAWASLU</p>
|
||||
<p className='text-xs text-gray-500 pt-1'>Berita terbaru dari Badan Pengawas Pemilihan Umum Republik Indonesia</p>
|
||||
<p className='leading-tight text-blue-500 pt-2'>Pengumuman BAWASLU</p>
|
||||
<p className='text-xs text-gray-500 pt-1s'>Pengumuman terbaru dari Badan Pusat Statistika Indonesia</p>
|
||||
</div>
|
||||
<div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto md:w-[300px] p-4 shadow-md'>
|
||||
<img src="/eksternal4.png" alt="" className='w-full' />
|
||||
<p className='leading-tight text-blue-500 pt-5'>Info KPAI</p>
|
||||
<p className='text-xs text-gray-500 pt-1'>Informasi dan Berita terbaru dari Komisi Perlindungan Anak Indonesia</p>
|
||||
</div>
|
||||
<div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto md:w-[300px] p-4 shadow-md'>
|
||||
<img src="/eksternal5.png" alt="" className='w-full' />
|
||||
<p className='leading-tight text-blue-500 pt-5'>INFO KOMNAS PEREMPUAN</p>
|
||||
<p className='text-xs text-gray-500 pt-1'>Info dan Berita terbaru dari Komnas Perempuan Indonesia</p>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -45,9 +45,10 @@ export const DiscordIcon: React.FC<IconSvgProps> = ({
|
|||
};
|
||||
|
||||
export const TwitterIcon: React.FC<IconSvgProps> = ({
|
||||
size = 24,
|
||||
size = 30,
|
||||
width,
|
||||
height,
|
||||
color = "white",
|
||||
...props
|
||||
}) => {
|
||||
return (
|
||||
|
|
@ -60,10 +61,30 @@ export const TwitterIcon: React.FC<IconSvgProps> = ({
|
|||
<path
|
||||
d="M19.633 7.997c.013.175.013.349.013.523 0 5.325-4.053 11.461-11.46 11.461-2.282 0-4.402-.661-6.186-1.809.324.037.636.05.973.05a8.07 8.07 0 0 0 5.001-1.721 4.036 4.036 0 0 1-3.767-2.793c.249.037.499.062.761.062.361 0 .724-.05 1.061-.137a4.027 4.027 0 0 1-3.23-3.953v-.05c.537.299 1.16.486 1.82.511a4.022 4.022 0 0 1-1.796-3.354c0-.748.199-1.434.548-2.032a11.457 11.457 0 0 0 8.306 4.215c-.062-.3-.1-.611-.1-.923a4.026 4.026 0 0 1 4.028-4.028c1.16 0 2.207.486 2.943 1.272a7.957 7.957 0 0 0 2.556-.973 4.02 4.02 0 0 1-1.771 2.22 8.073 8.073 0 0 0 2.319-.624 8.645 8.645 0 0 1-2.019 2.083z"
|
||||
fill="currentColor"
|
||||
color={color}
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
export const IconX: React.FC<IconSvgProps> = ({
|
||||
size = 30,
|
||||
width,
|
||||
height,
|
||||
color = "white",
|
||||
...props
|
||||
}) => {
|
||||
return (
|
||||
<svg
|
||||
height={size || height}
|
||||
viewBox="0 0 24 24"
|
||||
width={size || width}
|
||||
{...props}
|
||||
>
|
||||
<path d="M11.9998 2.66663L8.6665 7.11129M8.6665 7.11129L5.53317 2.93329C5.47107 2.8505 5.39055 2.78329 5.29798 2.73701C5.20541 2.69072 5.10333 2.66663 4.99984 2.66663H2.6665L7.33317 8.88863M8.6665 7.11129L13.3332 13.3333H10.9998C10.8963 13.3333 10.7943 13.3092 10.7017 13.2629C10.6091 13.2166 10.5286 13.1494 10.4665 13.0666L7.33317 8.88863M3.99984 13.3333L7.33317 8.88863" stroke="#1F1A17" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round" />
|
||||
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
export const GithubIcon: React.FC<IconSvgProps> = ({
|
||||
size = 24,
|
||||
|
|
@ -186,29 +207,239 @@ export const SearchIcon = (props: IconSvgProps) => (
|
|||
);
|
||||
|
||||
export const NextUILogo: React.FC<IconSvgProps> = (props) => {
|
||||
const { width, height = 40 } = props;
|
||||
const { width, height = 40 } = props;
|
||||
|
||||
return (
|
||||
<svg
|
||||
fill="none"
|
||||
height={height}
|
||||
viewBox="0 0 161 32"
|
||||
width={width}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<path
|
||||
className="fill-black dark:fill-white"
|
||||
d="M55.6827 5V26.6275H53.7794L41.1235 8.51665H40.9563V26.6275H39V5H40.89L53.5911 23.1323H53.7555V5H55.6827ZM67.4831 26.9663C66.1109 27.0019 64.7581 26.6329 63.5903 25.9044C62.4852 25.185 61.6054 24.1633 61.0537 22.9582C60.4354 21.5961 60.1298 20.1106 60.1598 18.6126C60.132 17.1113 60.4375 15.6228 61.0537 14.2563C61.5954 13.0511 62.4525 12.0179 63.5326 11.268C64.6166 10.5379 65.8958 10.16 67.1986 10.1852C68.0611 10.1837 68.9162 10.3468 69.7187 10.666C70.5398 10.9946 71.2829 11.4948 71.8992 12.1337C72.5764 12.8435 73.0985 13.6889 73.4318 14.6152C73.8311 15.7483 74.0226 16.9455 73.9968 18.1479V19.0773H63.2262V17.4194H72.0935C72.1083 16.4456 71.8952 15.4821 71.4714 14.6072C71.083 13.803 70.4874 13.1191 69.7472 12.6272C68.9887 12.1348 68.1022 11.8812 67.2006 11.8987C66.2411 11.8807 65.3005 12.1689 64.5128 12.7223C63.7332 13.2783 63.1083 14.0275 62.6984 14.8978C62.2582 15.8199 62.0314 16.831 62.0352 17.8546V18.8476C62.009 20.0078 62.2354 21.1595 62.6984 22.2217C63.1005 23.1349 63.7564 23.9108 64.5864 24.4554C65.4554 24.9973 66.4621 25.2717 67.4831 25.2448C68.1676 25.2588 68.848 25.1368 69.4859 24.8859C70.0301 24.6666 70.5242 24.3376 70.9382 23.919C71.3183 23.5345 71.6217 23.0799 71.8322 22.5799L73.5995 23.1604C73.3388 23.8697 72.9304 24.5143 72.4019 25.0506C71.8132 25.6529 71.1086 26.1269 70.3314 26.4434C69.4258 26.8068 68.4575 26.9846 67.4831 26.9663V26.9663ZM78.8233 10.4075L82.9655 17.325L87.1076 10.4075H89.2683L84.1008 18.5175L89.2683 26.6275H87.103L82.9608 19.9317L78.8193 26.6275H76.6647L81.7711 18.5169L76.6647 10.4062L78.8233 10.4075ZM99.5142 10.4075V12.0447H91.8413V10.4075H99.5142ZM94.2427 6.52397H96.1148V22.3931C96.086 22.9446 96.2051 23.4938 96.4597 23.9827C96.6652 24.344 96.9805 24.629 97.3589 24.7955C97.7328 24.9548 98.1349 25.0357 98.5407 25.0332C98.7508 25.0359 98.9607 25.02 99.168 24.9857C99.3422 24.954 99.4956 24.9205 99.6283 24.8853L100.026 26.5853C99.8062 26.6672 99.5805 26.7327 99.3511 26.7815C99.0274 26.847 98.6977 26.8771 98.3676 26.8712C97.6854 26.871 97.0119 26.7156 96.3973 26.4166C95.7683 26.1156 95.2317 25.6485 94.8442 25.0647C94.4214 24.4018 94.2097 23.6242 94.2374 22.8363L94.2427 6.52397ZM118.398 5H120.354V19.3204C120.376 20.7052 120.022 22.0697 119.328 23.2649C118.644 24.4235 117.658 25.3698 116.477 26.0001C115.168 26.6879 113.708 27.0311 112.232 26.9978C110.759 27.029 109.302 26.6835 107.996 25.9934C106.815 25.362 105.827 24.4161 105.141 23.2582C104.447 22.0651 104.092 20.7022 104.115 19.319V5H106.08V19.1831C106.061 20.2559 106.324 21.3147 106.843 22.2511C107.349 23.1459 108.094 23.8795 108.992 24.3683C109.993 24.9011 111.111 25.1664 112.242 25.139C113.373 25.1656 114.493 24.9003 115.495 24.3683C116.395 23.8815 117.14 23.1475 117.644 22.2511C118.16 21.3136 118.421 20.2553 118.402 19.1831L118.398 5ZM128 5V26.6275H126.041V5H128Z"
|
||||
/>
|
||||
<path
|
||||
className="fill-black dark:fill-white"
|
||||
d="M23.5294 0H8.47059C3.79241 0 0 3.79241 0 8.47059V23.5294C0 28.2076 3.79241 32 8.47059 32H23.5294C28.2076 32 32 28.2076 32 23.5294V8.47059C32 3.79241 28.2076 0 23.5294 0Z"
|
||||
/>
|
||||
<path
|
||||
className="fill-white dark:fill-black"
|
||||
d="M17.5667 9.21729H18.8111V18.2403C18.8255 19.1128 18.6 19.9726 18.159 20.7256C17.7241 21.4555 17.0968 22.0518 16.3458 22.4491C15.5717 22.8683 14.6722 23.0779 13.6473 23.0779C12.627 23.0779 11.7286 22.8672 10.9521 22.4457C10.2007 22.0478 9.5727 21.4518 9.13602 20.7223C8.6948 19.9705 8.4692 19.1118 8.48396 18.2403V9.21729H9.72854V18.1538C9.71656 18.8298 9.88417 19.4968 10.2143 20.0868C10.5362 20.6506 11.0099 21.1129 11.5814 21.421C12.1689 21.7448 12.8576 21.9067 13.6475 21.9067C14.4374 21.9067 15.1272 21.7448 15.7169 21.421C16.2895 21.1142 16.7635 20.6516 17.0844 20.0868C17.4124 19.4961 17.5788 18.8293 17.5667 18.1538V9.21729ZM23.6753 9.21729V22.845H22.4309V9.21729H23.6753Z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
return (
|
||||
<svg
|
||||
fill="none"
|
||||
height={height}
|
||||
viewBox="0 0 161 32"
|
||||
width={width}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<path
|
||||
className="fill-black dark:fill-white"
|
||||
d="M55.6827 5V26.6275H53.7794L41.1235 8.51665H40.9563V26.6275H39V5H40.89L53.5911 23.1323H53.7555V5H55.6827ZM67.4831 26.9663C66.1109 27.0019 64.7581 26.6329 63.5903 25.9044C62.4852 25.185 61.6054 24.1633 61.0537 22.9582C60.4354 21.5961 60.1298 20.1106 60.1598 18.6126C60.132 17.1113 60.4375 15.6228 61.0537 14.2563C61.5954 13.0511 62.4525 12.0179 63.5326 11.268C64.6166 10.5379 65.8958 10.16 67.1986 10.1852C68.0611 10.1837 68.9162 10.3468 69.7187 10.666C70.5398 10.9946 71.2829 11.4948 71.8992 12.1337C72.5764 12.8435 73.0985 13.6889 73.4318 14.6152C73.8311 15.7483 74.0226 16.9455 73.9968 18.1479V19.0773H63.2262V17.4194H72.0935C72.1083 16.4456 71.8952 15.4821 71.4714 14.6072C71.083 13.803 70.4874 13.1191 69.7472 12.6272C68.9887 12.1348 68.1022 11.8812 67.2006 11.8987C66.2411 11.8807 65.3005 12.1689 64.5128 12.7223C63.7332 13.2783 63.1083 14.0275 62.6984 14.8978C62.2582 15.8199 62.0314 16.831 62.0352 17.8546V18.8476C62.009 20.0078 62.2354 21.1595 62.6984 22.2217C63.1005 23.1349 63.7564 23.9108 64.5864 24.4554C65.4554 24.9973 66.4621 25.2717 67.4831 25.2448C68.1676 25.2588 68.848 25.1368 69.4859 24.8859C70.0301 24.6666 70.5242 24.3376 70.9382 23.919C71.3183 23.5345 71.6217 23.0799 71.8322 22.5799L73.5995 23.1604C73.3388 23.8697 72.9304 24.5143 72.4019 25.0506C71.8132 25.6529 71.1086 26.1269 70.3314 26.4434C69.4258 26.8068 68.4575 26.9846 67.4831 26.9663V26.9663ZM78.8233 10.4075L82.9655 17.325L87.1076 10.4075H89.2683L84.1008 18.5175L89.2683 26.6275H87.103L82.9608 19.9317L78.8193 26.6275H76.6647L81.7711 18.5169L76.6647 10.4062L78.8233 10.4075ZM99.5142 10.4075V12.0447H91.8413V10.4075H99.5142ZM94.2427 6.52397H96.1148V22.3931C96.086 22.9446 96.2051 23.4938 96.4597 23.9827C96.6652 24.344 96.9805 24.629 97.3589 24.7955C97.7328 24.9548 98.1349 25.0357 98.5407 25.0332C98.7508 25.0359 98.9607 25.02 99.168 24.9857C99.3422 24.954 99.4956 24.9205 99.6283 24.8853L100.026 26.5853C99.8062 26.6672 99.5805 26.7327 99.3511 26.7815C99.0274 26.847 98.6977 26.8771 98.3676 26.8712C97.6854 26.871 97.0119 26.7156 96.3973 26.4166C95.7683 26.1156 95.2317 25.6485 94.8442 25.0647C94.4214 24.4018 94.2097 23.6242 94.2374 22.8363L94.2427 6.52397ZM118.398 5H120.354V19.3204C120.376 20.7052 120.022 22.0697 119.328 23.2649C118.644 24.4235 117.658 25.3698 116.477 26.0001C115.168 26.6879 113.708 27.0311 112.232 26.9978C110.759 27.029 109.302 26.6835 107.996 25.9934C106.815 25.362 105.827 24.4161 105.141 23.2582C104.447 22.0651 104.092 20.7022 104.115 19.319V5H106.08V19.1831C106.061 20.2559 106.324 21.3147 106.843 22.2511C107.349 23.1459 108.094 23.8795 108.992 24.3683C109.993 24.9011 111.111 25.1664 112.242 25.139C113.373 25.1656 114.493 24.9003 115.495 24.3683C116.395 23.8815 117.14 23.1475 117.644 22.2511C118.16 21.3136 118.421 20.2553 118.402 19.1831L118.398 5ZM128 5V26.6275H126.041V5H128Z"
|
||||
/>
|
||||
<path
|
||||
className="fill-black dark:fill-white"
|
||||
d="M23.5294 0H8.47059C3.79241 0 0 3.79241 0 8.47059V23.5294C0 28.2076 3.79241 32 8.47059 32H23.5294C28.2076 32 32 28.2076 32 23.5294V8.47059C32 3.79241 28.2076 0 23.5294 0Z"
|
||||
/>
|
||||
<path
|
||||
className="fill-white dark:fill-black"
|
||||
d="M17.5667 9.21729H18.8111V18.2403C18.8255 19.1128 18.6 19.9726 18.159 20.7256C17.7241 21.4555 17.0968 22.0518 16.3458 22.4491C15.5717 22.8683 14.6722 23.0779 13.6473 23.0779C12.627 23.0779 11.7286 22.8672 10.9521 22.4457C10.2007 22.0478 9.5727 21.4518 9.13602 20.7223C8.6948 19.9705 8.4692 19.1118 8.48396 18.2403V9.21729H9.72854V18.1538C9.71656 18.8298 9.88417 19.4968 10.2143 20.0868C10.5362 20.6506 11.0099 21.1129 11.5814 21.421C12.1689 21.7448 12.8576 21.9067 13.6475 21.9067C14.4374 21.9067 15.1272 21.7448 15.7169 21.421C16.2895 21.1142 16.7635 20.6516 17.0844 20.0868C17.4124 19.4961 17.5788 18.8293 17.5667 18.1538V9.21729ZM23.6753 9.21729V22.845H22.4309V9.21729H23.6753Z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
export const FbIcon: React.FC<IconSvgProps> = (props) => {
|
||||
const { width, height = 40 } = props;
|
||||
|
||||
return (
|
||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white" />
|
||||
<g clip-path="url(#clip0_179_4)">
|
||||
<path d="M21.6272 6.90002H8.37263C7.55895 6.90002 6.8999 7.55907 6.8999 8.37275V21.6273C6.8999 22.441 7.55895 23.1001 8.37263 23.1001H15.7363V16.4727H13.5272V14.2637H15.7363V13.0774C15.7363 10.8315 16.8305 9.84548 18.6972 9.84548C19.5911 9.84548 20.0639 9.91175 20.2877 9.94194V12.0546H19.0145C18.2222 12.0546 17.9453 12.4728 17.9453 13.3196V14.2637H20.2679L19.9527 16.4727H17.9453V23.1001H21.6272C22.4408 23.1001 23.0999 22.441 23.0999 21.6273V8.37275C23.0999 7.55907 22.4401 6.90002 21.6272 6.90002Z" fill="#3B5998" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_179_4">
|
||||
<rect width="18" height="18" fill="white" transform="translate(6 6)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
export const ChevronUpIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 24,
|
||||
fill = "none",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
height={size || height}
|
||||
width={size || width}
|
||||
viewBox="0 0 24 24"
|
||||
fill={fill}
|
||||
{...props}
|
||||
>
|
||||
<path
|
||||
className="fill-default-400"
|
||||
d="m6.293 13.293 1.414 1.414L12 10.414l4.293 4.293 1.414-1.414L12 7.586z"
|
||||
></path>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const ChevronDownIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 14,
|
||||
fill = "currentColor",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg
|
||||
height={size || height}
|
||||
width={size || width}
|
||||
viewBox="0 0 12 7"
|
||||
fill={fill}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<path
|
||||
d="M11.2902 0.309534C11.1977 0.216831 11.0878 0.143283 10.9668 0.0931015C10.8459 0.04292 10.7162 0.0170898 10.5852 0.0170898C10.4543 0.0170898 10.3246 0.04292 10.2036 0.0931015C10.0826 0.143283 9.97274 0.216831 9.88022 0.309534L6.00022 4.18953L2.12022 0.309534C1.93324 0.122556 1.67965 0.0175133 1.41522 0.0175133C1.1508 0.0175133 0.8972 0.122556 0.710222 0.309534C0.523244 0.496512 0.418203 0.750108 0.418203 1.01453C0.418203 1.27896 0.523244 1.53256 0.710222 1.71953L5.30022 6.30953C5.39274 6.40224 5.50262 6.47579 5.6236 6.52597C5.74457 6.57615 5.87425 6.60198 6.00522 6.60198C6.13619 6.60198 6.26587 6.57615 6.38685 6.52597C6.50782 6.47579 6.61771 6.40224 6.71022 6.30953L11.3002 1.71953C11.6802 1.33953 11.6802 0.699534 11.2902 0.309534Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const ChevronRightIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 24,
|
||||
fill = "currentColor",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
height={size || height}
|
||||
width={size || width}
|
||||
viewBox="0 0 24 24"
|
||||
{...props}
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M9.29 6.71a.996.996 0 0 0 0 1.41L13.17 12l-3.88 3.88a.996.996 0 1 0 1.41 1.41l4.59-4.59a.996.996 0 0 0 0-1.41L10.7 6.7c-.38-.38-1.02-.38-1.41.01z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const ChevronLeftWhite = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 24,
|
||||
color = "white",
|
||||
...props
|
||||
}: IconSvgProps & { color?: string }) => (
|
||||
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.5 15.5L7.5 10.5L12.5 5.5" stroke={color} stroke-width="2" />
|
||||
</svg>
|
||||
|
||||
);
|
||||
|
||||
export const ChevronRightWhite = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 24,
|
||||
color = "white",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.5 5.5L12.5 10.5L7.5 15.5" stroke={color} stroke-width="2" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const IgIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 14,
|
||||
fill = "currentColor",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white" />
|
||||
<path d="M15.0037 10.957C12.7678 10.957 10.9643 12.7605 10.9643 14.9965C10.9643 17.2324 12.7678 19.0359 15.0037 19.0359C17.2396 19.0359 19.0432 17.2324 19.0432 14.9965C19.0432 12.7605 17.2396 10.957 15.0037 10.957ZM15.0037 17.6226C13.5588 17.6226 12.3775 16.4449 12.3775 14.9965C12.3775 13.548 13.5553 12.3703 15.0037 12.3703C16.4521 12.3703 17.6299 13.548 17.6299 14.9965C17.6299 16.4449 16.4486 17.6226 15.0037 17.6226ZM20.1506 10.7918C20.1506 11.3156 19.7287 11.734 19.2084 11.734C18.6846 11.734 18.2662 11.3121 18.2662 10.7918C18.2662 10.2715 18.6881 9.8496 19.2084 9.8496C19.7287 9.8496 20.1506 10.2715 20.1506 10.7918ZM22.826 11.748C22.7662 10.4859 22.4779 9.36796 21.5533 8.44686C20.6322 7.52577 19.5143 7.23749 18.2521 7.17421C16.9514 7.10038 13.0525 7.10038 11.7518 7.17421C10.4932 7.23397 9.3752 7.52225 8.45059 8.44335C7.52598 9.36444 7.24121 10.4824 7.17793 11.7445C7.1041 13.0453 7.1041 16.9441 7.17793 18.2449C7.2377 19.507 7.52598 20.625 8.45059 21.5461C9.3752 22.4672 10.4896 22.7555 11.7518 22.8187C13.0525 22.8926 16.9514 22.8926 18.2521 22.8187C19.5143 22.759 20.6322 22.4707 21.5533 21.5461C22.4744 20.625 22.7627 19.507 22.826 18.2449C22.8998 16.9441 22.8998 13.0488 22.826 11.748ZM21.1455 19.6406C20.8713 20.3297 20.3404 20.8605 19.6479 21.1383C18.6107 21.5496 16.1498 21.4547 15.0037 21.4547C13.8576 21.4547 11.3932 21.5461 10.3596 21.1383C9.67051 20.864 9.13965 20.3332 8.86191 19.6406C8.45059 18.6035 8.54551 16.1426 8.54551 14.9965C8.54551 13.8504 8.4541 11.3859 8.86191 10.3523C9.13613 9.66327 9.66699 9.13241 10.3596 8.85468C11.3967 8.44335 13.8576 8.53827 15.0037 8.53827C16.1498 8.53827 18.6143 8.44686 19.6479 8.85468C20.3369 9.12889 20.8678 9.65975 21.1455 10.3523C21.5568 11.3894 21.4619 13.8504 21.4619 14.9965C21.4619 16.1426 21.5568 18.607 21.1455 19.6406Z" fill="#C922D8" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const YtIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 14,
|
||||
fill = "currentColor",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white" />
|
||||
<g clip-path="url(#clip0_214_10)">
|
||||
<path d="M23.1769 10.8776C22.9806 10.1385 22.4023 9.55647 21.668 9.35894C20.337 9 15.0001 9 15.0001 9C15.0001 9 9.66327 9 8.3323 9.35894C7.59802 9.5565 7.0197 10.1385 6.82342 10.8776C6.4668 12.2172 6.4668 15.0121 6.4668 15.0121C6.4668 15.0121 6.4668 17.8071 6.82342 19.1467C7.0197 19.8857 7.59802 20.4435 8.3323 20.6411C9.66327 21 15.0001 21 15.0001 21C15.0001 21 20.337 21 21.668 20.6411C22.4023 20.4435 22.9806 19.8857 23.1769 19.1467C23.5335 17.8071 23.5335 15.0121 23.5335 15.0121C23.5335 15.0121 23.5335 12.2172 23.1769 10.8776ZM13.2547 17.5497V12.4745L17.7153 15.0122L13.2547 17.5497Z" fill="#CD201F" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_214_10">
|
||||
<rect width="18" height="18" fill="white" transform="translate(6 6)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const TwIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 14,
|
||||
fill = "currentColor",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white" />
|
||||
<path d="M22.1497 11.3338C22.1612 11.4936 22.1612 11.6536 22.1612 11.8135C22.1612 16.6903 18.4493 22.3096 11.665 22.3096C9.57486 22.3096 7.63325 21.7043 6 20.6536C6.29696 20.6878 6.58247 20.6992 6.89086 20.6992C8.61545 20.6992 10.203 20.1168 11.4708 19.1231C9.84898 19.0888 8.48984 18.0267 8.02155 16.5647C8.25 16.599 8.47841 16.6218 8.71828 16.6218C9.04949 16.6218 9.38073 16.5761 9.68909 16.4962C7.99874 16.1535 6.73093 14.6688 6.73093 12.8756V12.83C7.22203 13.1041 7.79314 13.2754 8.39843 13.2982C7.40477 12.6358 6.75379 11.5051 6.75379 10.2259C6.75379 9.54061 6.93649 8.91244 7.25631 8.36421C9.0723 10.6028 11.802 12.0647 14.8629 12.2246C14.8058 11.9505 14.7715 11.665 14.7715 11.3795C14.7715 9.34644 16.4162 7.69037 18.4606 7.69037C19.5228 7.69037 20.4822 8.1358 21.156 8.85534C21.9898 8.69545 22.7893 8.38706 23.4974 7.96448C23.2233 8.8211 22.6408 9.54064 21.8756 9.99746C22.618 9.91755 23.3375 9.71192 23.9999 9.42642C23.4975 10.1574 22.8693 10.8083 22.1497 11.3338Z" fill="#1DA1F2" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const TtIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 14,
|
||||
fill = "currentColor",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white" />
|
||||
<g clip-path="url(#clip0_214_17)">
|
||||
<path d="M22.8748 13.3796C21.3271 13.3834 19.8173 12.9007 18.5587 11.9998V18.2829C18.5583 19.4466 18.2026 20.5824 17.5392 21.5385C16.8758 22.4946 15.9363 23.2254 14.8464 23.6332C13.7565 24.0409 12.568 24.1062 11.44 23.8203C10.312 23.5344 9.29811 22.9109 8.53398 22.0332C7.76986 21.1555 7.2919 20.0655 7.16401 18.9088C7.03613 17.7522 7.2644 16.584 7.81833 15.5606C8.37225 14.5372 9.22541 13.7073 10.2637 13.1818C11.3021 12.6564 12.4761 12.4605 13.6287 12.6203V15.7805C13.1013 15.6146 12.5349 15.6196 12.0104 15.7947C11.4859 15.9699 11.0303 16.3064 10.7084 16.756C10.3866 17.2056 10.215 17.7455 10.2183 18.2984C10.2215 18.8513 10.3994 19.3891 10.7265 19.8349C11.0537 20.2807 11.5133 20.6118 12.0398 20.7808C12.5663 20.9498 13.1327 20.9481 13.6582 20.776C14.1836 20.6039 14.6413 20.2701 14.9658 19.8224C15.2903 19.3747 15.465 18.8358 15.4649 18.2829V6H18.5587C18.5565 6.26126 18.5784 6.52216 18.6241 6.77941C18.7316 7.35368 18.9551 7.89999 19.281 8.38491C19.6069 8.86983 20.0283 9.28317 20.5194 9.59965C21.2181 10.0616 22.0372 10.3079 22.8748 10.3077V13.3796Z" fill="black" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_214_17">
|
||||
<rect width="18" height="18" fill="white" transform="translate(6 6)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const EyeIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 14,
|
||||
fill = "currentColor",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6.99992 5.25C6.53579 5.25 6.09067 5.43437 5.76248 5.76256C5.43429 6.09075 5.24992 6.53587 5.24992 7C5.24992 7.46413 5.43429 7.90925 5.76248 8.23744C6.09067 8.56563 6.53579 8.75 6.99992 8.75C7.46405 8.75 7.90917 8.56563 8.23736 8.23744C8.56554 7.90925 8.74992 7.46413 8.74992 7C8.74992 6.53587 8.56554 6.09075 8.23736 5.76256C7.90917 5.43437 7.46405 5.25 6.99992 5.25ZM6.99992 9.91667C6.22637 9.91667 5.4845 9.60938 4.93752 9.06239C4.39054 8.51541 4.08325 7.77355 4.08325 7C4.08325 6.22645 4.39054 5.48459 4.93752 4.93761C5.4845 4.39062 6.22637 4.08333 6.99992 4.08333C7.77347 4.08333 8.51533 4.39062 9.06231 4.93761C9.60929 5.48459 9.91658 6.22645 9.91658 7C9.91658 7.77355 9.60929 8.51541 9.06231 9.06239C8.51533 9.60938 7.77347 9.91667 6.99992 9.91667ZM6.99992 2.625C4.08325 2.625 1.59242 4.43917 0.583252 7C1.59242 9.56083 4.08325 11.375 6.99992 11.375C9.91658 11.375 12.4074 9.56083 13.4166 7C12.4074 4.43917 9.91658 2.625 6.99992 2.625Z" fill="white" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const DotsIcon = ({
|
||||
size,
|
||||
height = 24,
|
||||
width = 24,
|
||||
fill = "none",
|
||||
...props
|
||||
}: IconSvgProps) => (
|
||||
<svg
|
||||
height={size || height}
|
||||
width={size || width}
|
||||
viewBox="0 0 24 24"
|
||||
fill={fill}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
className="fill-default-400"
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M12 8C13.1 8 14 7.1 14 6C14 4.9 13.1 4 12 4C10.9 4 10 4.9 10 6C10 7.1 10.9 8 12 8ZM12 10C10.9 10 10 10.9 10 12C10 13.1 10.9 14 12 14C13.1 14 14 13.1 14 12C14 10.9 13.1 10 12 10ZM12 16C10.9 16 10 16.9 10 18C10 19.1 10.9 20 12 20C13.1 20 14 19.1 14 18C14 16.9 13.1 16 12 16Z"
|
||||
fill="#969696"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
|
@ -25,9 +25,16 @@ import {
|
|||
DiscordIcon,
|
||||
HeartFilledIcon,
|
||||
SearchIcon,
|
||||
ChevronDownIcon,
|
||||
FbIcon,
|
||||
IgIcon,
|
||||
YtIcon,
|
||||
TwIcon,
|
||||
TtIcon,
|
||||
} from "@/components/icons";
|
||||
|
||||
import { Logo } from "@/components/icons";
|
||||
import { Image } from "@nextui-org/react";
|
||||
|
||||
export const Navbar = () => {
|
||||
const searchInput = (
|
||||
|
|
@ -52,93 +59,59 @@ export const Navbar = () => {
|
|||
);
|
||||
|
||||
return (
|
||||
<NextUINavbar maxWidth="xl" position="sticky">
|
||||
<NavbarContent className="basis-1/5 sm:basis-full" justify="start">
|
||||
<NavbarBrand as="li" className="gap-3 max-w-fit">
|
||||
<NextLink className="flex justify-start items-center gap-1" href="/">
|
||||
<Logo />
|
||||
<p className="font-bold text-inherit">ACME</p>
|
||||
</NextLink>
|
||||
</NavbarBrand>
|
||||
<ul className="hidden lg:flex gap-4 justify-start ml-2">
|
||||
{siteConfig.navItems.map((item) => (
|
||||
<NavbarItem key={item.href}>
|
||||
<NextLink
|
||||
className={clsx(
|
||||
linkStyles({ color: "foreground" }),
|
||||
"data-[active=true]:text-primary data-[active=true]:font-medium"
|
||||
)}
|
||||
color="foreground"
|
||||
href={item.href}
|
||||
>
|
||||
{item.label}
|
||||
</NextLink>
|
||||
</NavbarItem>
|
||||
))}
|
||||
</ul>
|
||||
</NavbarContent>
|
||||
|
||||
<NavbarContent
|
||||
className="hidden sm:flex basis-1/5 sm:basis-full"
|
||||
justify="end"
|
||||
>
|
||||
<NavbarItem className="hidden sm:flex gap-2">
|
||||
<Link isExternal href={siteConfig.links.twitter} aria-label="Twitter">
|
||||
<TwitterIcon className="text-default-500" />
|
||||
<NextUINavbar className="h-36 w-full lg:w-full"
|
||||
classNames={{
|
||||
wrapper: "w-full max-w-full h-[90%]",
|
||||
}}>
|
||||
<NavbarBrand className="max-w-fit">
|
||||
<Image
|
||||
src="/logohumas.png"
|
||||
/>
|
||||
</NavbarBrand>
|
||||
<NavbarContent className="hidden sm:flex gap-12 basis-2/3 " justify="center">
|
||||
<NavbarItem>
|
||||
<Link color="foreground" href="#">
|
||||
<p className="mr-1 font-semibold">Pelayanan Masyarakat</p>
|
||||
<ChevronDownIcon />
|
||||
</Link>
|
||||
<Link isExternal href={siteConfig.links.discord} aria-label="Discord">
|
||||
<DiscordIcon className="text-default-500" />
|
||||
</NavbarItem>
|
||||
<NavbarItem >
|
||||
<Link href="#" color="foreground">
|
||||
<p className="mr-1 font-semibold">Portal PPID</p>
|
||||
</Link>
|
||||
<Link isExternal href={siteConfig.links.github} aria-label="Github">
|
||||
<GithubIcon className="text-default-500" />
|
||||
</NavbarItem>
|
||||
<NavbarItem>
|
||||
<Link color="foreground" href="#">
|
||||
<p className="mr-1 font-semibold">Publikasi</p>
|
||||
<ChevronDownIcon />
|
||||
</Link>
|
||||
</NavbarItem>
|
||||
<NavbarItem>
|
||||
<Link color="foreground" href="#">
|
||||
<p className="mr-1 font-semibold">Tentang</p>
|
||||
<ChevronDownIcon />
|
||||
</Link>
|
||||
</NavbarItem>
|
||||
<NavbarItem>
|
||||
<Link color="foreground" href="#">
|
||||
<p className="mr-1 font-semibold">Aplikasi Terkait</p>
|
||||
<ChevronDownIcon />
|
||||
</Link>
|
||||
</NavbarItem>
|
||||
<NavbarItem>
|
||||
<ThemeSwitch />
|
||||
</NavbarItem>
|
||||
<NavbarItem className="hidden lg:flex">{searchInput}</NavbarItem>
|
||||
<NavbarItem className="hidden md:flex">
|
||||
<Button
|
||||
isExternal
|
||||
as={Link}
|
||||
className="text-sm font-normal text-default-600 bg-default-100"
|
||||
href={siteConfig.links.sponsor}
|
||||
startContent={<HeartFilledIcon className="text-danger" />}
|
||||
variant="flat"
|
||||
>
|
||||
Sponsor
|
||||
</Button>
|
||||
</NavbarItem>
|
||||
</NavbarContent>
|
||||
|
||||
<NavbarContent className="sm:hidden basis-1 pl-4" justify="end">
|
||||
<Link isExternal href={siteConfig.links.github} aria-label="Github">
|
||||
<GithubIcon className="text-default-500" />
|
||||
</Link>
|
||||
<ThemeSwitch />
|
||||
<NavbarMenuToggle />
|
||||
</NavbarContent>
|
||||
|
||||
<NavbarMenu>
|
||||
{searchInput}
|
||||
<div className="mx-4 mt-2 flex flex-col gap-2">
|
||||
{siteConfig.navMenuItems.map((item, index) => (
|
||||
<NavbarMenuItem key={`${item}-${index}`}>
|
||||
<Link
|
||||
color={
|
||||
index === 2
|
||||
? "primary"
|
||||
: index === siteConfig.navMenuItems.length - 1
|
||||
? "danger"
|
||||
: "foreground"
|
||||
}
|
||||
href="#"
|
||||
size="lg"
|
||||
>
|
||||
{item.label}
|
||||
</Link>
|
||||
</NavbarMenuItem>
|
||||
))}
|
||||
<NavbarContent className="flex flex-col items-center ">
|
||||
<div className="flex gap-3">
|
||||
<div><FbIcon /></div>
|
||||
<div><IgIcon /></div>
|
||||
<div><YtIcon /></div>
|
||||
<div><TwIcon /></div>
|
||||
<div><TtIcon /></div>
|
||||
</div>
|
||||
</NavbarMenu>
|
||||
<div className="font-bold">{searchInput}</div>
|
||||
</NavbarContent>
|
||||
</NextUINavbar>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { FC } from "react";
|
|||
import { VisuallyHidden } from "@react-aria/visually-hidden";
|
||||
import { SwitchProps, useSwitch } from "@nextui-org/switch";
|
||||
import { useTheme } from "next-themes";
|
||||
import {useIsSSR} from "@react-aria/ssr";
|
||||
import { useIsSSR } from "@react-aria/ssr";
|
||||
import clsx from "clsx";
|
||||
|
||||
import { SunFilledIcon, MoonFilledIcon } from "@/components/icons";
|
||||
|
|
@ -19,7 +19,7 @@ export const ThemeSwitch: FC<ThemeSwitchProps> = ({
|
|||
classNames,
|
||||
}) => {
|
||||
const { theme, setTheme } = useTheme();
|
||||
const isSSR = useIsSSR();
|
||||
const isSSR = useIsSSR();
|
||||
|
||||
const onChange = () => {
|
||||
theme === "light" ? setTheme("dark") : setTheme("light");
|
||||
|
|
@ -34,7 +34,7 @@ export const ThemeSwitch: FC<ThemeSwitchProps> = ({
|
|||
getWrapperProps,
|
||||
} = useSwitch({
|
||||
isSelected: theme === "light" || isSSR,
|
||||
"aria-label": `Switch to ${theme === "light" || isSSR ? "dark" : "light"} mode`,
|
||||
"aria-label": `Switch to ${theme === "light" || isSSR ? "dark" : "light"} mode`,
|
||||
onChange,
|
||||
});
|
||||
|
||||
|
|
@ -70,7 +70,7 @@ export const ThemeSwitch: FC<ThemeSwitchProps> = ({
|
|||
),
|
||||
})}
|
||||
>
|
||||
{!isSelected || isSSR ? <SunFilledIcon size={22} /> : <MoonFilledIcon size={22} />}
|
||||
{!isSelected || isSSR ? <SunFilledIcon size={22} /> : <MoonFilledIcon size={22} />}
|
||||
</div>
|
||||
</Component>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { Fira_Code as FontMono, Inter as FontSans } from "next/font/google"
|
||||
import { DM_Sans, Fira_Code as FontMono, Inter as FontSans } from "next/font/google"
|
||||
|
||||
export const fontSans = FontSans({
|
||||
subsets: ["latin"],
|
||||
|
|
@ -9,3 +9,8 @@ export const fontMono = FontMono({
|
|||
subsets: ["latin"],
|
||||
variable: "--font-mono",
|
||||
})
|
||||
|
||||
export const dmSans = DM_Sans({
|
||||
subsets: ["latin"],
|
||||
variable: "--font-dm-sans",
|
||||
});
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -15,6 +15,7 @@
|
|||
"@nextui-org/kbd": "2.0.25",
|
||||
"@nextui-org/link": "2.0.26",
|
||||
"@nextui-org/navbar": "2.0.27",
|
||||
"@nextui-org/react": "^2.2.9",
|
||||
"@nextui-org/snippet": "2.0.30",
|
||||
"@nextui-org/switch": "2.0.25",
|
||||
"@nextui-org/system": "2.0.15",
|
||||
|
|
@ -28,7 +29,7 @@
|
|||
"clsx": "^2.0.0",
|
||||
"eslint": "8.48.0",
|
||||
"eslint-config-next": "14.0.2",
|
||||
"framer-motion": "^10.16.4",
|
||||
"framer-motion": "^10.18.0",
|
||||
"intl-messageformat": "^10.5.0",
|
||||
"next": "14.0.2",
|
||||
"next-themes": "^0.2.1",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,11 @@
|
|||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white"/>
|
||||
<g clip-path="url(#clip0_179_4)">
|
||||
<path d="M21.6272 6.90002H8.37263C7.55895 6.90002 6.8999 7.55907 6.8999 8.37275V21.6273C6.8999 22.441 7.55895 23.1001 8.37263 23.1001H15.7363V16.4727H13.5272V14.2637H15.7363V13.0774C15.7363 10.8315 16.8305 9.84548 18.6972 9.84548C19.5911 9.84548 20.0639 9.91175 20.2877 9.94194V12.0546H19.0145C18.2222 12.0546 17.9453 12.4728 17.9453 13.3196V14.2637H20.2679L19.9527 16.4727H17.9453V23.1001H21.6272C22.4408 23.1001 23.0999 22.441 23.0999 21.6273V8.37275C23.0999 7.55907 22.4401 6.90002 21.6272 6.90002Z" fill="#3B5998"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_179_4">
|
||||
<rect width="18" height="18" fill="white" transform="translate(6 6)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 839 B |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 770 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 874 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 902 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 361 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.5 5.5L12.5 10.5L7.5 15.5" stroke="white" stroke-width="2"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 175 B |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.5 15.5L7.5 10.5L12.5 5.5" stroke="white" stroke-width="2"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 176 B |
Binary file not shown.
|
After Width: | Height: | Size: 215 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6.99992 5.25C6.53579 5.25 6.09067 5.43437 5.76248 5.76256C5.43429 6.09075 5.24992 6.53587 5.24992 7C5.24992 7.46413 5.43429 7.90925 5.76248 8.23744C6.09067 8.56563 6.53579 8.75 6.99992 8.75C7.46405 8.75 7.90917 8.56563 8.23736 8.23744C8.56554 7.90925 8.74992 7.46413 8.74992 7C8.74992 6.53587 8.56554 6.09075 8.23736 5.76256C7.90917 5.43437 7.46405 5.25 6.99992 5.25ZM6.99992 9.91667C6.22637 9.91667 5.4845 9.60938 4.93752 9.06239C4.39054 8.51541 4.08325 7.77355 4.08325 7C4.08325 6.22645 4.39054 5.48459 4.93752 4.93761C5.4845 4.39062 6.22637 4.08333 6.99992 4.08333C7.77347 4.08333 8.51533 4.39062 9.06231 4.93761C9.60929 5.48459 9.91658 6.22645 9.91658 7C9.91658 7.77355 9.60929 8.51541 9.06231 9.06239C8.51533 9.60938 7.77347 9.91667 6.99992 9.91667ZM6.99992 2.625C4.08325 2.625 1.59242 4.43917 0.583252 7C1.59242 9.56083 4.08325 11.375 6.99992 11.375C9.91658 11.375 12.4074 9.56083 13.4166 7C12.4074 4.43917 9.91658 2.625 6.99992 2.625Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 685 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 902 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16.5455 2H3.45455C2.65091 2 2 2.65091 2 3.45454V16.5454C2 17.3491 2.65091 18 3.45455 18H10.7273V11.4545H8.54546V9.27271H10.7273V8.10108C10.7273 5.8829 11.808 4.90909 13.6516 4.90909C14.5346 4.90909 15.0015 4.97454 15.2226 5.00436V7.0909H13.9651C13.1826 7.0909 12.9091 7.50399 12.9091 8.34035V9.27271H15.2029L14.8916 11.4545H12.9091V18H16.5455C17.3491 18 18 17.3491 18 16.5454V3.45454C18 2.65091 17.3484 2 16.5455 2Z" fill="#3B5998"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 547 B |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.0039 5.50781C7.51953 5.50781 5.51562 7.51172 5.51562 9.99609C5.51562 12.4805 7.51953 14.4844 10.0039 14.4844C12.4883 14.4844 14.4922 12.4805 14.4922 9.99609C14.4922 7.51172 12.4883 5.50781 10.0039 5.50781ZM10.0039 12.9141C8.39844 12.9141 7.08594 11.6055 7.08594 9.99609C7.08594 8.38672 8.39453 7.07812 10.0039 7.07812C11.6133 7.07812 12.9219 8.38672 12.9219 9.99609C12.9219 11.6055 11.6094 12.9141 10.0039 12.9141ZM15.7227 5.32422C15.7227 5.90625 15.2539 6.37109 14.6758 6.37109C14.0938 6.37109 13.6289 5.90234 13.6289 5.32422C13.6289 4.74609 14.0977 4.27734 14.6758 4.27734C15.2539 4.27734 15.7227 4.74609 15.7227 5.32422ZM18.6953 6.38672C18.6289 4.98438 18.3086 3.74219 17.2812 2.71875C16.2578 1.69531 15.0156 1.375 13.6133 1.30469C12.168 1.22266 7.83594 1.22266 6.39062 1.30469C4.99219 1.37109 3.75 1.69141 2.72266 2.71484C1.69531 3.73828 1.37891 4.98047 1.30859 6.38281C1.22656 7.82812 1.22656 12.1602 1.30859 13.6055C1.375 15.0078 1.69531 16.25 2.72266 17.2734C3.75 18.2969 4.98828 18.6172 6.39062 18.6875C7.83594 18.7695 12.168 18.7695 13.6133 18.6875C15.0156 18.6211 16.2578 18.3008 17.2812 17.2734C18.3047 16.25 18.625 15.0078 18.6953 13.6055C18.7773 12.1602 18.7773 7.83203 18.6953 6.38672ZM16.8281 15.1562C16.5234 15.9219 15.9336 16.5117 15.1641 16.8203C14.0117 17.2773 11.2773 17.1719 10.0039 17.1719C8.73047 17.1719 5.99219 17.2734 4.84375 16.8203C4.07812 16.5156 3.48828 15.9258 3.17969 15.1562C2.72266 14.0039 2.82813 11.2695 2.82813 9.99609C2.82813 8.72266 2.72656 5.98438 3.17969 4.83594C3.48438 4.07031 4.07422 3.48047 4.84375 3.17187C5.99609 2.71484 8.73047 2.82031 10.0039 2.82031C11.2773 2.82031 14.0156 2.71875 15.1641 3.17187C15.9297 3.47656 16.5195 4.06641 16.8281 4.83594C17.2852 5.98828 17.1797 8.72266 17.1797 9.99609C17.1797 11.2695 17.2852 14.0078 16.8281 15.1562Z" fill="#C922D8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11.9998 2.66663L8.6665 7.11129M8.6665 7.11129L5.53317 2.93329C5.47107 2.8505 5.39055 2.78329 5.29798 2.73701C5.20541 2.69072 5.10333 2.66663 4.99984 2.66663H2.6665L7.33317 8.88863M8.6665 7.11129L13.3332 13.3333H10.9998C10.8963 13.3333 10.7943 13.3092 10.7017 13.2629C10.6091 13.2166 10.5286 13.1494 10.4665 13.0666L7.33317 8.88863M3.99984 13.3333L7.33317 8.88863" stroke="#1F1A17" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 566 B |
|
|
@ -0,0 +1,11 @@
|
|||
<svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_214_56)">
|
||||
<path d="M28.4444 3.33331H3.55556C2.61256 3.33331 1.70819 3.61426 1.0414 4.11436C0.374602 4.61446 0 5.29274 0 5.99998L0 12H32V5.99998C32 5.29274 31.6254 4.61446 30.9586 4.11436C30.2918 3.61426 29.3874 3.33331 28.4444 3.33331Z" fill="#DC1F26"/>
|
||||
<path d="M32 18C32 18.7072 31.6254 19.3855 30.9586 19.8856C30.2918 20.3857 29.3874 20.6667 28.4444 20.6667H3.55556C2.61256 20.6667 1.70819 20.3857 1.0414 19.8856C0.374602 19.3855 0 18.7072 0 18V12H32V18Z" fill="#EEEEEE"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_214_56">
|
||||
<rect width="32" height="24" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 709 B |
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white"/>
|
||||
<path d="M15.0037 10.957C12.7678 10.957 10.9643 12.7605 10.9643 14.9965C10.9643 17.2324 12.7678 19.0359 15.0037 19.0359C17.2396 19.0359 19.0432 17.2324 19.0432 14.9965C19.0432 12.7605 17.2396 10.957 15.0037 10.957ZM15.0037 17.6226C13.5588 17.6226 12.3775 16.4449 12.3775 14.9965C12.3775 13.548 13.5553 12.3703 15.0037 12.3703C16.4521 12.3703 17.6299 13.548 17.6299 14.9965C17.6299 16.4449 16.4486 17.6226 15.0037 17.6226ZM20.1506 10.7918C20.1506 11.3156 19.7287 11.734 19.2084 11.734C18.6846 11.734 18.2662 11.3121 18.2662 10.7918C18.2662 10.2715 18.6881 9.8496 19.2084 9.8496C19.7287 9.8496 20.1506 10.2715 20.1506 10.7918ZM22.826 11.748C22.7662 10.4859 22.4779 9.36796 21.5533 8.44686C20.6322 7.52577 19.5143 7.23749 18.2521 7.17421C16.9514 7.10038 13.0525 7.10038 11.7518 7.17421C10.4932 7.23397 9.3752 7.52225 8.45059 8.44335C7.52598 9.36444 7.24121 10.4824 7.17793 11.7445C7.1041 13.0453 7.1041 16.9441 7.17793 18.2449C7.2377 19.507 7.52598 20.625 8.45059 21.5461C9.3752 22.4672 10.4896 22.7555 11.7518 22.8187C13.0525 22.8926 16.9514 22.8926 18.2521 22.8187C19.5143 22.759 20.6322 22.4707 21.5533 21.5461C22.4744 20.625 22.7627 19.507 22.826 18.2449C22.8998 16.9441 22.8998 13.0488 22.826 11.748ZM21.1455 19.6406C20.8713 20.3297 20.3404 20.8605 19.6479 21.1383C18.6107 21.5496 16.1498 21.4547 15.0037 21.4547C13.8576 21.4547 11.3932 21.5461 10.3596 21.1383C9.67051 20.864 9.13965 20.3332 8.86191 19.6406C8.45059 18.6035 8.54551 16.1426 8.54551 14.9965C8.54551 13.8504 8.4541 11.3859 8.86191 10.3523C9.13613 9.66327 9.66699 9.13241 10.3596 8.85468C11.3967 8.44335 13.8576 8.53827 15.0037 8.53827C16.1498 8.53827 18.6143 8.44686 19.6479 8.85468C20.3369 9.12889 20.8678 9.65975 21.1455 10.3523C21.5568 11.3894 21.4619 13.8504 21.4619 14.9965C21.4619 16.1426 21.5568 18.607 21.1455 19.6406Z" fill="#C922D8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M15.3334 8.5L13.7067 6.64L13.9334 4.18L11.5267 3.63333L10.2667 1.5L8.00008 2.47333L5.73342 1.5L4.47341 3.62667L2.06675 4.16667L2.29341 6.63333L0.666748 8.5L2.29341 10.36L2.06675 12.8267L4.47341 13.3733L5.73342 15.5L8.00008 14.52L10.2667 15.4933L11.5267 13.3667L13.9334 12.82L13.7067 10.36L15.3334 8.5ZM6.72675 11.6467L4.19341 9.10667L5.18008 8.12L6.72675 9.67333L10.6267 5.76L11.6134 6.74667L6.72675 11.6467Z" fill="#2F80ED"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 539 B |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.1 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 5.9 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 6.5 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 33 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.4 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M13.3334 7.99992L9.06675 3.33325V5.66659C6.93341 5.66659 2.66675 7.06659 2.66675 12.6666C2.66675 11.8886 3.94675 10.3333 9.06675 10.3333V12.6666L13.3334 7.99992Z" fill="#2F80ED" stroke="#2F80ED" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 379 B |
|
|
@ -0,0 +1,11 @@
|
|||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white"/>
|
||||
<g clip-path="url(#clip0_214_17)">
|
||||
<path d="M22.8748 13.3796C21.3271 13.3834 19.8173 12.9007 18.5587 11.9998V18.2829C18.5583 19.4466 18.2026 20.5824 17.5392 21.5385C16.8758 22.4946 15.9363 23.2254 14.8464 23.6332C13.7565 24.0409 12.568 24.1062 11.44 23.8203C10.312 23.5344 9.29811 22.9109 8.53398 22.0332C7.76986 21.1555 7.2919 20.0655 7.16401 18.9088C7.03613 17.7522 7.2644 16.584 7.81833 15.5606C8.37225 14.5372 9.22541 13.7073 10.2637 13.1818C11.3021 12.6564 12.4761 12.4605 13.6287 12.6203V15.7805C13.1013 15.6146 12.5349 15.6196 12.0104 15.7947C11.4859 15.9699 11.0303 16.3064 10.7084 16.756C10.3866 17.2056 10.215 17.7455 10.2183 18.2984C10.2215 18.8513 10.3994 19.3891 10.7265 19.8349C11.0537 20.2807 11.5133 20.6118 12.0398 20.7808C12.5663 20.9498 13.1327 20.9481 13.6582 20.776C14.1836 20.6039 14.6413 20.2701 14.9658 19.8224C15.2903 19.3747 15.465 18.8358 15.4649 18.2829V6H18.5587C18.5565 6.26126 18.5784 6.52216 18.6241 6.77941C18.7316 7.35368 18.9551 7.89999 19.281 8.38491C19.6069 8.86983 20.0283 9.28317 20.5194 9.59965C21.2181 10.0616 22.0372 10.3079 22.8748 10.3077V13.3796Z" fill="black"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_214_17">
|
||||
<rect width="18" height="18" fill="white" transform="translate(6 6)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white"/>
|
||||
<path d="M22.1497 11.3338C22.1612 11.4936 22.1612 11.6536 22.1612 11.8135C22.1612 16.6903 18.4493 22.3096 11.665 22.3096C9.57486 22.3096 7.63325 21.7043 6 20.6536C6.29696 20.6878 6.58247 20.6992 6.89086 20.6992C8.61545 20.6992 10.203 20.1168 11.4708 19.1231C9.84898 19.0888 8.48984 18.0267 8.02155 16.5647C8.25 16.599 8.47841 16.6218 8.71828 16.6218C9.04949 16.6218 9.38073 16.5761 9.68909 16.4962C7.99874 16.1535 6.73093 14.6688 6.73093 12.8756V12.83C7.22203 13.1041 7.79314 13.2754 8.39843 13.2982C7.40477 12.6358 6.75379 11.5051 6.75379 10.2259C6.75379 9.54061 6.93649 8.91244 7.25631 8.36421C9.0723 10.6028 11.802 12.0647 14.8629 12.2246C14.8058 11.9505 14.7715 11.665 14.7715 11.3795C14.7715 9.34644 16.4162 7.69037 18.4606 7.69037C19.5228 7.69037 20.4822 8.1358 21.156 8.85534C21.9898 8.69545 22.7893 8.38706 23.4974 7.96448C23.2233 8.8211 22.6408 9.54064 21.8756 9.99746C22.618 9.91755 23.3375 9.71192 23.9999 9.42642C23.4975 10.1574 22.8693 10.8083 22.1497 11.3338Z" fill="#1DA1F2"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -0,0 +1,11 @@
|
|||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="30" height="30" rx="8" fill="white"/>
|
||||
<g clip-path="url(#clip0_214_10)">
|
||||
<path d="M23.1769 10.8776C22.9806 10.1385 22.4023 9.55647 21.668 9.35894C20.337 9 15.0001 9 15.0001 9C15.0001 9 9.66327 9 8.3323 9.35894C7.59802 9.5565 7.0197 10.1385 6.82342 10.8776C6.4668 12.2172 6.4668 15.0121 6.4668 15.0121C6.4668 15.0121 6.4668 17.8071 6.82342 19.1467C7.0197 19.8857 7.59802 20.4435 8.3323 20.6411C9.66327 21 15.0001 21 15.0001 21C15.0001 21 20.337 21 21.668 20.6411C22.4023 20.4435 22.9806 19.8857 23.1769 19.1467C23.5335 17.8071 23.5335 15.0121 23.5335 15.0121C23.5335 15.0121 23.5335 12.2172 23.1769 10.8776ZM13.2547 17.5497V12.4745L17.7153 15.0122L13.2547 17.5497Z" fill="#CD201F"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_214_10">
|
||||
<rect width="18" height="18" fill="white" transform="translate(6 6)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 930 B |
|
|
@ -1,3 +1,7 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
/* *{
|
||||
border: 1px solid green;
|
||||
} */
|
||||
Loading…
Reference in New Issue