wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

UI Detail Layanan & Detail Penghargaan

Browse Source
This commit is contained in:
nico
2025-03-13 15:48:47 +08:00
parent cef0c98f1e
commit 7d93ba5108
22 changed files with 996 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/app/darmasaba/(pages)/desa/layanan/(detail)/belumkawin/page.tsx Normal file
View File

@@ -0,0 +1,35 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Belum Kawin
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Khusus bagi yang berstatus duda atau janda melampirkan fotocopy akta cerai atau dokumen pendukung lainnya</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

35
src/app/darmasaba/(pages)/desa/layanan/(detail)/biodata/page.tsx Normal file
View File

@@ -0,0 +1,35 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Beda Biodata Diri
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Fotocopy dokumen bersangkutan yang terdapat perbedaan biodata diri misal : Sertifikat Tanah/Ijazah/Polis Asuransi dan lainnya.</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

26
src/app/darmasaba/(pages)/desa/layanan/(detail)/domisili/page.tsx
View File

@@ -1,15 +1,31 @@
import colors from '@/con/colors';
import { Stack, Container, Text } from '@mantine/core';
import React from 'react';
import { Box, Container, Image, List, ListItem, Stack, Text } from '@mantine/core';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text>
</Text>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Domisili Organisasi
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Surat Keterangan Terdaftar (SKT) organisasi atau Pengukuhan Kelompok</ListItem>
<ListItem fz={"sm"}>Jika Pengajuan baru pembuatan SKT maka melengkapi Susunan Pengurus lengkap dengan Kop Organisasi</ListItem>
<ListItem fz={"sm"}>Tanggal berdiri/Tahun berdiri/Sejak kapan berdirinya organisasi</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt=''/>
</Box>
</Stack>
</Container>
</Stack>

36
src/app/darmasaba/(pages)/desa/layanan/(detail)/kelahiran/page.tsx Normal file
View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Kelahiran
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Surat lahir dari dokter/bidan (jika ada)</ListItem>
<ListItem fz={"sm"}>Fotocopy Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP 2 orang saksi</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-kelahiran-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

36
src/app/darmasaba/(pages)/desa/layanan/(detail)/kematian/page.tsx Normal file
View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Kematian
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Surat Kematian dari rumah sakit atau dokter (jika ada)</ListItem>
<ListItem fz={"sm"}>Tanggal dan Waktu Kematian</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

35
src/app/darmasaba/(pages)/desa/layanan/(detail)/penghasilan/page.tsx Normal file
View File

@@ -0,0 +1,35 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Penghasilan
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP orang tua atau Fotocopy Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Membuat Surat Pernyataan Penghasilan bermaterai (disertai jumlah penghasilan)</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

34
src/app/darmasaba/(pages)/desa/layanan/(detail)/skck/page.tsx Normal file
View File

@@ -0,0 +1,34 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Kelakuan Baik (Pengantar SKCK)
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

36
src/app/darmasaba/(pages)/desa/layanan/(detail)/tempatusaha/page.tsx Normal file
View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Tempat Usaha
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Foto Lokasi dan Kegiatan Usaha di cetak dalam selembar kertas (diparaf dan stempel oleh Kelian Banjar Dinas)</ListItem>
<ListItem fz={"sm"}>Surat Perjanjian Sewa/Kontrak atau Kwintansi Pembayaran Sewa 3 bulan terakhir bagi yang mengontrak tempat usaha, apabila tempat usaha milik sendiri lampiri dengan dokumen kepemilikan tempat usaha (dapat berupa fotocopy sppt atau Fotocopy Sertipikat Hak Milik)</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-tempat-usaha-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

37
src/app/darmasaba/(pages)/desa/layanan/(detail)/tidakmampu/page.tsx Normal file
View File

@@ -0,0 +1,37 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Tidak Mampu
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP/KIA atau Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Fotocopy Kartu Indonesia Pintar/Kartu Perlindungan Sosial/Terdaftar dalam DTKS</ListItem>
<ListItem fz={"sm"}>Jika tidak memiliki Kartu tersebut diatas diwajibkan membuat Surat Pernyataan Tidak Mampu
</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-tidak-mampu-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

35
src/app/darmasaba/(pages)/desa/layanan/(detail)/usaha/page.tsx Normal file
View File

@@ -0,0 +1,35 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Usaha
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Foto Lokasi dan Kegiatan Usaha di cetak dalam selembar kertas (diparaf dan stempel oleh Kelian Banjar Dinas)</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

34
src/app/darmasaba/(pages)/desa/layanan/(detail)/yatim/page.tsx Normal file
View File

@@ -0,0 +1,34 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton />
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Yatim Piatu
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp, KIA atau Kartu Keluarga</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
</Stack>
</Container>
</Stack>
);
}
export default Page;

56
src/app/darmasaba/(pages)/desa/layanan/page.tsx
View File

@@ -1,47 +1,78 @@
'use client'
import colors from "@/con/colors";
import { ActionIcon, Anchor, BackgroundImage, Box, Button, Container, Divider, Flex, Group, List, ListItem, SimpleGrid, Stack, Stepper, StepperCompleted, StepperStep, Text } from "@mantine/core";
import { ActionIcon, BackgroundImage, Box, Button, Container, Divider, Flex, Group, List, ListItem, SimpleGrid, Stack, Stepper, StepperCompleted, StepperStep, Text } from "@mantine/core";
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import BackButton from "./_com/BackButto";
const data = [
{
id: 1,
images: "/api/img/test.png",
name: "Surat Keterangan Domisili Organisasi",
link: ""
link: "/darmasaba/desa/layanan/domisili"
},
{
id: 2,
images: "/api/img/test-3.jpeg",
name: "Surat Keterangan Penghasilan",
link: ""
link: "/darmasaba/desa/layanan/penghasilan"
},
{
id: 3,
images: "/api/img/domisili.jpeg",
name: "Surat Keterangan Tidak Mampu",
link: ""
link: "/darmasaba/desa/layanan/tidakmampu"
},
{
id: 4,
images: "/api/img/kelahiran.jpeg",
name: "Surat Keterangan Kelahiran",
link: ""
link: "/darmasaba/desa/layanan/kelahiran"
},
{
id: 5,
images: "/api/img/keterangan-usaha.jpeg",
name: "Surat Keterangan Usaha",
link: ""
link: "/darmasaba/desa/layanan/usaha"
},
{
id: 6,
images: "/api/img/kematian.jpeg",
name: "Surat Keterangan Kematian",
link: ""
link: "/darmasaba/desa/layanan/kematian"
},
{
id: 7,
images: "/api/img/tempatusaha.jpeg",
name: "Surat Keterangan Tempat Usaha",
link: "/darmasaba/desa/layanan/tempatusaha"
},
{
id: 8,
images: "/api/img/belumkawin.jpeg",
name: "Surat Keterangan Belum Kawin",
link: "/darmasaba/desa/layanan/belumkawin"
},
{
id: 9,
images: "/api/img/berkelakuan-baik.jpeg",
name: "Surat Keterangan Kelakuan Baik",
link: "/darmasaba/desa/layanan/skck"
},
{
id: 10,
images: "/api/img/biodata.jpeg",
name: "Surat Keterangan Beda Biodata Diri",
link: "/darmasaba/desa/layanan/biodata"
},
{
id: 11,
images: "/api/img/yatim.jpeg",
name: "Surat Keterangan Yatim Piatu",
link: "/darmasaba/desa/layanan/yatim"
}
]
export default function Page() {
@@ -52,6 +83,7 @@ export default function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton/>
<Stack align="center" gap={0}>
{/* Bagian Layanan */}
<Text fz={"3.4rem"} fw={"bold"}>
@@ -162,7 +194,7 @@ export default function Page() {
</Group>
<Text py={35} ta={"justify"} fz={"sm"}>Penting untuk diingat bahwa prosedur dan persyaratan dapat berubah
seiring waktu. Untuk informasi yang lebih akurat dan terkini, saya sarankan untuk mengunjungi situs
resmi OSS <Anchor>(https://oss.go.id/)</Anchor> atau menghubungi instansi terkait di pemerintah Indonesia yang bertanggung jawab atas urusan perizinan usaha.</Text>
resmi OSS <a href={"https://oss.go.id/"}>(https://oss.go.id/)</a> atau menghubungi instansi terkait di pemerintah Indonesia yang bertanggung jawab atas urusan perizinan usaha.</Text>
</Box>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
@@ -170,9 +202,9 @@ export default function Page() {
</Box>
<Text fz={"sm"} py={10}>Terwujudnya Layanan umum bertajuk Sistim administrasi Kependudukan Terintegrasi di Desa berbasi Elektronik, Smart dan Aman. layanan telunjuk sakti Desa meliputi :</Text>
<List type="ordered" pb={20}>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kelahiran (Petunjuk Pengajuan pada link berikut : Download <Anchor fz={"sm"}>Akta Kelahiran</Anchor>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Perkawinan (Petunjuk Pengajuan pada link berikut : Download <Anchor fz={"sm"}>Akta Perkawinan</Anchor>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kematian (Petunjuk Pengajuan pada link berikut : Download <Anchor fz={"sm"}>Akata Kematian</Anchor>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kelahiran (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KELAHIRAN_(dengan%20contoh%20Formulir).pdf">Akta Kelahiran</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Perkawinan (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20PERKAWINAN_(dengan%20contoh%20Formulir).pdf">Akta Perkawinan</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kematian (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KEMATIAN_(dengan%20contoh%20Formulir).pdf">Akata Kematian</a>)</ListItem>
</List>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
@@ -199,7 +231,7 @@ export default function Page() {
</Flex>
</Box>
</Flex>
<Divider pb={50}/>
<Divider pb={50} />
</Container>
</Stack>
)

112
src/app/darmasaba/(pages)/desa/potensi/page.tsx Normal file
View File

@@ -0,0 +1,112 @@
'use client'
import colors from '@/con/colors';
import { BackgroundImage, Box, Button, Container, Group, SimpleGrid, Stack, Text } from '@mantine/core';
import React from 'react';
import BackButton from '../layanan/_com/BackButto';
// import { useRouter } from 'next/navigation';
const datamap = [
{
id: 1,
images: "/api/img/tps.png",
name: "TPS3R Pudak Mesari",
deskripsi: "TPS 3R Pudak Mesari Darmasaba layak mendapat penghargaan demikian apresiasi dari Delterra Sosial Indonesia nie Semeton Darmasaba!, Hal tersebut dikarenakan walaupun baru berdiri namun TPS 3R kebanggaan Desa Darmasaba tersebut sudah berjalan dengan sangat baik. "
},
{
id: 2,
images: "/api/img/ack.png",
name: "Bumdes Pudak Mesari",
deskripsi: "Bumdes Pudak Mesari sangat membantu warga desa Darmasaba dalam mengelola dan membangun sebuah desa yang lebih baik lagi"
},
{
id: 3,
images: "/api/img/taman-beji.jpg",
name: "Taman Beji Cengana",
deskripsi: "Tirta Klebutan di Pura Taman Beji Cengana di Desa Adat Darmasaba, Badung, selain dipercaya nunas Taksu serta pembersihan diri. Tersemat juga asal usul cerita ditemukannya Tirta Klebutan yang tepat berada di pinggir Tukad Cengana tersebut."
},
{
id: 4,
images: "/api/img/waterpark.png",
name: "Gumuh Sari Water Park",
deskripsi: "Gumuh Sari Rekreasi atau waterpark, tempat wisata yang asyik dan seru untuk kamu sekeluarga! Tempat liburan di Bali memang seakan nggak ada habisnya. Selalu ada aja destinasi wisata seru yang bisa jadi wishlist. Ada banyak banget tempat wisata yang kamu kunjungi di Bali, mulai dari wisata alam, wisata modern, sampai wisata air."
},
{
id: 5,
images: "/api/img/pertanian.jpg",
name: "Pertanian",
deskripsi: "Dalam rangka pelaksanaan program ketahanan pangan tingkat desa, Pemerintah Desa Darmasaba telah membentuk kelompok petani dan peternak. Kelompok petani selanjutnya menggarap lahan yang sudah disiapkan untuk menanam tanaman pangan seperti cabe, tomat, timun, dan lain-lainnya sedangkan kelompok peternak akan melakukan ternak ikan lele."
},
]
function Page() {
// const router = useRouter()
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align='center' gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Potensi Desa
</Text>
<Text ta={"justify"} py={10}>
Potensi desa adalah segenap sumber daya alam dan sumber daya manusia yang dimiliki desa sebagai modal dasar yang perlu dikelola dan dikembangkan bagi kelangsungan dan perkembangan desa.
</Text>
</Stack>
<Text ta={"justify"}>
Adapun potensi yang dimiliki Desa Darmasaba yaitu:
</Text>
</Container>
<Box px={"lg"}>
<SimpleGrid
py={20}
cols={{
base: 1,
sm: 3
}}
>
{datamap.map((v, k) => {
return (
<BackgroundImage
key={k}
src={v.images}
h={350}
radius={16}
pos={"relative"}
>
<Box
style={{
borderRadius: 16,
zIndex: 0
}}
pos={"absolute"}
w={"100%"}
h={"100%"}
bg={colors.trans.dark[2]}
/>
<Stack justify='space-between' h={"100%"} gap={0} p={"lg"} pos={"relative"}>
<Box p={"lg"}>
<Text
c={"white"}
size={"1.5rem"}
style={{
textAlign: "center",
}}>{v.name}</Text>
</Box>
<Group justify="center">
<Button px={20} radius={"100"} size="md" bg={colors["blue-button"]}
>
Detail
</Button>
</Group>
</Stack>
</BackgroundImage>
)
})}
</SimpleGrid>
</Box>
</Stack>
);
}
export default Page;