update: landing
This commit is contained in:
amd123
parent
6a7095473f
commit
bb8192f952
|
|
@ -45,21 +45,26 @@ export default function RootLayout({
|
|||
<main className=" w-screen pt-2 flex-grow">
|
||||
{children}
|
||||
</main>
|
||||
<footer className="p-3 text-small md:text-base flex flex-col md:flex-row md:justify-center space-y-2 md:space-x-6 md:space-y-0 h-auto md:h-24 bg-[#1A328E] text-white items-center">
|
||||
<div>FAQ</div>
|
||||
<div>ABOUT</div>
|
||||
<div>TERM AND CONDITION</div>
|
||||
<div className="">
|
||||
<footer className="bg-[#1A328E] h-auto md:h-24 gap-2 md:gap-3 flex justify-evenly md:justify-center text-[10px] md:text-lg font-normal md:font-semibold items-center text-white">
|
||||
<div className="flex flex-col md:flex-row space-x-0 md:space-x-3">
|
||||
<div>FAQ</div>
|
||||
<div>ABOUT</div>
|
||||
<div>TERM AND CONDITION</div>
|
||||
</div>
|
||||
<div>
|
||||
<Image
|
||||
src="/paslon01.png"
|
||||
className="p-2 md:p-0"
|
||||
alt="logo"
|
||||
width={100}
|
||||
height={120}
|
||||
/>
|
||||
</div>
|
||||
<div>PRIVACY POLICY</div>
|
||||
<div>CONTACT US</div>
|
||||
<div>LAPOR KAMPANYE</div>
|
||||
<div className="flex flex-col md:flex-row space-x-0 md:space-x-3">
|
||||
<div>PRIVACY POLICY</div>
|
||||
<div>CONTACT US</div>
|
||||
<div>LAPOR KAMPANYE</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</Providers>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,18 @@
|
|||
'use client'
|
||||
import { Card, CardBody, CardFooter, Image, Tab, Tabs } from '@nextui-org/react'
|
||||
import Link from 'next/link';
|
||||
import React from 'react'
|
||||
import React, { useRef } from 'react'
|
||||
import { Swiper, SwiperSlide } from 'swiper/react';
|
||||
import "swiper/css";
|
||||
import "swiper/css/pagination";
|
||||
import "swiper/css/free-mode";
|
||||
import { FreeMode, Navigation } from 'swiper/modules';
|
||||
|
||||
export default function Headline() {
|
||||
|
||||
const sliderRef = useRef(null);
|
||||
|
||||
|
||||
const headlineData = [
|
||||
{
|
||||
id: 1,
|
||||
|
|
@ -48,18 +56,63 @@ export default function Headline() {
|
|||
<div className='space-y-5 pt-10 pb-10 bg-[#F1F4FE]'>
|
||||
<div className='lg:mx-16 space-y-4'>
|
||||
<div className='text-3xl font-bold z-10 text-black'>Headline News</div>
|
||||
<div>
|
||||
<div className="flex w-full flex-col">
|
||||
<Tabs
|
||||
aria-label="Options"
|
||||
size='lg'
|
||||
color='primary'
|
||||
className='pb-5 pt-4'
|
||||
radius='full'
|
||||
disabledKeys={["audio", "foto", "teks"]}
|
||||
>
|
||||
<Tab key="audiovisual" title="Audio Visual">
|
||||
<div className="gap-2 grid grid-cols-2 sm:grid-cols-5">
|
||||
<div className="flex w-full flex-col">
|
||||
<Tabs
|
||||
aria-label="Options"
|
||||
size='lg'
|
||||
color='primary'
|
||||
className='pb-5 pt-4'
|
||||
radius='full'
|
||||
disabledKeys={["audio", "foto", "teks"]}
|
||||
>
|
||||
<Tab key="audiovisual" title="Audio Visual">
|
||||
<Swiper ref={sliderRef}
|
||||
breakpoints={{
|
||||
450: {
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 5,
|
||||
},
|
||||
700: {
|
||||
slidesPerView: 2,
|
||||
spaceBetween: 15,
|
||||
},
|
||||
900: {
|
||||
slidesPerView: 4,
|
||||
spaceBetween: 15,
|
||||
},
|
||||
}}
|
||||
freeMode={true}
|
||||
navigation={true}
|
||||
modules={[FreeMode, Navigation]}
|
||||
className="max-w-[90%] w-4/5 lg:w-full ml-2 mr-2"
|
||||
>
|
||||
{headlineData.map((item) => (
|
||||
<SwiperSlide key={item.title}>
|
||||
<div className="flex flex-col relative overflow-hidden cursor-pointer rounded-lg">
|
||||
<Card>
|
||||
<CardBody className="overflow-visible items-center">
|
||||
<Image
|
||||
shadow="sm"
|
||||
radius="lg"
|
||||
alt={item.title}
|
||||
className="w-full object-cover"
|
||||
src={item.imageUrl}
|
||||
/>
|
||||
</CardBody>
|
||||
<CardFooter className="text-small text-left flex flex-col items-start">
|
||||
<div >{item.date}</div>
|
||||
<div className='font-bold'>{item.title}</div>
|
||||
<Link href={`/headline/detail/${item.id}`}>
|
||||
<p className='font-semibold text-[#1A328E]'>Lihat Selengkapnya</p>
|
||||
</Link>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
))}
|
||||
</Swiper>
|
||||
|
||||
{/* <div className="gap-2 grid grid-cols-2 sm:grid-cols-5">
|
||||
{headlineData.map((item, index) => (
|
||||
<Card shadow="sm" key={index}>
|
||||
<CardBody className="overflow-visible p-0">
|
||||
|
|
@ -81,262 +134,261 @@ export default function Headline() {
|
|||
</CardFooter>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="audio" title="Audio">
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className=' font-semibold text-[#1A328E] cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="foto" title="Foto">
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="teks" title="Teks">
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</div>
|
||||
</div> */}
|
||||
</Tab>
|
||||
<Tab key="audio" title="Audio">
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className=' font-semibold text-[#1A328E] cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="foto" title="Foto">
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</Tab>
|
||||
<Tab key="teks" title="Teks">
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className='max-h-max w-[250px] items-center rounded-lg'>
|
||||
<CardBody>
|
||||
<Image
|
||||
alt='visimisi'
|
||||
className='rounded-lg'
|
||||
src="/vm1.jpg"
|
||||
height={150}
|
||||
width={220}
|
||||
/>
|
||||
</CardBody>
|
||||
<div className='px-3 pb-2'>
|
||||
<p className='text-xs '>03/01/2024 14:30 WIB</p>
|
||||
<p className='leading-tight text-sm font-semibold'>MNC Penyelenggara Debat Capres, Timnas AMIN: Kita Tahu Ownernya Pendukung 03</p>
|
||||
<p className='text-xs text-blue-800 cursor-pointer'>Lihat Selengkanya</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</div>
|
||||
</div>
|
||||
</div >
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import Image from "next/image";
|
|||
import { useCallback, useRef } from "react";
|
||||
|
||||
export default function VisiMisi() {
|
||||
|
||||
|
||||
const sliderRef = useRef(null);
|
||||
|
||||
const images = [
|
||||
|
|
@ -126,7 +126,7 @@ export default function VisiMisi() {
|
|||
className="absolute inset-0 bg-cover bg-center"
|
||||
style={{ backgroundImage: `url(${item.url})` }}
|
||||
/> */}
|
||||
<Image
|
||||
<Image
|
||||
alt="vm"
|
||||
className="object-cover"
|
||||
src={item.url}
|
||||
|
|
@ -145,9 +145,11 @@ export default function VisiMisi() {
|
|||
))}
|
||||
</Swiper>
|
||||
</div>
|
||||
<div className="swiper-navigation flex flex-wrap justify-center z-50 mt-[-50px] absolute left-0 lg:left-[28%] right-0 m-auto">
|
||||
<div className="prev-arrow mr-3 border-1 border-indigo-500/75 rounded-md px-3" onClick={handlePrev} role="button">Prev</div>
|
||||
<div className="next-arrow border-1 border-indigo-500/75 rounded-md px-3" onClick={handleNext} role="button">Next</div>
|
||||
<div className="swiper-navigation flex flex-wrap justify-center space-x-4 z-50 mt-[-50px] absolute left-0 lg:left-[28%] right-0 m-auto">
|
||||
{/* <div className="prev-arrow mr-3 border-1 border-indigo-500/75 rounded-md px-3" onClick={handlePrev} role="button">Prev</div> */}
|
||||
{/* <div className=" border-1 border-indigo-500/75 px-3 rounded-full" onClick={handleNext} role="button">→</div> */}
|
||||
<button><img src="al.svg" alt="al" onClick={handlePrev} /></button>
|
||||
<button><img src="ar.svg" alt="ar" onClick={handleNext} /></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@ import NextLink from "next/link";
|
|||
import {
|
||||
SearchIcon
|
||||
} from "@/components/icons";
|
||||
import { ThemeSwitch } from "@/components/theme-switch";
|
||||
|
||||
import Image from "next/image";
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M28 14C28 11.2311 27.1789 8.52431 25.6406 6.22202C24.1022 3.91973 21.9157 2.12531 19.3576 1.06569C16.7994 0.00605965 13.9845 -0.271187 11.2687 0.269007C8.553 0.8092 6.05844 2.14257 4.10051 4.10051C2.14257 6.05844 0.8092 8.553 0.269007 11.2687C-0.271187 13.9845 0.00605965 16.7994 1.06569 19.3576C2.12531 21.9157 3.91973 24.1022 6.22202 25.6406C8.52431 27.1789 11.2311 28 14 28C17.713 28 21.274 26.525 23.8995 23.8995C26.525 21.274 28 17.713 28 14ZM22 15L9.85 15L15.43 20.607L14 22L6 14L14 6L15.43 7.427L9.85 13L22 13V15Z" fill="#007748"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 651 B |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0 14C0 16.7689 0.821086 19.4757 2.35943 21.778C3.89777 24.0803 6.08427 25.8747 8.64243 26.9343C11.2006 27.9939 14.0155 28.2712 16.7313 27.731C19.447 27.1908 21.9416 25.8574 23.8995 23.8995C25.8574 21.9416 27.1908 19.447 27.731 16.7313C28.2712 14.0155 27.9939 11.2006 26.9343 8.64243C25.8747 6.08427 24.0803 3.89777 21.778 2.35943C19.4757 0.821086 16.7689 0 14 0C10.287 0 6.72601 1.475 4.1005 4.1005C1.475 6.72601 0 10.287 0 14ZM6 13H18.15L12.57 7.393L14 6L22 14L14 22L12.57 20.573L18.15 15H6V13Z" fill="#007748"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 627 B |
Loading…
Reference in New Issue