update: web-humas

This commit is contained in:
amd123 2024-01-31 17:09:59 +07:00
parent fbd5eb7e20
commit 6027fa8484
40 changed files with 1006 additions and 47 deletions

View File

@ -49,7 +49,7 @@ export default function RootLayout({
src="/headerbannerpng.png" src="/headerbannerpng.png"
className=" w-full" className=" w-full"
/> />
<main className="pt-8 px-2 md:px-6 flex-grow"> <main className="pt-8 px-2 md:px-4 lg:px-6 flex-grow">
{children} {children}
</main> </main>
<Footer /> <Footer />

View File

@ -8,13 +8,13 @@ import SidebarNav from './SidebarNav'
export default function BodyLayout() { export default function BodyLayout() {
return ( return (
<div className='md:flex bg-white text-black mt-8 pb-8'> <div className='md:flex bg-white text-black mt-8 pb-8'>
<div className='w-auto md:w-[75%] space-y-5'> <div className='w-auto md:-w[65%] lg:w-[75%] space-y-5'>
<CategorySatker /> <CategorySatker />
<RegionalNews /> <RegionalNews />
<MediaSocial /> <MediaSocial />
<ENewsPolri /> <ENewsPolri />
</div> </div>
<div className='w-auto md:w-[25%]'> <div className='w-auto md:w-[35%] lg:w-[25%]'>
<SidebarNav /> <SidebarNav />
</div> </div>
</div> </div>

View File

@ -26,13 +26,13 @@ export default function CategorySatker() {
}, },
]; ];
return ( 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-center bg-[#DD8306] rounded-none md:rounded-lg h-auto lg:h-[338px] space-y-7 m-auto md:m-10 flex flex-col justify-center border-2 border-green-500'>
<div className='text-white font-bold text-2xl underline underline-offset-4 decoration-red-600'>Kategori Satker</div> <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 className='flex items-center justify-around'>
<div><ChevronLeftWhite /></div> <div><ChevronLeftWhite /></div>
<div className="gap-2 md:gap-4 grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5"> <div className="gap-2 md:gap-4 grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5">
{list.map((item, index) => ( {list.map((item, index) => (
<div className='w-[157px] h-[141px] flex flex-col items-center justify-evenly'> <div key={index} className='w-[157px] h-[141px] flex flex-col items-center justify-evenly'>
<Image <Image
radius="lg" radius="lg"
className="h-[59px]" className="h-[59px]"

View File

@ -22,11 +22,11 @@ export default function ENewsPolri() {
}, },
]; ];
return ( 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'> <div className='bg-[#1F1A17] text-center border-2 border-purple-500 rounded-none md:rounded-lg h-auto lg: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> <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'> <div className='flex flex-row w-full items-center justify-between'>
<ChevronLeftWhite /> <ChevronLeftWhite />
<div className='md:flex space-y-4 md:space-y-0 gap-4'> <div className='lg:flex space-y-4 lg:space-y-0 gap-4'>
{eNews.map((data) => ( {eNews.map((data) => (
<div key={data.id} className='h-auto md:h-[200px] w-[274px]'> <div key={data.id} className='h-auto md:h-[200px] w-[274px]'>
<Card className='text-white' <Card className='text-white'

View File

@ -5,8 +5,8 @@ import Image from 'next/image'
export default function HeaderNews() { export default function HeaderNews() {
return ( return (
<div className='md:flex items-center text-center bg-black dark:bg-white rounded-md gap-3 p-2'> <div className='lg: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'> <div className='w-auto lg:w-[25%] p-2 bg-[#020101] text-white rounded-md'>
<p className='text-lg font-bold h-10'>Berita Terkini</p> <p className='text-lg font-bold h-10'>Berita Terkini</p>
<ScrollShadow hideScrollBar className=" h-[343px]"> <ScrollShadow hideScrollBar className=" h-[343px]">
<div className='text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md'> <div className='text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md'>
@ -39,7 +39,7 @@ export default function HeaderNews() {
</Button> </Button>
</div> </div>
</div> </div>
<div className='w-auto md:w-[50%]'> <div className='w-auto lg:w-[50%]'>
<Card <Card
isFooterBlurred isFooterBlurred
radius="lg" radius="lg"
@ -62,7 +62,7 @@ export default function HeaderNews() {
</CardFooter> </CardFooter>
</Card> </Card>
</div> </div>
<div className='w-auto md:w-[25%] p-2 rounded-md text-white dark:text-black '> <div className='w-auto lg: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'> <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' /> <img src="/gprheader.png" alt="gpr" className='w-full' />
</div> </div>

View File

@ -73,7 +73,7 @@ export default function MediaSocial() {
</div> </div>
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div> <div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
</div> </div>
<div className='md:flex gap-4 justify-center'> <div className='md:flex flex-wrap gap-4 justify-center'>
{limitedData.map((data) => ( {limitedData.map((data) => (
<div <div
key={data.id} key={data.id}
@ -115,7 +115,7 @@ export default function MediaSocial() {
</div> </div>
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div> <div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
</div> </div>
<div className='md:flex gap-4 justify-center'> <div className='md:flex flex-wrap gap-4 justify-center'>
{limitedData.map((data) => ( {limitedData.map((data) => (
<div <div
key={data.id} key={data.id}
@ -157,7 +157,7 @@ export default function MediaSocial() {
</div> </div>
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div> <div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
</div> </div>
<div className='md:flex gap-4 justify-center'> <div className='md:flex flex-wrap gap-4 justify-center'>
{limitedData.map((data) => ( {limitedData.map((data) => (
<div <div
key={data.id} key={data.id}
@ -197,7 +197,7 @@ export default function MediaSocial() {
</div> </div>
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div> <div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
</div> </div>
<div className='md:flex gap-4 justify-center'> <div className='md:flex flex-wrap gap-4 justify-center'>
{limitedData.map((data) => ( {limitedData.map((data) => (
<div <div
key={data.id} key={data.id}
@ -237,7 +237,7 @@ export default function MediaSocial() {
</div> </div>
<div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div> <div className='text-xs text-[#DD8306] flex items-center'>Lihat Semua <ChevronRightIcon /></div>
</div> </div>
<div className='md:flex gap-4 justify-center'> <div className='md:flex flex-wrap gap-4 justify-center'>
{limitedData.map((data) => ( {limitedData.map((data) => (
<div <div
key={data.id} key={data.id}

View File

@ -55,33 +55,33 @@ export default function SidebarNav() {
</div> </div>
<div className='text-xl font-semibold underline underline-offset-4 decoration-red-600 pb-5'>Info Eksternal</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='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'> <div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto lg:w-[300px] p-4 shadow-md'>
<img src="/eksternal1.png" alt="" className='w-full' /> <img src="/eksternal1.png" alt="" className='w-full' />
<p className='leading-tight text-blue-500 pt-3'>Berita BPS</p> <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='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='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> <p className='text-xs text-gray-500 pt-1s'>Pengumuman terbaru dari Badan Pusat Statistika Indonesia</p>
</div> </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'> <div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto lg:w-[300px] p-4 shadow-md'>
<img src="/eksternal2.png" alt="" className='w-full' /> <img src="/eksternal2.png" alt="" className='w-full' />
<p className='leading-tight text-blue-500 pt-5'>Berita KPU</p> <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='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='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> <p className='text-xs text-gray-500 pt-1s'>Pengumuman terbaru dari Komisi Pemilihan Umum Indonesia</p>
</div> </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'> <div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto lg:w-[300px] p-4 shadow-md'>
<img src="/eksternal3.png" alt="" className='w-full' /> <img src="/eksternal3.png" alt="" className='w-full' />
<p className='leading-tight text-blue-500 pt-5'>Berita BAWASLU</p> <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='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='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> <p className='text-xs text-gray-500 pt-1s'>Pengumuman terbaru dari Badan Pusat Statistika Indonesia</p>
</div> </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'> <div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto lg:w-[300px] p-4 shadow-md'>
<img src="/eksternal4.png" alt="" className='w-full' /> <img src="/eksternal4.png" alt="" className='w-full' />
<p className='leading-tight text-blue-500 pt-5'>Info KPAI</p> <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> <p className='text-xs text-gray-500 pt-1'>Informasi dan Berita terbaru dari Komisi Perlindungan Anak Indonesia</p>
</div> </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'> <div className='bg-white text-black text-sm border-2 rounded-md m-5 md:m-0 w-auto lg:w-[300px] p-4 shadow-md'>
<img src="/eksternal5.png" alt="" className='w-full' /> <img src="/eksternal5.png" alt="" className='w-full' />
<p className='leading-tight text-blue-500 pt-5'>INFO KOMNAS PEREMPUAN</p> <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> <p className='text-xs text-gray-500 pt-1'>Info dan Berita terbaru dari Komnas Perempuan Indonesia</p>

File diff suppressed because it is too large Load Diff

BIN
public/at1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
public/at10.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

BIN
public/at11.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
public/at12.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
public/at13.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
public/at14.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
public/at15.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
public/at16.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
public/at17.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
public/at18.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
public/at19.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
public/at2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
public/at3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
public/at4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
public/at5.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
public/at6.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

BIN
public/at7.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
public/at8.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
public/at9.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
public/logo1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
public/pm10.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
public/pm11.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

BIN
public/pm12.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
public/pm2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 576 B

BIN
public/pm3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
public/pm4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
public/pm5.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
public/pm6.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
public/pm7.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
public/pm8.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
public/pm9.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
public/sp2h.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 794 B