style : update division new

This commit is contained in:
lukman
2024-07-11 14:06:45 +08:00
parent 22302c2d0a
commit e5282e90ba
15 changed files with 649 additions and 7 deletions

View File

@@ -0,0 +1,37 @@
'use client'
import React, { useRef } from 'react';
import { Carousel } from '@mantine/carousel';
import { WARNA } from '@/module/_global';
import Autoplay from 'embla-carousel-autoplay';
import { Flex, Text } from '@mantine/core';
export default function CarouselDivision() {
const autoplay = useRef(Autoplay({ delay: 5000 }));
return (
<>
<Carousel
withIndicators
height={150}
plugins={[autoplay.current]}
onMouseEnter={autoplay.current.stop}
onMouseLeave={autoplay.current.reset}
>
<Carousel.Slide bg={WARNA.biruTua} style={{ borderRadius: 10 }}>
<Flex justify={'center'} h={"100%"} align={'center'}>
<Text c={"white"}>INFORMASI DARMASABA</Text>
</Flex>
</Carousel.Slide>
<Carousel.Slide bg={WARNA.biruTua} style={{ borderRadius: 10 }}>
<Flex justify={'center'} h={"100%"} align={'center'}>
<Text c={"white"}>INFORMASI DARMASABA</Text>
</Flex>
</Carousel.Slide>
<Carousel.Slide bg={WARNA.biruTua} style={{ borderRadius: 10 }}>
<Flex justify={'center'} h={"100%"} align={'center'}>
<Text c={"white"}>INFORMASI DARMASABA</Text>
</Flex>
</Carousel.Slide>
</Carousel>
</>
);
}