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

QC Kak Inno 27 Oct

Browse Source 
QC Kak Ayu 27 Oct
QC Keano 27 Oct
QC Pak Jun 27 Oct
This commit is contained in:
nico
2025-10-28 17:34:38 +08:00
parent ed371bd0d9
commit a6663bbcee
27 changed files with 629 additions and 337 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/app/darmasaba/(pages)/pendidikan/beasiswa-desa/page.tsx
View File

@@ -1,13 +1,13 @@
'use client'
import beasiswaDesaState from '@/app/admin/(dashboard)/_state/pendidikan/beasiswa-desa';
import colors from '@/con/colors';
import { Box, Button, Center, Group, Image, Modal, Pagination, Paper, Select, SimpleGrid, Skeleton, Stack, Stepper, StepperStep, Text, TextInput, Title } from '@mantine/core';
import { Box, Button, Center, Group, Image, Modal, Pagination, Paper, Select, SimpleGrid, Skeleton, Stack, Stepper, Text, TextInput, Title } from '@mantine/core';
import { useDisclosure, useShallowEffect } from '@mantine/hooks';
import { IconArrowRight, IconCoin, IconInfoCircle, IconSchool, IconUsers } from '@tabler/icons-react';
import { useTransitionRouter } from 'next-view-transitions';
import { useState } from 'react';
import { useProxy } from 'valtio/utils';
import BackButton from '../../desa/layanan/_com/BackButto';
import { useTransitionRouter } from 'next-view-transitions';
const dataBeasiswa = [
{ id: 1, nama: 'Penerima Beasiswa', jumlah: '250+', icon: IconUsers },
@@ -27,7 +27,7 @@ function Page() {
tempatLahir: "",
tanggalLahir: "",
jenisKelamin: "",
kewarganegaraan: "",
kewarganegaraan: "WNI",
agama: "",
alamatKTP: "",
alamatDomisili: "",
@@ -50,9 +50,21 @@ function Page() {
close();
};
const timeline = [
{ label: "1 Maret 2025", desc: "Pembukaan Pendaftaran", date: new Date("2025-03-01") },
{ label: "15 Maret 2025", desc: "Seleksi Administrasi", date: new Date("2025-03-15") },
{ label: "1 April 2025", desc: "Tes Potensi Akademik", date: new Date("2025-04-01") },
{ label: "15 April 2025", desc: "Wawancara", date: new Date("2025-04-15") },
{ label: "1 Mei 2025", desc: "Pengumuman Hasil", date: new Date("2025-05-01") },
];
const [active, setActive] = useState(1);
const nextStep = () => setActive((current) => (current < 5 ? current + 1 : current));
const prevStep = () => setActive((current) => (current > 0 ? current - 1 : current));
useShallowEffect(() => {
const today = new Date();
// cari berapa banyak tanggal yang sudah lewat
const doneSteps = timeline.filter(item => today >= item.date).length;
setActive(doneSteps); // active step diset sesuai tanggal
}, []);
if (loading || !data) {
return (
@@ -115,7 +127,7 @@ function Page() {
{data.map((v, k) => (
<Paper key={k} p="xl" radius="xl" shadow="sm" bg={colors['white-trans-1']}>
<Title order={3} fw={700} c={colors['blue-button']} mb="xs">{v.judul}</Title>
<Text fz="sm" c="dimmed" style={{ wordBreak: "break-word", whiteSpace: "normal" }} dangerouslySetInnerHTML={{ __html: v.deskripsi }}/>
<Text fz="sm" c="dimmed" style={{ wordBreak: "break-word", whiteSpace: "normal" }} dangerouslySetInnerHTML={{ __html: v.deskripsi }} />
</Paper>
))}
</SimpleGrid>
@@ -139,19 +151,22 @@ function Page() {
Timeline Pendaftaran
</Title>
<Center>
<Stepper mt={20} active={active} onStepClick={setActive} orientation="vertical" allowNextStepsSelect={false}>
<StepperStep label="1 Maret 2025" description="Pembukaan Pendaftaran" />
<StepperStep label="15 Maret 2025" description="Seleksi Administrasi" />
<StepperStep label="1 April 2025" description="Tes Potensi Akademik" />
<StepperStep label="15 April 2025" description="Wawancara" />
<StepperStep label="1 Mei 2025" description="Pengumuman Hasil" />
<Stepper
mt={20}
active={active}
onStepClick={setActive}
orientation="vertical"
allowNextStepsSelect={false}
>
{timeline.map((item, index) => (
<Stepper.Step
key={index}
label={item.label}
description={item.desc}
/>
))}
</Stepper>
</Center>
<Group justify="center" mt="xl">
<Button variant="default" radius="xl" onClick={prevStep}>Kembali</Button>
<Button radius="xl" bg={colors['blue-button']} onClick={nextStep}>Lanjut</Button>
</Group>
</Box>
<Modal
@@ -194,7 +209,11 @@ function Page() {
<TextInput
label="Kewarganegaraan"
placeholder="Masukkan kewarganegaraan"
onChange={(val) => { beasiswaDesa.create.form.kewarganegaraan = val.target.value }} />
value={beasiswaDesa.create.form.kewarganegaraan || "WNI"} // tampilkan WNI kalau kosong
onChange={(e) => {
beasiswaDesa.create.form.kewarganegaraan = e.target.value;
}}
/>
<Select
label="Agama"
placeholder="Pilih agama"

47
src/app/darmasaba/(pages)/pendidikan/beasiswa-desa/pelajari-lebih-lanjut/page.tsx
View File

@@ -34,7 +34,7 @@ export default function BeasiswaPage() {
tempatLahir: "",
tanggalLahir: "",
jenisKelamin: "",
kewarganegaraan: "",
kewarganegaraan: "WNI",
agama: "",
alamatKTP: "",
alamatDomisili: "",
@@ -71,7 +71,7 @@ export default function BeasiswaPage() {
<Stack gap="md" maw={600}>
<Group>
<IconSchool size={30} color={colors["blue-button"]} />
<Title order={2}>Program Beasiswa Pendidikan Desa Darmasaba</Title>
<Title order={2} c={colors["blue-button"]}>Program Beasiswa Pendidikan Desa Darmasaba</Title>
</Group>
<Text>
Program ini bertujuan untuk mendukung pendidikan generasi muda di Desa Darmasaba
@@ -84,7 +84,7 @@ export default function BeasiswaPage() {
<Container size="lg" py="xl">
<Group mb="sm">
<IconInfoCircle size={24} color={colors["blue-button"]} />
<Title order={3}>Tentang Program</Title>
<Title order={3} c={colors["blue-button"]}>Tentang Program</Title>
</Group>
<Text>
Program Beasiswa Desa Darmasaba adalah inisiatif pemerintah desa untuk meningkatkan akses
@@ -94,12 +94,11 @@ export default function BeasiswaPage() {
{/* Tambahkan info tahun berjalan di sini */}
<Paper mt="md" p="md" radius="lg" shadow="xs" bg="#f8fbff" withBorder>
<Text fw={500} c={colors["blue-button"]}>
📅 Periode Beasiswa Tahun 2025
<Text fw={500}>
Periode Beasiswa Tahun 2025
</Text>
<Text fz="sm" c="dimmed">
Pendaftaran beasiswa dibuka mulai <strong>1 Januari 2025</strong> dan ditutup pada
<strong>31 Mei 2025</strong>.
Pendaftaran beasiswa dibuka mulai <strong>1 Januari 2025</strong> dan ditutup pada <strong>31 Mei 2025</strong>.
Pengumuman hasil seleksi akan diumumkan pada pertengahan Juni 2025 melalui website resmi Desa Darmasaba.
</Text>
</Paper>
@@ -109,7 +108,7 @@ export default function BeasiswaPage() {
<Container size="lg" py="xl">
<Group mb="sm">
<IconChecklist size={24} color={colors["blue-button"]} />
<Title order={3}>Syarat Pendaftaran</Title>
<Title order={3} c={colors["blue-button"]}>Syarat Pendaftaran</Title>
</Group>
<SimpleGrid cols={{ base: 1, sm: 2, md: 3 }} spacing="lg">
@@ -140,7 +139,7 @@ export default function BeasiswaPage() {
<Container size="lg" py="xl">
<Group mb="sm">
<IconTimeline size={24} color={colors["blue-button"]} />
<Title order={3}>Proses Seleksi</Title>
<Title order={3} c={colors["blue-button"]}>Proses Seleksi</Title>
</Group>
<Timeline active={4} bulletSize={24} lineWidth={2}>
@@ -148,8 +147,8 @@ export default function BeasiswaPage() {
<Text c="dimmed" size="sm">
Calon peserta mengisi formulir pendaftaran dan mengunggah dokumen pendukung.
</Text>
<Text size="sm" fw={500} c={colors["blue-button"]} mt={4}>
⏰ Estimasi waktu: 1 Februari – 31 Mei 2025
<Text size="sm" fw={500} mt={4}>
Estimasi waktu: 1 Februari – 31 Mei 2025
</Text>
</Timeline.Item>
@@ -157,8 +156,8 @@ export default function BeasiswaPage() {
<Text c="dimmed" size="sm">
Panitia memverifikasi kelengkapan dan validitas berkas.
</Text>
<Text size="sm" fw={500} c={colors["blue-button"]} mt={4}>
⏰ Estimasi waktu: 5–7 hari kerja setelah penutupan pendaftaran
<Text size="sm" fw={500} mt={4}>
Estimasi waktu: 5–7 hari kerja setelah penutupan pendaftaran
</Text>
</Timeline.Item>
@@ -166,8 +165,8 @@ export default function BeasiswaPage() {
<Text c="dimmed" size="sm">
Peserta yang lolos administrasi akan diundang untuk wawancara langsung dengan tim seleksi.
</Text>
<Text size="sm" fw={500} c={colors["blue-button"]} mt={4}>
⏰ Estimasi waktu: 7–10 hari kerja setelah pengumuman seleksi administrasi
<Text size="sm" fw={500} mt={4}>
Estimasi waktu: 7–10 hari kerja setelah pengumuman seleksi administrasi
</Text>
</Timeline.Item>
@@ -175,14 +174,14 @@ export default function BeasiswaPage() {
<Text c="dimmed" size="sm">
Daftar penerima beasiswa diumumkan melalui website resmi Desa Darmasaba.
</Text>
<Text size="sm" fw={500} c={colors["blue-button"]} mt={4}>
⏰ Estimasi waktu: 5 hari kerja setelah tahap wawancara selesai
<Text size="sm" fw={500} mt={4}>
Estimasi waktu: 5 hari kerja setelah tahap wawancara selesai
</Text>
</Timeline.Item>
</Timeline>
<Text c="dimmed" size="sm" mt="lg" ta="center">
🗓️ Total estimasi keseluruhan proses: sekitar 3–4 minggu setelah penutupan pendaftaran
Total estimasi keseluruhan proses: sekitar 3–4 minggu setelah penutupan pendaftaran
</Text>
</Container>
@@ -191,7 +190,7 @@ export default function BeasiswaPage() {
<Container size="lg" py="xl">
<Group mb="sm">
<IconQuote size={24} color={colors["blue-button"]} />
<Title order={3}>Cerita Sukses Penerima Beasiswa</Title>
<Title order={3} c={colors["blue-button"]}>Cerita Sukses Penerima Beasiswa</Title>
</Group>
<SimpleGrid cols={{ base: 1, sm: 2 }} spacing="lg">
@@ -219,12 +218,12 @@ export default function BeasiswaPage() {
<Container size="lg" py="xl" ta="center">
<Group justify="center" mb="sm">
<IconUserPlus size={28} color={colors["blue-button"]} />
<Title order={3}>Siap Bergabung dengan Program Ini?</Title>
<Title order={3} c={colors["blue-button"]}>Siap Bergabung dengan Program Ini?</Title>
</Group>
<Text c="dimmed" mb="md">
Segera daftar dan wujudkan mimpimu bersama Desa Darmasaba.
</Text>
<Button onClick={open} size="lg" radius="xl" color="blue">
<Button onClick={open} size="lg" radius="xl" bg={colors["blue-button"]}>
Daftar Sekarang
</Button>
</Container>
@@ -269,7 +268,11 @@ export default function BeasiswaPage() {
<TextInput
label="Kewarganegaraan"
placeholder="Masukkan kewarganegaraan"
onChange={(val) => { beasiswaDesa.create.form.kewarganegaraan = val.target.value }} />
value={beasiswaDesa.create.form.kewarganegaraan || "WNI"} // tampilkan WNI kalau kosong
onChange={(e) => {
beasiswaDesa.create.form.kewarganegaraan = e.target.value;
}}
/>
<Select
label="Agama"
placeholder="Pilih agama"

16
src/app/darmasaba/(pages)/pendidikan/bimbingan-belajar-desa/page.tsx
View File

@@ -1,10 +1,10 @@
'use client'
import stateBimbinganBelajarDesa from '@/app/admin/(dashboard)/_state/pendidikan/bimbingan-belajar-desa';
import colors from '@/con/colors';
import { Box, Paper, SimpleGrid, Skeleton, Stack, Text, Title, Tooltip, Divider, Badge, Group } from '@mantine/core';
import { Box, Divider, Group, Paper, SimpleGrid, Skeleton, Stack, Text, Title, Tooltip } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { IconBook2, IconCalendarTime, IconMapPin } from '@tabler/icons-react';
import { useProxy } from 'valtio/utils';
import { IconMapPin, IconCalendarTime, IconBook2 } from '@tabler/icons-react';
import BackButton from '../../desa/layanan/_com/BackButto';
function Page() {
@@ -55,9 +55,9 @@ function Page() {
<IconBook2 size={36} stroke={1.5} color={colors['blue-button']} />
</Box>
</Tooltip>
<Badge variant="gradient" gradient={{ from: colors['blue-button'], to: 'cyan' }} size="lg" radius="sm" mb="sm">
<Title order={3} fw={700} c={colors['blue-button']} mb="xs">
{stateTujuanProgram.findById.data?.judul}
</Badge>
</Title>
</Group>
<Text fz="md" style={{wordBreak: "break-word", whiteSpace: "normal"}} lh={1.6} dangerouslySetInnerHTML={{ __html: stateTujuanProgram.findById.data?.deskripsi }} />
</Stack>
@@ -70,9 +70,9 @@ function Page() {
<IconMapPin size={36} stroke={1.5} color={colors['blue-button']} />
</Box>
</Tooltip>
<Badge variant="gradient" gradient={{ from: colors['blue-button'], to: 'cyan' }} size="lg" radius="sm" mb="sm">
<Title order={3} fw={700} c={colors['blue-button']} mb="xs">
{stateLokasiDanJadwal.findById.data?.judul}
</Badge>
</Title>
</Group>
<Text fz="md" lh={1.6} style={{wordBreak: "break-word", whiteSpace: "normal"}} dangerouslySetInnerHTML={{ __html: stateLokasiDanJadwal.findById.data?.deskripsi }} />
</Stack>
@@ -85,9 +85,9 @@ function Page() {
<IconCalendarTime size={36} stroke={1.5} color={colors['blue-button']} />
</Box>
</Tooltip>
<Badge variant="gradient" gradient={{ from: colors['blue-button'], to: 'cyan' }} size="lg" radius="sm" mb="sm">
<Title order={3} fw={700} c={colors['blue-button']} mb="xs">
{stateFasilitas.findById.data?.judul}
</Badge>
</Title>
</Group>
<Text fz="md" lh={1.6} style={{wordBreak: "break-word", whiteSpace: "normal"}} dangerouslySetInnerHTML={{ __html: stateFasilitas.findById.data?.deskripsi }} />
</Stack>

165
src/app/darmasaba/(pages)/pendidikan/info-sekolah/[jenjangPendidikan]/content.tsx
View File

@@ -1,6 +1,7 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
'use client';
import infoSekolahPaud from '@/app/admin/(dashboard)/_state/pendidikan/info-sekolah-paud';
import colors from '@/con/colors';
import { Box, Button, Center, Container, Group, Paper, SimpleGrid, Skeleton, Stack, Text, Tooltip, ActionIcon } from '@mantine/core';
import { IconChalkboard, IconMicroscope, IconProps, IconRefresh, IconSchool, IconInfoCircle } from '@tabler/icons-react';
import { motion } from 'framer-motion';
@@ -23,19 +24,19 @@ export default function KategoriPage({ jenjangPendidikan }: { jenjangPendidikan:
const router = useTransitionRouter();
const [stats, setStats] = useState<Stat[]>([]);
const [isLoading, setIsLoading] = useState(true);
// Decode the URL parameter
const decodedJenjangPendidikan = decodeURIComponent(jenjangPendidikan);
const jenjangFilter = decodedJenjangPendidikan.toLowerCase() === 'semua'
? undefined
const jenjangFilter = decodedJenjangPendidikan.toLowerCase() === 'semua'
? undefined
: decodedJenjangPendidikan;
const loadData = useCallback(async () => {
if (!decodedJenjangPendidikan) return;
try {
setIsLoading(true);
// Load all data in parallel with the jenjang filter
await Promise.all([
infoSekolahPaud.lembagaPendidikan.findMany.load(1, 100, '', jenjangFilter),
@@ -50,7 +51,7 @@ export default function KategoriPage({ jenjangPendidikan }: { jenjangPendidikan:
setStats([
{
icon: IconChalkboard,
jumlah: totalLembaga,
nama: 'Lembaga Pendidikan',
@@ -119,11 +120,15 @@ export default function KategoriPage({ jenjangPendidikan }: { jenjangPendidikan:
</Text>
</Box>
<Button
leftSection={<IconRefresh size={16} />}
leftSection={<IconRefresh color={colors['blue-button']} size={16} />}
variant="outline"
size="xs"
onClick={handleRefresh}
loading={stats.some(stat => stat.loading)}
c={colors['blue-button']}
style={{
borderColor: colors['blue-button'],
}}
>
Segarkan Data
</Button>
@@ -143,7 +148,7 @@ export default function KategoriPage({ jenjangPendidikan }: { jenjangPendidikan:
aria-label="Tidak ada hasil"
>
<Center style={{ minHeight: 180, flexDirection: 'column' }}>
<Text fz="lg" fw={800} c="#2563eb">
<Text fz="lg" fw={800} c={colors['blue-button']}>
Tidak ditemukan
</Text>
<Text c="dimmed" mt="6px">
@@ -173,81 +178,81 @@ export default function KategoriPage({ jenjangPendidikan }: { jenjangPendidikan:
style={{ width: '100%' }}
>
<Skeleton visible={v.loading}>
<Paper
p="lg"
radius="lg"
style={{
background: 'white',
border: '1px solid #e2e8f0',
boxShadow: '0 8px 28px rgba(0,0,0,0.06)',
minHeight: 260,
}}
role="article"
aria-label={`${v.nama} kartu statistik`}
>
<Stack gap="sm" mb="md">
<Center>
<Box
style={{
width: 80,
height: 80,
borderRadius: 16,
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
background: '#eff6ff',
boxShadow: 'inset 0 1px 0 rgba(255,255,255,0.6)',
}}
aria-hidden
>
{React.createElement(v.icon, {
color: '#2563eb',
size: 34,
stroke: 1.6,
})}
</Box>
</Center>
<Paper
p="lg"
radius="lg"
style={{
background: 'white',
border: '1px solid #e2e8f0',
boxShadow: '0 8px 28px rgba(0,0,0,0.06)',
minHeight: 260,
}}
role="article"
aria-label={`${v.nama} kartu statistik`}
>
<Stack gap="sm" mb="md">
<Center>
<Box
style={{
width: 80,
height: 80,
borderRadius: 16,
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
background: '#eff6ff',
boxShadow: 'inset 0 1px 0 rgba(255,255,255,0.6)',
}}
aria-hidden
>
{React.createElement(v.icon, {
color: colors['blue-button'],
size: 34,
stroke: 1.6,
})}
</Box>
</Center>
<Group justify="center" align="center" gap="xs">
<Stack gap={0}>
<Text ta={"center"} fz={{ base: 18, md: 22 }} fw={800} c="#0f172a">
{v.jumlah.toLocaleString()}
</Text>
<Group gap={6} align="center">
<Text ta={"center"} fz="sm" fw={700} c="#2563eb">
{v.nama}
<Group justify="center" align="center" gap="xs">
<Stack gap={0}>
<Text ta={"center"} fz={{ base: 18, md: 22 }} fw={800} c="#0f172a">
{v.jumlah.toLocaleString()}
</Text>
<Tooltip label={v.helper ?? ''} position="right" withArrow>
<ActionIcon aria-label={`Info ${v.nama}`} variant="transparent" size="xs">
<IconInfoCircle size={16} style={{ color: '#2563eb' }} />
</ActionIcon>
</Tooltip>
</Group>
</Stack>
</Group>
</Stack>
<Group gap={6} align="center">
<Text ta={"center"} fz="sm" fw={700} c={colors['blue-button']}>
{v.nama}
</Text>
<Tooltip label={v.helper ?? ''} position="right" withArrow>
<ActionIcon aria-label={`Info ${v.nama}`} variant="transparent" size="xs">
<IconInfoCircle size={16} style={{ color: colors['blue-button'] }} />
</ActionIcon>
</Tooltip>
</Group>
</Stack>
</Group>
</Stack>
<Group justify="center" mt="8px">
<Button
radius="xl"
variant="outline"
aria-label={`Lihat detail ${v.nama}`}
style={{
borderColor: '#e2e8f0',
color: '#2563eb',
paddingLeft: 20,
paddingRight: 20,
}}
onClick={() => {
if (v.nama === "Lembaga Pendidikan") router.push(`/darmasaba/pendidikan/info-sekolah/${jenjangPendidikan}/lembaga`);
if (v.nama === "Siswa Terdaftar") router.push(`/darmasaba/pendidikan/info-sekolah/${jenjangPendidikan}/siswa`);
if (v.nama === "Tenaga Pengajar") router.push(`/darmasaba/pendidikan/info-sekolah/${jenjangPendidikan}/pengajar`);
}}
>
Lihat Detail
</Button>
</Group>
</Paper>
<Group justify="center" mt="8px">
<Button
radius="xl"
variant="outline"
aria-label={`Lihat detail ${v.nama}`}
style={{
borderColor: colors['blue-button'],
color: colors['blue-button'],
paddingLeft: 20,
paddingRight: 20,
}}
onClick={() => {
if (v.nama === "Lembaga Pendidikan") router.push(`/darmasaba/pendidikan/info-sekolah/${jenjangPendidikan}/lembaga`);
if (v.nama === "Siswa Terdaftar") router.push(`/darmasaba/pendidikan/info-sekolah/${jenjangPendidikan}/siswa`);
if (v.nama === "Tenaga Pengajar") router.push(`/darmasaba/pendidikan/info-sekolah/${jenjangPendidikan}/pengajar`);
}}
>
Lihat Detail
</Button>
</Group>
</Paper>
</Skeleton>
</motion.div>
))

2
src/app/darmasaba/(pages)/pendidikan/info-sekolah/_lib/layoutTabs.tsx
View File

@@ -185,6 +185,8 @@ export default function LayoutSekolah({
radius="xl"
size="sm"
variant={aktif ? 'filled' : 'light'}
bg={colors['blue-button']}
c={aktif ? colors['white-1'] : 'gray'}
>
{k}
</Button>

19
src/app/darmasaba/(pages)/pendidikan/info-sekolah/semua/page.tsx
View File

@@ -1,6 +1,7 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import infoSekolahPaud from '@/app/admin/(dashboard)/_state/pendidikan/info-sekolah-paud';
import colors from '@/con/colors';
import {
ActionIcon,
Box,
@@ -130,11 +131,15 @@ export default function SekolahPage() {
<Box>
<Group justify="start" mb="md">
<Button
leftSection={<IconRefresh size={16} />}
leftSection={<IconRefresh color={colors['blue-button']} size={16} />}
variant="outline"
size="xs"
onClick={handleRefresh}
loading={stats.some(stat => stat.loading)}
c={colors['blue-button']}
style={{
borderColor: colors['blue-button'],
}}
>
Segarkan Data
</Button>
@@ -154,7 +159,7 @@ export default function SekolahPage() {
aria-label="Tidak ada hasil"
>
<Center style={{ minHeight: 180, flexDirection: 'column' }}>
<Text fz="lg" fw={800} c="#2563eb">
<Text fz="lg" fw={800} c={colors['blue-button']}>
Tidak ditemukan
</Text>
<Text c="dimmed" mt="6px">
@@ -212,7 +217,7 @@ export default function SekolahPage() {
aria-hidden
>
{React.createElement(v.icon, {
color: '#2563eb',
color: colors['blue-button'],
size: 34,
stroke: 1.6,
})}
@@ -225,12 +230,12 @@ export default function SekolahPage() {
{v.jumlah.toLocaleString()}
</Text>
<Group gap={6} align="center">
<Text ta={"center"} fz="sm" fw={700} c="#2563eb">
<Text ta={"center"} fz="sm" fw={700} c={colors['blue-button']}>
{v.nama}
</Text>
<Tooltip label={v.helper ?? ''} position="right" withArrow>
<ActionIcon aria-label={`Info ${v.nama}`} variant="transparent" size="xs">
<IconInfoCircle size={16} style={{ color: '#2563eb' }} />
<IconInfoCircle size={16} style={{ color: colors['blue-button'] }} />
</ActionIcon>
</Tooltip>
</Group>
@@ -244,8 +249,8 @@ export default function SekolahPage() {
variant="outline"
aria-label={`Lihat detail ${v.nama}`}
style={{
borderColor: '#e2e8f0',
color: '#2563eb',
borderColor: colors['blue-button'],
color: colors['blue-button'],
paddingLeft: 20,
paddingRight: 20,
}}