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

Fix UI All Dashboard and SubDashbord page

Browse Source
This commit is contained in:
nico
2025-03-19 15:19:08 +08:00
parent 525b4a8474
commit 40b49c83ae
52 changed files with 1497 additions and 651 deletions
Download Patch File Download Diff File Expand all files Collapse all files

231
src/app/darmasaba/(pages)/desa/berita/page.tsx Normal file
View File

@@ -0,0 +1,231 @@
import colors from '@/con/colors';
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
import { IconCalendar, IconSearch, IconUser } from '@tabler/icons-react';
import BackButton from '../layanan/_com/BackButto';
const dataBeritaTerbaru = [
{
id: 1,
judul: 'Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik',
image: "/api/img/berita-1.png",
tanggal: "Selasa, 11 Januari 2025",
},
{
id: 2,
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
image: "/api/img/prestasi-voli.jpeg",
tanggal: "Kamis, 13 Januari 2025",
},
{
id: 3,
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
image: "/api/img/prestasi-voli.jpeg",
tanggal: "Kamis, 13 Januari 2025",
},
]
function Page() {
return (
<Stack pos="relative" bg={colors.Bg} py="xl" gap="md">
{/* Header */}
<Box px={{ base: "md", md: 100 }}>
<BackButton />
</Box>
<Container size="lg" px="md">
<Stack align="center" gap="xs" mb="xl">
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
Portal Berita Darmasaba
</Text>
<Text ta="center" px="md">
Temukan berbagai potensi dan keunggulan yang dimiliki Desa Darmasaba
</Text>
</Stack>
</Container>
{/* Tabs Menu */}
<Box px={{ base: "md", md: "xl" }} py="md" bg={colors['BG-trans']} mb="md">
<Grid align="center" justify="space-between">
<GridCol span={{ base: 12, md: 8 }}>
<Group gap="md" wrap="wrap">
<Paper bg={colors['blue-button']} radius="xl" py={5} px={20}>
<Text c={colors['white-1']} size="sm">
Semua
</Text>
</Paper>
{['Pemerintahan', 'Pembangunan', 'Ekonomi', 'Sosial', 'Budaya', 'Teknologi'].map((kategori) => (
<Paper key={kategori} bg={colors['blue-button-trans']} radius="xl" py={5} px={20}>
<Text size="sm">
{kategori}
</Text>
</Paper>
))}
</Group>
</GridCol>
<GridCol span={{ base: 12, md: 4 }}>
<TextInput
radius="lg"
placeholder="Cari Berita"
leftSection={<IconSearch size={18} />}
w="100%"
/>
</GridCol>
</Grid>
</Box>
{/* Konten Berita */}
<Container size="xl" px={{ base: "md", md: "xl" }}>
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
{/* Berita Utama */}
<GridCol span={{ base: 12, md: 8 }}>
<Paper p="md" shadow="sm" radius="md">
<Stack gap="md">
<Box>
<Image
src="/api/img/berita-1.png"
alt="Darmasaba Smart Village"
radius="md"
fit="cover"
h={{ base: 450, md: 660 }}
/>
</Box>
<Group>
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
<Text size="sm">Teknologi</Text>
</Paper>
</Group>
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
</Text>
<Text size="md" lineClamp={3}>
Desa Darmasaba mengambil langkah maju dalam transformasi digital dengan meluncurkan aplikasi Smart Village yang memudahkan warga dalam mengakses layanan publik secara online.
</Text>
<Group>
<Group gap="xs">
<IconCalendar size={18} />
<Text size="sm">Selasa, 11 Januari 2025</Text>
</Group>
<Group gap="xs">
<IconUser size={18} />
<Text size="sm">Admin Desa</Text>
</Group>
</Group>
</Stack>
</Paper>
</GridCol>
{/* Berita Sampingan */}
<GridCol span={{ base: 12, md: 4 }}>
<Stack gap="md">
{/* Berita Sampingan 1 */}
<Paper p="md" shadow="sm" radius="md">
<Stack gap="sm">
<Image
radius="md"
src="/api/img/prestasi-voli.jpeg"
alt="Prestasi Voli"
fit="cover"
h={180}
/>
<Group>
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
<Text size="sm">Teknologi</Text>
</Paper>
</Group>
<Text fz="lg" fw="bold" lineClamp={2}>
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
</Text>
<Group>
<Group gap="xs">
<IconCalendar size={18} />
<Text size="sm">Selasa, 11 Januari 2025</Text>
</Group>
<Group gap="xs">
<IconUser size={18} />
<Text size="sm">Admin Desa</Text>
</Group>
</Group>
</Stack>
</Paper>
{/* Berita Sampingan 2 */}
<Paper p="md" shadow="sm" radius="md">
<Stack gap="sm">
<Image
radius="md"
src="/api/img/prestasi-voli.jpeg"
alt="Prestasi Voli"
fit="cover"
h={180}
/>
<Group>
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
<Text size="sm">Sosial</Text>
</Paper>
</Group>
<Text fz="lg" fw="bold" lineClamp={2}>
Tim Voli Darmasaba Raih Juara Turnamen Desa
</Text>
<Group>
<Group gap="xs">
<IconCalendar size={18} />
<Text size="sm">Selasa, 11 Januari 2025</Text>
</Group>
<Group gap="xs">
<IconUser size={18} />
<Text size="sm">Admin Desa</Text>
</Group>
</Group>
</Stack>
</Paper>
</Stack>
</GridCol>
</Grid>
<Box pb={30}>
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
<Divider color={colors["blue-button"]} />
</Box>
<SimpleGrid cols={{ base: 1, md: 3 }}>
{dataBeritaTerbaru.map((v, k) => {
return (
<Paper key={k} p="md" shadow="sm" radius="md">
<Stack gap="sm">
<Image
radius="md"
src={v.image}
alt="Prestasi Voli"
fit="cover"
h={180}
/>
<Group>
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
<Text size="sm">Teknologi</Text>
</Paper>
</Group>
<Text fz="lg" fw="bold" lineClamp={2}>
{v.judul}
</Text>
<Group>
<Group gap="xs">
<IconCalendar size={18} />
<Text size="sm">{v.tanggal}</Text>
</Group>
<Group gap="xs">
<IconUser size={18} />
<Text size="sm">Admin Desa</Text>
</Group>
</Group>
</Stack>
</Paper>
)
})}
</SimpleGrid>
<Box py={"xl"}>
<Center>
<Pagination total={10} />
</Center>
</Box>
</Container>
</Stack>
);
}
export default Page;

100
src/app/darmasaba/(pages)/desa/galery/page.tsx Normal file
View File

@@ -0,0 +1,100 @@
import colors from '@/con/colors';
import { ActionIcon, Box, Center, Container, Flex, Image, Paper, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
import { IconPhoto, IconSearch, IconVideo } from '@tabler/icons-react';
import BackButton from '../layanan/_com/BackButto';
const data = [
{
id: 1,
image: "/api/img/galeri-1.png",
title: "Pendapatan",
tanggal: "3 Mar 2025",
judul: "Pemasangan Wifi Gratis Di Publik Desa",
},
{
id: 2,
image: "/api/img/galeri-2.png",
title: "Belanja",
tanggal: "4 Mar 2025",
judul: "Panen raya Desa Darmasaba",
},
{
id: 3,
image: "/api/img/galeri-3.png",
title: "Pembiayaan",
tanggal: "5 Mar 2025",
judul: "Kegiatan Pembangunan Pelinggih",
}
]
function Page() {
return (
<Stack pos="relative" bg={colors.Bg} py="xl" gap="md">
{/* Header */}
<Box px={{ base: "md", md: 100 }}>
<BackButton />
</Box>
<Container size="lg" px="md">
<Stack align="center" gap="xs" mb="xl">
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
Galeri Kegiatan Desa Darmasaba
</Text>
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Flex justify={"space-between"} align={"center"} pb={50}>
<Flex gap={"lg"}>
<ActionIcon variant='transparent' p={50}>
<Flex c={colors["blue-button"]} align={"center"} gap={10}>
<IconPhoto size={35} />
<Text fz={"h4"}>Foto</Text>
</Flex>
</ActionIcon>
<ActionIcon variant='transparent' p={50}>
<Flex c={colors["blue-button"]} align={"center"} gap={10}>
<IconVideo size={35} />
<Text fz={"h4"}>Video</Text>
</Flex>
</ActionIcon>
</Flex>
<TextInput
placeholder='Cari Galeri'
radius="lg"
leftSection={<IconSearch size={20} />}
w={{ base: "25%", md: "30%" }}
/>
</Flex>
<SimpleGrid
cols={{
base: 1,
md: 3,
}}>
{data.map((v, k) => {
return (
<Box key={k}>
<Paper mb={50} p={"md"} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Box>
<Center>
<Image src={v.image} alt='' />
</Center>
</Box>
<Box>
<Stack gap={"sm"} py={10}>
<Text fz={{ base: "sm", md: "sm" }}>{v.tanggal}</Text>
<Text fw={"bold"} fz={{ base: "sm", md: "sm" }}>{v.judul}</Text>
<Text ta={"justify"} fz={{ base: "sm", md: "sm" }}>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Fusce sagittis nec arcu ac ornare. Praesent a porttitor
felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
</Stack>
</Box>
</Paper>
</Box>
)
})}
</SimpleGrid>
</Box>
</Stack>
);
}
export default Page;

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

@@ -1,34 +1,40 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: "h2" }} pb={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>
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>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}>
<Text fz={{ base: "h4", md: "h2" }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,34 +1,40 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: "h2" }} pb={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>
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>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}>
<Text fz={{ base: "h4", md: "h2" }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,34 +1,40 @@
import colors from '@/con/colors';
import { Box, Button, Container, Image, List, ListItem, Stack, Text } from '@mantine/core';
import { Box, Button, Center, 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}>
<BackButton />
<Stack gap={0}>
</Box>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Domisili Organisasi
</Text>
<Text fz={"h4"} py={20}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0} >
<Text fz={{ base: "h4", md: "h2" }} pb={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>
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Surat Keterangan Terdaftar (SKT) organisasi atau Pengukuhan Kelompok</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Jika Pengajuan baru pembuatan SKT maka melengkapi Susunan Pengurus lengkap dengan Kop Organisasi</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Tanggal berdiri/Tahun berdiri/Sejak kapan berdirinya organisasi</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
<Text fz={{ base: "h4", md: "h2" }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,35 +1,41 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Group, Center } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: "h2" }} pb={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>
<ListItem fz={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Surat lahir dari dokter/bidan (jika ada)</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Kartu Keluarga</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy KTP 2 orang saksi</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
<Text fz={{ base: "h4", md: "h2" }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-kelahiran-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,35 +1,41 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: "h2" }} pb={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>
<ListItem fz={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Surat Kematian dari rumah sakit atau dokter (jika ada)</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Tanggal dan Waktu Kematian</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
<Text fz={{ base: "h4", md: "h2" }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,34 +1,40 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{base:"h4", md: "h2"}} pb={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>
<ListItem fz={{base:"sm", md: "h3"}}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{base:"sm", md: "h3"}}>Fotocopy KTP orang tua atau Fotocopy Kartu keluarga</ListItem>
<ListItem fz={{base:"sm", md: "h3"}}>Membuat Surat Pernyataan Penghasilan bermaterai (disertai jumlah penghasilan)</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
<Text fz={{base:"h4", md: "h2"}} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,33 +1,39 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: "h2" }} pb={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={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
<Text fz={{ base: "h4", md: "h2" }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,35 +1,41 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: 'h2' }} pb={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>
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Foto Lokasi dan Kegiatan Usaha di cetak dalam selembar kertas (diparaf dan stempel oleh Kelian Banjar Dinas)</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>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}>
<Text fz={{ base: "h4", md: 'h2' }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-tempat-usaha-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,36 +1,42 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: "h2" }} 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 fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy KTP/KIA atau Kartu Keluarga</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Kartu Indonesia Pintar/Kartu Perlindungan Sosial/Terdaftar dalam DTKS</ListItem>
<ListItem fz={{ base: "sm", md: "h3" }}>Jika tidak memiliki Kartu tersebut diatas diwajibkan membuat Surat Pernyataan Tidak Mampu
</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
<Text fz={{ base: "h4", md: "h2" }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-tidak-mampu-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

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

@@ -1,34 +1,40 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: 'h2' }} pb={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={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>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}>
<Text fz={{ base: "h4", md: 'h2' }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack >
);
}

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

@@ -1,33 +1,39 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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"}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"22"}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<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}>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={0}>
<Text fz={{ base: "h4", md: 'h2' }} pb={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={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Ktp, KIA atau Kartu Keluarga</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
<Text fz={{ base: "h4", md: 'h2' }} py={20}>
Alur Pelayanan:
</Text>
<Center>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Center>
</Box>
<Group justify='center'>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Group>
</Stack>
</Container>
</Box>
</Stack>
);
}

3
src/app/darmasaba/(pages)/desa/layanan/_com/BackButto.tsx
View File

@@ -1,5 +1,6 @@
'use client'
import colors from "@/con/colors";
import { ActionIcon } from "@mantine/core";
import { IconArrowLeft } from "@tabler/icons-react";
import { useTransitionRouter } from 'next-view-transitions';
@@ -7,7 +8,7 @@ import { useTransitionRouter } from 'next-view-transitions';
export default function BackButton() {
const router = useTransitionRouter()
return (
<ActionIcon variant="transparent" onClick={() => router.back()}>
<ActionIcon bg={colors["blue-button"]} onClick={() => router.back()}>
<IconArrowLeft />
</ActionIcon>
);

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

@@ -82,8 +82,10 @@ export default function Page() {
const prevStep = () => setActive((current) => (current > 0 ? current - 1 : current));
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} >
<Box px={{ base: 'md', md: 100 }}>
<BackButton />
</Box>
<Container w={{ base: "100%", md: "50%" }} >
<Stack align="center" gap={0}>
{/* Bagian Layanan */}
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
@@ -101,9 +103,11 @@ export default function Page() {
/>
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
{/* Bagian Pelayanan Surat Keterangan */}
<Box py={10}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Surat Keterangan</Text>
<Text fz={{ base: "h4", md: 'h2' }} fw={"bold"}>Pelayanan Surat Keterangan</Text>
</Box>
<SimpleGrid
py={20}
@@ -153,14 +157,14 @@ export default function Page() {
</SimpleGrid>
{/* Bagian Pelayanan Perizinan Berusaha */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Perizinan Berusaha Berbasis Risiko Melalui Sistem ONLINE SINGLE SUBMISSION (OSS)</Text>
<Text fz={{ base: "h4", md: 'h2' }} fw={"bold"}>Pelayanan Perizinan Berusaha Berbasis Risiko Melalui Sistem ONLINE SINGLE SUBMISSION (OSS)</Text>
</Box>
<Text py={10} ta={"justify"} fz={"sm"}>Penyelenggaraan Perizinan Berusaha Berbasis Risiko melalui Sistem Online Single Submission (OSS)
<Text py={10} ta={"justify"} fz={{ base: "sm", md: 'h3' }}>Penyelenggaraan Perizinan Berusaha Berbasis Risiko melalui Sistem Online Single Submission (OSS)
merupakan pelaksanaan Undang-Undang Nomor 11 Tahun 2020 Tentang Cipta Kerja. OSS Berbasis Risiko wajib digunakan oleh Pelaku Usaha,
Kementerian/Lembaga, Pemerintah Daerah, Administrator Kawasan Ekonomi Khusus (KEK), dan Badan Pengusahaan Kawasan Perdagangan Bebas
Pelabuhan Bebas (KPBPB).Berdasarkan Peraturan Pemerintah Nomor 5 Tahun 2021 terdapat 1.702 kegiatan usaha yang terdiri atas 1.349
Klasifikasi Baku Lapangan Usaha Indonesia (KBLI) yang sudah diimplementasikan dalam Sistem OSS Berbasis Risiko.</Text>
<Text py={10} fz={"sm"}>Proses pendaftaran NIB melalui OSS mencakup beberapa langkah umum, seperti:</Text>
<Text py={10} fz={{ base: "sm", md: 'h3' }}>Proses pendaftaran NIB melalui OSS mencakup beberapa langkah umum, seperti:</Text>
<Box p={"xl"} w={{ base: "100%", md: "100%" }} >
<Stepper active={active} onStepClick={setActive} orientation="vertical"
styles={{
@@ -199,7 +203,7 @@ export default function Page() {
<Button variant="default" onClick={prevStep}>Back</Button>
<Button onClick={nextStep}>Next step</Button>
</Group>
<Text py={35} ta={"justify"} fz={"sm"}>Penting untuk diingat bahwa prosedur dan persyaratan dapat berubah
<Text py={35} ta={"justify"} fz={{ base: "sm", md: 'h3' }}>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 <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>
@@ -207,20 +211,20 @@ export default function Page() {
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Telunjuk Sakti Desa</Text>
</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>
<Text fz={{ base: "sm", md: 'h3' }} 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 <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>
<ListItem fz={{ base: "sm", md: 'h3' }}>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={{ base: "sm", md: 'h3' }}>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={{ base: "sm", md: 'h3' }}>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}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Penduduk Non-Permanent</Text>
</Box>
<Text pb={20} fz={"sm"} ta={"justify"}>Surat Keterangan Penduduk Non-Permanent adalah dokumen yang dikeluarkan oleh pihak berwenang untuk memberikan keterangan bahwa seseorang atau kelompok orang memiliki status penduduk non-permanent di suatu wilayah. Dokumen ini biasanya digunakan untuk keperluan administratif atau legal, seperti mendapatkan akses ke layanan kesehatan, pendidikan, atau pelayanan publik lainnya.</Text>
<Text pb={20} fz={{ base: "sm", md: 'h3' }} ta={"justify"}>Surat Keterangan Penduduk Non-Permanent adalah dokumen yang dikeluarkan oleh pihak berwenang untuk memberikan keterangan bahwa seseorang atau kelompok orang memiliki status penduduk non-permanent di suatu wilayah. Dokumen ini biasanya digunakan untuk keperluan administratif atau legal, seperti mendapatkan akses ke layanan kesehatan, pendidikan, atau pelayanan publik lainnya.</Text>
<Divider color={colors["blue-button"]} />
<Flex justify={"space-between"} py={20}>
<Text fz={"sm"}>25 May 2021 . Darmasaba</Text>
<Text fz={{ base: "sm", md: 'h3' }}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
@@ -239,7 +243,7 @@ export default function Page() {
</Box>
</Flex>
<Divider color={colors["blue-button"]} pb={50} />
</Container>
</Box>
</Stack>
)
}

104
src/app/darmasaba/(pages)/desa/pengumuman/page.tsx Normal file
View File

@@ -0,0 +1,104 @@
import colors from '@/con/colors';
import { Stack, Box, Container, Text, TextInput, SimpleGrid, Notification, Flex, Anchor, Paper } from '@mantine/core';
import React from 'react';
import BackButton from '../layanan/_com/BackButto';
import { IconSearch } from '@tabler/icons-react';
function Page() {
return (
<Stack pos="relative" bg={colors.Bg} py="xl" gap="md">
{/* Header */}
<Box px={{ base: "md", md: 100 }}>
<BackButton />
</Box>
<Container size="lg" px="md">
<Stack align="center" gap="xs" mb="xl">
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
Pengumuman Desa Darmasaba
</Text>
<Text ta="center" px="md">
Informasi dan pengumuman resmi terkait kegiatan dan kebijakan Desa Darmasaba
</Text>
<TextInput
placeholder='Cari Pengumuman'
radius="lg"
leftSection={<IconSearch size={20} />}
w={{ base: "55%", md: "70%" }}
/>
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<SimpleGrid
cols={{
base: 1,
md: 2,
}}
>
<Notification styles={{ title: { fontWeight: "bold" } }} withCloseButton={false} title="Penting">
<Stack gap={"xs"}>
<Text fz={"sm"} fw={"bold"} c={"black"}>PENGUMUMAN LOWONGAN KERJA TPS3R PUDAK MESARI DESA DARMASABA</Text>
<Text ta={"justify"} fz={"sm"} c={"black"}>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sagittis nec arcu ac ornare. Praesent a porttitor felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
</Stack>
<Flex pt={20} gap={"md"} justify={"space-between"}>
<Text fz={"xs"} c={"black"}>1 Februari 2025</Text>
<Text fz={"xs"} c={"black"}>09:00 WITA</Text>
<Anchor>
<Text fz={"xs"}>Baca Selengkapnya</Text>
</Anchor>
</Flex>
</Notification>
<Paper p={"md"}>
<Stack gap={"xs"}>
<Text fw={"bold"} fz={"lg"} c={colors['blue-button']}>Kategori</Text>
<Flex justify={"space-between"}>
<Text fz={"md"} c={"black"}>Pengumuman</Text>
<Text fz={"md"} c={"black"}>5</Text>
</Flex>
<Flex justify={"space-between"}>
<Text fz={"md"} c={"black"}>Kegiatan</Text>
<Text fz={"md"} c={"black"}>10</Text>
</Flex>
<Flex justify={"space-between"}>
<Text fz={"md"} c={"black"}>Informasi</Text>
<Text fz={"md"} c={"black"}>12</Text>
</Flex>
<Flex justify={"space-between"}>
<Text fz={"md"} c={"black"}>Layanan</Text>
<Text fz={"md"} c={"black"}>6</Text>
</Flex>
</Stack>
</Paper>
<Notification color='yellow' styles={{ title: { fontWeight: "bold" } }} withCloseButton={false} title="Informasi">
<Stack gap={"xs"}>
<Text fz={"sm"} fw={"bold"} c={"black"}>LELANG PEMASANGAN CCTV DESA DARMASABA</Text>
<Text ta={"justify"} fz={"sm"} c={"black"}>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sagittis nec arcu ac ornare. Praesent a porttitor felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
</Stack>
<Flex pt={20} gap={"md"} justify={"space-between"}>
<Text fz={"xs"} c={"black"}>2 Februari 2025</Text>
<Text fz={"xs"} c={"black"}>10:00 WITA</Text>
<Anchor>
<Text fz={"xs"}>Baca Selengkapnya</Text>
</Anchor>
</Flex>
</Notification>
<Paper p={"md"}>
<Stack gap={"xs"}>
<Text fw={"bold"} fz={"lg"} c={colors['blue-button']}>Pengumuman Penting</Text>
<Flex justify={"space-between"}>
<Text fz={"md"} c={"black"}>Jadwal Rapat</Text>
<Text fz={"md"} c={"black"}>5</Text>
</Flex>
<Flex justify={"space-between"}>
<Text fz={"md"} c={"black"}>Pendaftaran UMKM</Text>
<Text fz={"md"} c={"black"}>10</Text>
</Flex>
</Stack>
</Paper>
</SimpleGrid>
</Box>
</Stack>
);
}
export default Page;

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/bumdes/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{base: "md", md: 0}}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Bumdes Pudak Mesari
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/ack.png" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Badan Usaha Milik Desa (BUMDes) Pudak Mesari adalah lembaga ekonomi desa yang berperan penting dalam pengembangan potensi dan kesejahteraan masyarakat Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali. BUMDes ini berfungsi sebagai motor penggerak perekonomian desa melalui berbagai unit usaha yang dikelola secara profesional.
</Text>
@@ -44,7 +46,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Dengan berbagai inisiatif tersebut, BUMDes Pudak Mesari menunjukkan perannya sebagai pilar utama dalam pengembangan ekonomi dan kesejahteraan masyarakat Desa Darmasaba, sekaligus menjaga kelestarian lingkungan melalui program-program inovatif dan kolaboratif.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/dam/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Dam Tanah Putih
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/damtanahputih.jpeg" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki Dam Tanah Putih sebagai salah satu potensi desa yang bernilai strategis. Selain berfungsi sebagai infrastruktur pengairan, dam ini juga memiliki potensi untuk dikembangkan sebagai destinasi wisata alam, edukasi, dan rekreasi bagi masyarakat lokal maupun wisatawan.
</Text>
@@ -61,7 +63,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Dengan berbagai fungsi dan keindahannya, Dam Tanah Putih memiliki potensi besar untuk dikembangkan sebagai destinasi wisata alam, rekreasi, serta edukasi lingkungan. Dengan pengelolaan yang baik dan dukungan dari masyarakat serta pemerintah desa, dam ini dapat menjadi aset penting bagi Darmasaba, baik dari sisi ekonomi maupun kelestarian lingkungan.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/genteng/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Genteng
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/genteng.jpeg" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam industri genteng yang dikelola oleh Usaha Mikro, Kecil, dan Menengah (UMKM). Sebagai desa yang masih mempertahankan nilai-nilai tradisional dalam pembangunan, industri genteng di Darmasaba berperan penting dalam penyediaan bahan bangunan berkualitas bagi masyarakat lokal maupun luar daerah.
</Text>
@@ -59,7 +61,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
UMKM genteng di Desa Darmasaba memiliki potensi besar untuk terus berkembang sebagai sektor industri unggulan. Dengan inovasi, pemasaran yang lebih luas, serta dukungan dari pemerintah dan masyarakat, industri ini dapat meningkatkan kesejahteraan warga dan memperkuat perekonomian desa.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/gumuh/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{base: "md", md: 0}}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Gumuh Sari Waterpark
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/waterpark.png" alt='' w={"100%"} h={400} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Gumuh Sari Waterpark, terletak di Jl. Tegal Gumuh No. 9, Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali, adalah destinasi rekreasi yang menawarkan berbagai fasilitas untuk pengunjung dari segala usia. Taman rekreasi ini tidak hanya menyediakan wahana air yang menyenangkan, tetapi juga fasilitas olahraga dan kuliner, menjadikannya tempat ideal untuk rekreasi keluarga dan komunitas.
</Text>
@@ -47,7 +49,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Melalui pengelolaan dan pengembangan yang tepat, Gumuh Sari Waterpark dapat menjadi motor penggerak bagi kemajuan Desa Darmasaba, meningkatkan kesejahteraan masyarakat, dan menjadikan desa ini sebagai destinasi wisata yang dikenal luas.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/ikm/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
IKM Berbasis Pengolahan Pangan
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/ikm.png" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam Industri Kecil dan Menengah (IKM) berbasis pengolahan pangan. Dengan sumber daya alam yang melimpah dan warisan kuliner khas Bali, Darmasaba dapat mengembangkan sektor ini untuk meningkatkan kesejahteraan masyarakat dan menciptakan lapangan kerja baru.
</Text>
@@ -53,7 +55,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
IKM berbasis pengolahan pangan memiliki potensi besar untuk menjadi sektor unggulan di Desa Darmasaba. Dengan inovasi, dukungan teknologi, serta pemasaran yang baik, produk-produk lokal dapat bersaing di pasar yang lebih luas, meningkatkan kesejahteraan masyarakat, dan menjadikan Darmasaba sebagai pusat industri pangan kreatif di Kabupaten Badung.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/joging/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Jogging Track Tegeh Aban, Karang Gadon dan Munduk Uma Desa
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/jogging.jpg" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi wisata olahraga dan rekreasi melalui Jogging Track Tegeh Aban, Karang Gadon, dan Munduk Uma Desa. Jalur jogging ini tidak hanya menjadi fasilitas olahraga bagi warga, tetapi juga berpotensi dikembangkan sebagai destinasi wisata sehat berbasis alam yang menarik bagi wisatawan lokal maupun luar daerah.
</Text>
@@ -55,7 +57,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Jogging Track Tegeh Aban, Karang Gadon, dan Munduk Uma Desa memiliki potensi besar sebagai destinasi wisata sehat dan olahraga berbasis alam. Dengan pengelolaan yang baik serta dukungan dari pemerintah desa dan masyarakat, jalur ini bisa menjadi ikon baru Desa Darmasaba yang menarik bagi wisatawan serta meningkatkan perekonomian warga setempat.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/kuliner/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} px={{ base: "md", md: 0 }} gap={"42"} >
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} px={{ base: "md", md: 0 }} gap={"22"} >
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Kawasan Kuliner
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/warungumkm.jpg" alt='' w={"100%"} h={400} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, Bali, memiliki potensi besar dalam sektor kuliner. Sebagai desa yang strategis dan terus berkembang, Darmasaba mulai dikenal sebagai destinasi kuliner yang menawarkan beragam makanan khas Bali hingga makanan modern yang menarik minat wisatawan dan masyarakat lokal.
</Text>
@@ -52,7 +54,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Dengan kekayaan kuliner yang dimiliki, Desa Darmasaba berpotensi menjadi kawasan kuliner unggulan di Kabupaten Badung. Dukungan dari masyarakat, pemerintah desa, serta promosi yang lebih luas dapat menjadikan Darmasaba sebagai destinasi kuliner yang semakin dikenal dan berkembang.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/lele/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Peternakan Ikan Lele
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/peternakanlele.jpg" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam sektor peternakan lele. Dengan kondisi lingkungan yang mendukung serta meningkatnya permintaan ikan lele di pasaran, budidaya ikan lele dapat menjadi salah satu sektor ekonomi unggulan yang mampu meningkatkan kesejahteraan masyarakat desa.
</Text>
@@ -59,7 +61,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
UMKM genteng di Desa Darmasaba memiliki potensi besar untuk terus berkembang sebagai sektor industri unggulan. Dengan inovasi, pemasaran yang lebih luas, serta dukungan dari pemerintah dan masyarakat, industri ini dapat meningkatkan kesejahteraan warga dan memperkuat perekonomian desa.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/pemotongan/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Pemotongan Daging
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/potong-daging.png" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam sektor pemotongan daging. Kegiatan ini tidak hanya berperan dalam memenuhi kebutuhan konsumsi lokal, tetapi juga mendukung sektor kuliner, usaha mikro, dan distribusi daging ke berbagai wilayah di Bali.
</Text>
@@ -67,7 +69,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Pemotongan daging di Desa Darmasaba memiliki potensi besar sebagai sektor ekonomi utama, dengan permintaan pasar yang tinggi serta peluang inovasi dalam pengolahan produk daging. Dengan pengelolaan yang baik, usaha ini dapat berkembang menjadi industri yang lebih modern, higienis, dan berkelanjutan.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/pertanian/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Pertanian
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/pertanian.jpg" alt='' w={"100%"} h={400} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, Bali, memiliki potensi pertanian yang besar sebagai bagian dari warisan agraris yang telah diwariskan secara turun-temurun. Dengan kondisi tanah yang subur serta sistem irigasi tradisional subak, pertanian di Darmasaba memainkan peran penting dalam ekonomi dan keberlanjutan lingkungan desa.
</Text>
@@ -52,7 +54,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Dengan berbagai potensi yang dimiliki, pertanian di Desa Darmasaba dapat terus berkembang melalui inovasi dan pemanfaatan teknologi pertanian modern. Dukungan dari masyarakat, pemerintah, dan lembaga terkait sangat penting untuk menjaga keberlanjutan sektor pertanian dan meningkatkan kesejahteraan petani di desa ini.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/taman/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Taman Beji Cengana
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/taman-beji.jpg" alt='' w={"100%"} h={400} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Taman Beji Cengana, terletak di Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali, adalah situs suci yang memiliki nilai spiritual dan sejarah yang tinggi. Tempat ini dikenal sebagai lokasi untuk ritual pembersihan diri (melukat) dan peribadatan oleh umat Hindu Bali. Keberadaan mata air suci (Tirta Klebutan) di Taman Beji Cengana dipercaya memberikan berkah dan penyucian bagi mereka yang datang untuk berdoa dan melakukan ritual.
</Text>
@@ -47,7 +49,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Dengan memanfaatkan potensi yang dimiliki Taman Beji Cengana, Desa Darmasaba dapat mengembangkan sektor pariwisata, budaya, pendidikan, ekonomi, dan lingkungan secara berkelanjutan, yang pada gilirannya akan meningkatkan kesejahteraan masyarakat dan pelestarian warisan budaya.
</Text>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/tps/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
TPS3R Pudak Mesari
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/tps.png" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
TPS3R Pudak Mesari adalah Tempat Pengolahan Sampah dengan konsep Reduce, Reuse, dan Recycle (TPS3R) yang berlokasi di Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali. Fasilitas ini berperan penting dalam pengelolaan sampah berbasis masyarakat, dengan tujuan mengurangi volume sampah yang masuk ke Tempat Pembuangan Akhir (TPA) dan meningkatkan kesadaran warga tentang pentingnya pengelolaan sampah yang berkelanjutan.
</Text>
@@ -41,7 +43,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Pengembangan Pariwisata Berkelanjutan:</Text> Dengan lingkungan yang bersih dan asri, Desa Darmasaba memiliki potensi untuk menarik wisatawan yang tertarik pada ekowisata dan budaya lokal, sehingga meningkatkan perekonomian desa.
</ListItem>
</List>
</Container>
</Box>
</Stack>
);
}

8
src/app/darmasaba/(pages)/desa/potensi/(detail)/umkm/page.tsx
View File

@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{ base: "md", md: 0 }}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
UMKM
@@ -21,6 +21,8 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/umkm.jpeg" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam sektor Usaha Mikro, Kecil, dan Menengah (UMKM). Keberadaan UMKM di desa ini tidak hanya menjadi motor penggerak ekonomi lokal, tetapi juga mendukung pelestarian budaya dan kearifan lokal melalui berbagai produk unggulan.
</Text>
@@ -60,7 +62,7 @@ function Page() {
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
UMKM di Desa Darmasaba memiliki potensi besar dalam berbagai sektor, mulai dari kerajinan tangan, kuliner, hingga wisata berbasis masyarakat. Dengan inovasi, pemasaran yang lebih luas, dan dukungan dari pemerintah desa serta masyarakat, UMKM Darmasaba dapat berkembang pesat dan menjadi tulang punggung perekonomian desa.
</Text>
</Container>
</Box>
</Stack>
);
}

2
src/app/darmasaba/(pages)/desa/potensi/page.tsx
View File

@@ -102,7 +102,7 @@ function Page() {
const router = useRouter()
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Box px={"lg"}>
<Box px={{ base: "md", md: 100 }}>
<BackButton />
<Box pb={30}>
<Stack gap={0}>

4
src/app/darmasaba/(pages)/desa/profile/page.tsx
View File

@@ -8,6 +8,8 @@ import LambangDesa from './ui/lambangDesa';
import MaskotDesa from './ui/maskotDesa';
import ProfilPerbekel from './ui/profilPerbekel';
import LembagaDesa from './ui/lembagaDesa';
import MotoDesa from './ui/motoDesa';
import SemuaPerbekel from './ui/semuaPerbekel';
function Page() {
return (
@@ -30,6 +32,8 @@ function Page() {
<MaskotDesa />
<ProfilPerbekel />
<LembagaDesa />
<MotoDesa />
<SemuaPerbekel/>
</Box>
</Stack>
);

18
src/app/darmasaba/(pages)/desa/profile/ui/lembagaDesa.tsx
View File

@@ -6,29 +6,29 @@ function LembagaDesa() {
<Box pb={70}>
<Stack align='center' gap={0}>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"2.5rem"}>Lembaga Desa</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"h2"}>Badan Permusyawaratan Desa (BPD)</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Lembaga Desa</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h2"}}>Badan Permusyawaratan Desa (BPD)</Text>
</Box>
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Center pb={10}>
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 600, md: 1000 }} />
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 390, md: 1000 }} />
</Center>
</Paper>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"2.5rem"}>Lembaga pemberdayaan Masyarakat (LPM)</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Lembaga pemberdayaan Masyarakat (LPM)</Text>
</Box>
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Center pb={10}>
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 600, md: 1000 }} />
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 390, md: 1000 }} />
</Center>
</Paper>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"2.5rem"}>Perangkat Desa</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"h2"}>Struktur Organisasi Tata Kerja Pemerintahan Desa Darmasaba</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Perangkat Desa</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h2"}}>Struktur Organisasi Tata Kerja Pemerintahan Desa Darmasaba</Text>
</Box>
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Center pb={10}>
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 600, md: 1000 }} />
<Image src={"/api/img/pernagkatdesa.png"} alt='' w={{ base: 390, md: 1000 }} />
</Center>
</Paper>
</Stack>

78
src/app/darmasaba/(pages)/desa/profile/ui/motoDesa.tsx Normal file
View File

@@ -0,0 +1,78 @@
import colors from '@/con/colors';
import { ActionIcon, Box, Flex, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
const dataText = [
{
id: 1,
title: "SANTUN",
description: "Memberikan pelayanan yang baik, penuh rasa empati, sopan, dan beretika"
},
{
id: 2,
title: "ADAPTIF",
description: "Cepat menyesuaikan diri menghadapi perubahan dan bertindak proaktif"
},
{
id: 3,
title: "INOVATIF",
description: "Selalu berusaha menciptakan pembaruan atau kreasi baru"
},
{
id: 4,
title: "PROFESIONAL",
description: "Memiliki pengetahuan, terampil dan bertanggung jawab"
},
{
id: 5,
title: "GESIT",
description: "Inisiatif dan cekatan dalam bekerja"
},
]
function MotoDesa() {
return (
<Box pb={70}>
<Stack align='center' gap={0} >
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Moto Desa Darmasaba</Text>
</Box>
<Flex gap={50} pb={50} pt={20} justify={"space-evenly"} align={"center"} >
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>S</Text>
</ActionIcon>
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>I</Text>
</ActionIcon>
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>G</Text>
</ActionIcon>
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>A</Text>
</ActionIcon>
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>P</Text>
</ActionIcon>
</Flex>
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<SimpleGrid
cols={{
base: 1,
md: 2,
}}
>
{dataText.map((v, k) => {
return (
<Box key={k}>
<Text fw={"bold"} fz={{ base: "lg", md: "h3" }}>{v.title}</Text>
<Text fz={{ base: "sm", md: "md" }}>{v.description}</Text>
</Box>
)
})}
</SimpleGrid>
</Paper>
<Text mb={40} c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h3" }}>&quot;Berkomitmen memberikan pelayanan terbaik dengan prinsip SIGAP untuk masyarakat Desa Darmasaba&quot;</Text>
</Stack>
</Box>
);
}
export default MotoDesa;

111
src/app/darmasaba/(pages)/desa/profile/ui/semuaPerbekel.tsx Normal file
View File

@@ -0,0 +1,111 @@
'use client'
import colors from '@/con/colors';
import { Box, Center, Image, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
const data = [
{
id: 1,
nama: "SI GEDE KANIA",
wilayah: "PERBEKEL TEGAL",
periode: "Tahun 1943 - 1946",
foto: "/api/img/perbekel-1.png"
},
{
id: 2,
nama: "SI GEDE GANDEM",
wilayah: "PERBEKEL TEGAL",
periode: "Tahun 1946 - 1950",
foto: "/api/img/perbekel-2.png"
},
{
id: 3,
nama: "I WAYAN SAMA",
wilayah: "PERBEKEL TEGAL",
periode: "Tahun 1950 - 1953",
foto: "/api/img/perbekel-3.png"
},
{
id: 4,
nama: "I WAYAN NAMBREG",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 1950 - 1960",
foto: "/api/img/perbekel-4.png"
},
{
id: 5,
nama: "IDA BAGUS PUTU OKA",
wilayah: "PERBEKEL TEGAL/DARMASABA",
periode: "Tahun 1953 - 1974",
foto: "/api/img/perbekel-5.png"
},
{
id: 6,
nama: "I NYOMAN PATRA",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 1974 - 1991",
foto: "/api/img/perbekel-6.png"
},
{
id: 7,
nama: "I MADE RUDJA",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 1991 - 2007",
foto: "/api/img/perbekel-7.png"
},
{
id: 8,
nama: "I WAYAN KALER, SH.MH.",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 2007 - 2013",
foto: "/api/img/perbekel-8.png"
},
{
id: 9,
nama: "I MADE TARAM, SH.",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 2013 - 2019",
foto: "/api/img/perbekel-9.png"
},
]
function SemuaPerbekel() {
return (
<Box pb={50}>
<Stack align='center'>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Perbekel Dari Masa Ke Masa</Text>
</Box>
<SimpleGrid
cols={{
base: 1,
md: 3,
}}
>
{data.map((v, k) => {
return (
<Box key={k}>
<Paper mb={50} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Box>
<Center>
<Image src={v.foto} alt='' />
</Center>
</Box>
<Box>
<Stack gap={"sm"} py={10}>
<Text ta={"center"} fw={"bold"} fz={{ base: "h3", md: "h3" }}>{v.nama}</Text>
<Text ta={"center"} fz={{ base: "h5", md: "h4" }}>{v.wilayah}</Text>
<Text ta={"center"} fz={{ base: "h5", md: "h4" }}>{v.periode}</Text>
</Stack>
</Box>
</Paper>
</Box>
)
})
}
</SimpleGrid>
</Stack>
</Box>
);
}
export default SemuaPerbekel;

4
src/app/darmasaba/(tambahan)/apbdesa/page.tsx
View File

@@ -44,8 +44,8 @@ const data = [
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
APBDes
@@ -59,7 +59,7 @@ function Page() {
</Stack>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
cols={{
base: 1,
sm: 3,

4
src/app/darmasaba/(tambahan)/desaantikorupsi/(detail)/lokal/page.tsx
View File

@@ -21,8 +21,8 @@ const data = [
function Lokal() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"} ta={"center"}>
Kearifan Lokal
@@ -36,7 +36,7 @@ function Lokal() {
</Stack>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
cols={{
base: 1,
sm: 2,

4
src/app/darmasaba/(tambahan)/desaantikorupsi/(detail)/partisipasi/page.tsx
View File

@@ -23,8 +23,8 @@ const data = [
function Partisipasi() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"} ta={"center"}>
Penguatan Tata Laksana
@@ -38,7 +38,7 @@ function Partisipasi() {
</Stack>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
cols={{
base: 1,
sm: 2,

4
src/app/darmasaba/(tambahan)/desaantikorupsi/(detail)/pelayanan/page.tsx
View File

@@ -36,8 +36,8 @@ const data = [
function Pelayanan() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"} ta={"center"}>
Penguatan Kualitas Pelayanan Publik
@@ -51,7 +51,7 @@ function Pelayanan() {
</Stack>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
cols={{
base: 1,
sm: 2,

4
src/app/darmasaba/(tambahan)/desaantikorupsi/(detail)/pengawasan/page.tsx
View File

@@ -26,8 +26,8 @@ const data = [
function Pengawasan() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"} ta={"center"}>
Penguatan Pengawasan
@@ -41,7 +41,7 @@ function Pengawasan() {
</Stack>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
cols={{
base: 1,
sm: 2,

4
src/app/darmasaba/(tambahan)/desaantikorupsi/(detail)/tatalaksana/page.tsx
View File

@@ -38,8 +38,8 @@ const data = [
function Tatalaksana() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"} ta={"center"}>
Penguatan Tata Laksana
@@ -53,7 +53,7 @@ function Tatalaksana() {
</Stack>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
cols={{
base: 1,
sm: 2,

4
src/app/darmasaba/(tambahan)/desaantikorupsi/page.tsx
View File

@@ -36,8 +36,8 @@ function Page() {
const router = useRouter();
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Desa Anti Korupsi
@@ -51,7 +51,7 @@ function Page() {
</Stack>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
cols={{
base: 1,
sm: 2,

19
src/app/darmasaba/(tambahan)/penghargaan/detail/lomba1/page.tsx
View File

@@ -1,14 +1,16 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Text, Image, ActionIcon, Box, Divider, Flex } from '@mantine/core';
import { Stack, Container, Text, Image, ActionIcon, Box, Divider, Flex, Group } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={32}>
<Group px={{ base: "md", md: 100 }}>
<BackButton />
</Group>
<Container w={{ base: "100%", md: "50%" }}>
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Juara 2
@@ -20,9 +22,12 @@ function Page() {
Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
</Text>
<Image py={20} src={"/api/img/penghargaan-2.png"} alt='' />
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text
py={20}
ta={"justify"}
pb={20}
ta={"center"}
fw={"bold"}
>
Desa Dramasaba Raih Juara 2 dalam Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
@@ -60,7 +65,6 @@ function Page() {
>
Dengan prestasi ini, diharapkan Desa Dramasaba dapat menjadi contoh bagi desa-desa lain dalam memanfaatkan media digital sebagai sarana promosi dan pengembangan potensi lokal.
</Text>
</Stack>
<Box py={20}>
<Divider />
<Flex justify={"space-between"} py={20}>
@@ -84,7 +88,8 @@ function Page() {
</Flex>
<Divider pb={50} />
</Box>
</Container>
</Box>
</Stack >
);
}

18
src/app/darmasaba/(tambahan)/penghargaan/detail/lomba2/page.tsx
View File

@@ -1,14 +1,16 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Text, Image, ActionIcon, Box, Divider, Flex } from '@mantine/core';
import { Stack, Container, Text, Image, ActionIcon, Box, Divider, Flex, Group } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={32}>
<Group px={{ base: "md", md: 100 }}>
<BackButton />
</Group>
<Container w={{ base: "100%", md: "50%" }}>
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Juara 2
@@ -20,9 +22,12 @@ function Page() {
Duta Invenstasi Kabupaten Badung 2024
</Text>
<Image py={20} src={"/api/img/penghargaan-3.png"} alt='' />
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text
py={20}
ta={"justify"}
pb={20}
ta={"center"}
fw={"bold"}
>
Desa Dramasaba Raih Juara 2 dalam Duta Invenstasi Kabupaten Badung 2024
@@ -60,7 +65,6 @@ function Page() {
>
Dengan prestasi ini, diharapkan Desa Dramasaba dapat menjadi contoh bagi desa-desa lain dalam memanfaatkan media digital sebagai sarana promosi dan pengembangan potensi lokal.
</Text>
</Stack>
<Box py={20}>
<Divider />
<Flex justify={"space-between"} py={20}>
@@ -84,7 +88,7 @@ function Page() {
</Flex>
<Divider pb={50} />
</Box>
</Container>
</Box>
</Stack>
);
}

17
src/app/darmasaba/(tambahan)/penghargaan/detail/lomba3/page.tsx
View File

@@ -6,9 +6,11 @@ import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={32}>
<Box px={{ base: "md", md: 100 }}>
<BackButton />
</Box>
<Container w={{ base: "100%", md: "50%" }}>
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Juara Favorit
@@ -20,9 +22,12 @@ function Page() {
Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
</Text>
<Image py={20} src={"/api/img/penghargaan-1.png"} alt='' />
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text
py={20}
ta={"justify"}
pb={20}
ta={"center"}
fw={"bold"}
>
Desa Dramasaba Raih Juara Favorit dalam Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
@@ -60,7 +65,7 @@ function Page() {
>
Dengan prestasi ini, diharapkan Desa Dramasaba dapat menjadi contoh bagi desa-desa lain dalam memanfaatkan media digital sebagai sarana promosi dan pengembangan potensi lokal.
</Text>
</Stack>
<Box py={20}>
<Divider />
<Flex justify={"space-between"} py={20}>
@@ -84,7 +89,7 @@ function Page() {
</Flex>
<Divider pb={50} />
</Box>
</Container>
</Box>
</Stack>
);
}

4
src/app/darmasaba/(tambahan)/penghargaan/page.tsx
View File

@@ -56,8 +56,10 @@ const data = [
export default function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<Box px={{ base: "md", md: 100 }}>
<BackButton />
</Box>
<Container w={{ base: "100%", md: "50%" }}>
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Penghargaan

40
src/app/darmasaba/(tambahan)/prestasi/(detail)/hukum/page.tsx
View File

@@ -1,14 +1,15 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Box, Text, Image } from '@mantine/core';
import { Stack, Container, Box, Text, Image, ActionIcon, Divider, Flex } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{base: "md", md: 0}}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Juara 3 dalam Lomba Keluarga Sadar Hukum Kabupaten Badung Tahun 2024
@@ -22,21 +23,40 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/prestasilombahukum.png" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Dengan bangga, KADARKUM Desa Darmasaba berhasil meraih Juara 3 dalam Lomba Keluarga Sadar Hukum Kabupaten Badung Tahun 2024.
</Text>
<Text fz={{base: "sm", md: "lg"}} ta={"justify"}>
Prestasi ini tidak lepas dari dukungan penuh dan semangat tinggi dari Ida Bagus Surya Prabhawa Manuaba, S.H., M.H., NL.P. selaku Perbekel Darmasaba yang selalu mendampingi dari proses pelatihan hingga perlombaan, serta turut hadir perwakilan Kecamatan Abiansemal, Ketua BPD Desa Darmasaba, Ketua TP PKK Desa Darmasaba, Perangkat & Staf Desa Darmasaba, Karang Taruna Paramartha Dharma Desa Darmasaba dan seluruh Tim Sukses KADARKUM Desa Darmasaba.
</Text>
<Text py={20} fz={{base: "sm", md: "lg"}} ta={"justify"}>
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Acara yang berlangsung pada 14 November 2024 di Kertha Gosana Lt. 3 Pusat Pemerintahan Kabupaten Badung ini menjadi bukti nyata bahwa kerja keras dan kolaborasi adalah kunci keberhasilan.
</Text>
<Text fz={{base: "sm", md: "lg"}} ta={"justify"}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Bersama, kita terus wujudkan Desa Darmasaba yang sadar hukum dan berprestasi!
</Text>
</Container>
<Divider color={colors["blue-button"]} />
<Flex justify={"space-between"} py={20}>
<Text fz={'md'}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={colors["blue-button"]} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider color={colors["blue-button"]} pb={50} />
</Box>
</Stack>
);
}

64
src/app/darmasaba/(tambahan)/prestasi/(detail)/mangupura/page.tsx Normal file
View File

@@ -0,0 +1,64 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Box, Text, Image, ActionIcon, Divider, Flex } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Peringkat 5 Dalam Ajang Bergengsi Mangupura Award
</Text>
<Text
ta={"center"}
fw={"bold"}
fz={"1.5rem"}
>
Tata Kelola dan Inovasi Desa
</Text>
</Box>
<Image src="/api/img/prestasi-peringkat-5.jpeg" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Pada hari Senin, 18 November 2024, Desa Darmasaba kembali mencetak prestasi gemilang dengan meraih peringkat V dalam ajang bergengsi Mangupura Award. Penganugerahan ini berlangsung dalam rangkaian acara HUT Kota Mangupura ke-15 yang dihadiri oleh Drs. I Ketut Suiasa, S.H., Plt Bupati Badung, serta para tokoh penting lainnya.
</Text>
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Penghargaan ini bukan hanya sebuah pengakuan, tetapi juga menjadi motivasi bagi Desa Darmasaba untuk terus meningkatkan inovasi, pelayanan, pembangunan serta transformasi digital.
Mari bersama kita lanjutkan semangat kolaborasi dan inovasi untuk menjadikan Darmasaba sebagai desa yang semakin unggul dan inspiratif!
</Text>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Bersama, kita terus wujudkan Desa Darmasaba yang sadar hukum dan berprestasi!
</Text>
<Divider color={colors["blue-button"]} />
<Flex justify={"space-between"} py={20}>
<Text fz={'md'}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={colors["blue-button"]} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider color={colors["blue-button"]} pb={50} />
</Box>
</Stack>
);
}
export default Page;

38
src/app/darmasaba/(tambahan)/prestasi/(detail)/voli/page.tsx
View File

@@ -1,12 +1,13 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Box, Text, Image } from '@mantine/core';
import { Stack, Container, Box, Text, Image, ActionIcon, Divider, Flex } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} px={{base: "md", md: 0}}>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Juara 3 Turnamen Bola Voli Mangupura Cup 2024
@@ -20,19 +21,40 @@ function Page() {
</Text>
</Box>
<Image src="/api/img/prestasi-voli.jpeg" alt='' w={"100%"} />
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Selamat kepada Tim Bola Voli Putri Dharma Temaja yang berhasil meraih juara 3 dalam Turnamen Bola Voli Mangupura Cup 2024 kategori Putri Se-Bali.
</Text>
<Text fz={{base: "sm", md: "lg"}} ta={"justify"}>
Perjuangan luar biasa yang ditunjukkan oleh tim ini merupakan bukti nyata kerja keras, kekompakan, dan semangat pantang menyerah. Dalam kompetisi yang diikuti oleh tim-tim terbaik dari seluruh Bali, Tim Dharma Temaja berhasil menunjukkan performa yang menginspirasi dan mengharumkan nama desa.
</Text>
<Text py={20} fz={{base: "sm", md: "lg"}} ta={"justify"}>
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Terima kasih kepada seluruh pemain, pelatih, serta pendukung yang selalu memberikan dukungan penuh di setiap pertandingan. Kemenangan ini adalah awal dari perjalanan yang lebih besar, dan semoga prestasi ini dapat terus memotivasi kita untuk mencapai hasil yang lebih gemilang di masa depan.
</Text>
<Text fz={{base: "sm", md: "lg"}} ta={"justify"}>
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
Mari kita terus dukung Tim Bola Voli Putri Dharma Temaja agar semakin bersinar di ajang-ajang berikutnya
</Text>
</Container>
<Divider color={colors["blue-button"]} />
<Flex justify={"space-between"} py={20}>
<Text fz={'md'}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={colors["blue-button"]} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider color={colors["blue-button"]} pb={50} />
</Box>
</Stack>
);
}

12
src/app/darmasaba/(tambahan)/prestasi/page.tsx
View File

@@ -24,28 +24,24 @@ const data = [
title: "Tata Kelola dan Inovasi Desa",
description: "Peringkat 5 Dalam Ajang Bergengsi Mangupura Award",
image: "/api/img/prestasi-peringkat-5.jpeg",
link: "/darmasaba/desa/prestasi/lomba-hukum"
link: "/darmasaba/desa/prestasi/mangupura"
}
]
function Page() {
const router = useRouter();
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} >
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<Box px={"lg"}>
<BackButton />
<Box>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Prestasi Desa
</Text>
<Text ta={"center"} py={10}>
Temukan berbagai prestasi dan keunggulan yang dimiliki Desa Darmasaba.
</Text>
</Box>
</Box>
</Container>
<SimpleGrid
px={50}
px={{ base: "md", md: 100 }}
pb={20}
cols={{
base: 1,

9
src/app/darmasaba/(tambahan)/sdgsdesa/page.tsx
View File

@@ -7,12 +7,15 @@ import BackButton from '../../(pages)/desa/layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} py={"xl"} gap={22}>
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
SDGs Desa
</Text>
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<Text
py={10}
ta={"justify"}
@@ -21,12 +24,10 @@ function Page() {
</Text>
<Text
ta={"justify"}
pb={20}
>
SDGs Desa sebagaimana dijabarkan dalam Permendesa Nomor 21 tahun 2020 terdiri dari 18 tujuan yang harus dicapai pada tahun 2030. Tujuan-tujuan tersebut mencakup berbagai aspek kehidupan masyarakat desa, mulai dari pengentasan kemiskinan, peningkatan kesehatan dan pendidikan, kesetaraan gender, pertumbuhan ekonomi, infrastruktur, hingga kelestarian lingkungan. Adapun SDGs Desa terdiri dari tujuan-tujuan sebagai berikut:
</Text>
</Stack>
</Container>
<Box p={20}>
<Center>
<Image src={"/api/img/sdgsdesa-18-removebg.png"} alt='' w={800} />
</Center>

2
src/app/darmasaba/_com/main-page/prestasi/index.tsx
View File

@@ -22,7 +22,7 @@ const data = [
title: "Tata Kelola dan Inovasi Desa",
deskripsi: "Peringkat 5 Dalam Ajang Bergengsi Mangupura Award",
image: "/api/img/prestasi-peringkat-5.jpeg",
link: "/darmasaba/desa/prestasi/lomba-hukum"
link: "/darmasaba/prestasi/mangupura"
}
]
function Prestasi() {

2
src/con/colors.ts
View File

@@ -1,6 +1,7 @@
const colors = {
"orange": "#FCAE00",
"blue-button": "#0A4E78",
"blue-button-trans": "#628EC6",
"white-1": "#FBFBFC",
"white-trans-1": "rgba(255, 255, 255, 0.5)",
"white-trans-2": "rgba(255, 255, 255, 0.7)",
@@ -18,6 +19,7 @@ const colors = {
"2": "#CBCACD"
},
"Bg": "#D1d9e8",
"BG-trans": "#B1C5F2",
}