feat: media online update
This commit is contained in:
amd123
parent
76cc75f449
commit
2267ffcba9
|
|
@ -2,6 +2,7 @@
|
|||
import CategorySatker from './CategorySatker'
|
||||
import ENewsPolri from './ENewsPolri'
|
||||
import MediaSocial from './MediaSocial'
|
||||
import MedolUpdate from './MedolUpdate'
|
||||
import RegionalNews from './RegionalNews'
|
||||
import SidebarNav from './SidebarNav'
|
||||
|
||||
|
|
@ -10,6 +11,7 @@ export default function BodyLayout() {
|
|||
<>
|
||||
<div className='md:flex bg-white text-black pt-10 pb-8 px-2 md:px-4 lg:px-8 gap-9'>
|
||||
<div className='w-auto md:w-[65%] lg:w-[75%] space-y-7'>
|
||||
<MedolUpdate />
|
||||
<CategorySatker />
|
||||
<RegionalNews />
|
||||
<MediaSocial />
|
||||
|
|
|
|||
|
|
@ -1,14 +1,8 @@
|
|||
import { useEffect, useState } from 'react';
|
||||
import { ChevronRightIcon, DotsIcon, FbIcon, IgIcon, TtIcon, TwitterIcon, YtIcon } from '../icons';
|
||||
import { ScrollShadow } from '@nextui-org/react';
|
||||
import { Tweet } from 'react-tweet';
|
||||
import Link from 'next/link';
|
||||
import YoutubePages from '../SocialMedia/Youtube';
|
||||
import YoutubeWidget from '../SocialMedia/Youtube';
|
||||
import InstagramWidget from '../SocialMedia/Instagram';
|
||||
import TiktokWidget from '../SocialMedia/Tiktok';
|
||||
import Facebookwidget from '../SocialMedia/Facebook';
|
||||
import InstagramWidget from '../SocialMedia/Instagram';
|
||||
import TwitterWidget from '../SocialMedia/Twitter';
|
||||
import { ChevronRightIcon, FbIcon, IgIcon, TtIcon, TwitterIcon, YtIcon } from '../icons';
|
||||
|
||||
export default function MediaSocial() {
|
||||
// const [limitedData, setLimitedData] = useState<any>([]);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,226 @@
|
|||
import { Button, Card, CardBody, CardFooter, Image, Tab, Tabs } from '@nextui-org/react';
|
||||
import React from 'react'
|
||||
|
||||
export default function MedolUpdate() {
|
||||
let tabs = [
|
||||
{
|
||||
id: "photos",
|
||||
label: "Photos",
|
||||
content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
|
||||
},
|
||||
{
|
||||
id: "music",
|
||||
label: "Music",
|
||||
content: "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."
|
||||
},
|
||||
{
|
||||
id: "videos",
|
||||
label: "Videos",
|
||||
content: "Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
|
||||
}
|
||||
];
|
||||
return (
|
||||
<div className='border-2 rounded-lg py-2'>
|
||||
<div className='text-2xl font-semibold underline underline-offset-4 text-center decoration-red-600 '>
|
||||
Media Online Update
|
||||
</div>
|
||||
<div className='bg-white text-black p-1 md:p-5 space-y-5'>
|
||||
<Tabs
|
||||
classNames={{
|
||||
tabList: "bg-white shadow-lg border",
|
||||
tabContent: 'group-data-[selected=true]:text-[white] text-warning'
|
||||
}}
|
||||
aria-label="Options" color='warning' className='flex justify-center'>
|
||||
<Tab key="mediahub" title="MediaHUB Update">
|
||||
<div className='flex gap-5 justify-center pt-3'>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="300%"
|
||||
alt="tes"
|
||||
className="object-cover h-[270px]"
|
||||
src='/temp/mediahub1.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:31 WITA</p>
|
||||
<b className=''>Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini Tambah Wawasan dan</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="100%"
|
||||
alt="tes"
|
||||
className="w-full object-cover h-[270px]"
|
||||
src='/temp/mediahub2.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:16 WIB</p>
|
||||
<b>Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</div>
|
||||
<div className='text-center pt-6'>
|
||||
<Button
|
||||
className='bg-white text-[#DD8306] font-bold w-56'
|
||||
size='sm'
|
||||
color='warning'
|
||||
variant='bordered'
|
||||
|
||||
>
|
||||
Lihat Lebih Banyak
|
||||
</Button>
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="tbnews" title="Tribrata News Update">
|
||||
<div className='flex gap-5 justify-center pt-3'>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="300%"
|
||||
alt="tes"
|
||||
className="object-cover h-[270px]"
|
||||
src='/temp/mediahub1.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:31 WITA</p>
|
||||
<b className=''>Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini Tambah Wawasan dan</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="100%"
|
||||
alt="tes"
|
||||
className="w-full object-cover h-[270px]"
|
||||
src='/temp/mediahub2.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:16 WIB</p>
|
||||
<b>Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</div>
|
||||
<div className='text-center pt-6'>
|
||||
<Button
|
||||
className='bg-white text-[#DD8306] font-bold w-56'
|
||||
size='sm'
|
||||
color='warning'
|
||||
variant='bordered'
|
||||
|
||||
>
|
||||
Lihat Lebih Banyak
|
||||
</Button>
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="inp" title="Indonesia Nasional Police Update">
|
||||
<div className='flex gap-5 justify-center pt-3'>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="300%"
|
||||
alt="tes"
|
||||
className="object-cover h-[270px]"
|
||||
src='/temp/mediahub1.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:31 WITA</p>
|
||||
<b className=''>Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini Tambah Wawasan dan</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="100%"
|
||||
alt="tes"
|
||||
className="w-full object-cover h-[270px]"
|
||||
src='/temp/mediahub2.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:16 WIB</p>
|
||||
<b>Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</div>
|
||||
<div className='text-center pt-6'>
|
||||
<Button
|
||||
className='bg-white text-[#DD8306] font-bold w-56'
|
||||
size='sm'
|
||||
color='warning'
|
||||
variant='bordered'
|
||||
|
||||
>
|
||||
Lihat Lebih Banyak
|
||||
</Button>
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="polritv" title="Polri TV Update">
|
||||
<div className='flex gap-5 justify-center pt-3'>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="300%"
|
||||
alt="tes"
|
||||
className="object-cover h-[270px]"
|
||||
src='/temp/mediahub1.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:31 WITA</p>
|
||||
<b className=''>Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini Tambah Wawasan dan</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
<Card shadow="sm" isPressable onPress={() => console.log("item pressed")} className='w-[45%] bg-white text-black'>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
width="100%"
|
||||
alt="tes"
|
||||
className="w-full object-cover h-[270px]"
|
||||
src='/temp/mediahub2.png'
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="flex flex-col items-start text-left">
|
||||
<p className='text-xs'>02-04-2024 09:16 WIB</p>
|
||||
<b>Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak</b>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</div>
|
||||
<div className='text-center pt-6'>
|
||||
<Button
|
||||
className='bg-white text-[#DD8306] font-bold w-56'
|
||||
size='sm'
|
||||
color='warning'
|
||||
variant='bordered'
|
||||
|
||||
>
|
||||
Lihat Lebih Banyak
|
||||
</Button>
|
||||
</div>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
'use client'
|
||||
import { Card, CardBody, Tab, Tabs } from '@nextui-org/react'
|
||||
import React from 'react'
|
||||
import { Tab, Tabs } from '@nextui-org/react'
|
||||
|
||||
export default function Task() {
|
||||
return (
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
Loading…
Reference in New Issue