nicoarya20/dashboard-noc-desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Konsisten Warna Bg

Browse Source
This commit is contained in:
nico
2026-03-25 16:46:59 +08:00
parent 5c09e7a0be
commit 366c08fbaa
13 changed files with 44 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/help-page.tsx
View File

@@ -155,7 +155,7 @@ const HelpPage = () => {
{stats.map((stat, index) => (
<HelpCard
key={index}
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
p="lg"
style={{
textAlign: "center",
@@ -180,7 +180,7 @@ const HelpPage = () => {
<Grid.Col span={{ base: 12, sm: 6, md: 4 }}>
<HelpCard
style={{ borderColor: dark ? "#141D34" : "white" }}
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
icon={<IconBook size={24} color="white" />}
title="Panduan Memulai"
h="100%"
@@ -210,7 +210,7 @@ const HelpPage = () => {
<Grid.Col span={{ base: 12, sm: 6, md: 4 }}>
<HelpCard
style={{ borderColor: dark ? "#141D34" : "white" }}
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
icon={<IconVideo size={24} color="white" />}
title="Video Tutorial"
h="100%"
@@ -240,7 +240,7 @@ const HelpPage = () => {
<Grid.Col span={{ base: 12, sm: 6, md: 4 }}>
<HelpCard
style={{ borderColor: dark ? "#141D34" : "white" }}
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
icon={<IconHelpCircle size={24} color="white" />}
title="FAQ"
h="100%"
@@ -272,7 +272,7 @@ const HelpPage = () => {
<Grid.Col span={{ base: 12, sm: 6, md: 4 }}>
<HelpCard
style={{ borderColor: dark ? "#141D34" : "white" }}
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
icon={<IconHeadphones size={24} color="white" />}
title="Hubungi Support"
h="100%"
@@ -307,7 +307,7 @@ const HelpPage = () => {
<Grid.Col span={{ base: 12, sm: 6, md: 4 }}>
<HelpCard
style={{ borderColor: dark ? "#141D34" : "white" }}
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
icon={<IconFileText size={24} color="white" />}
title="Dokumentasi"
h="100%"
@@ -339,7 +339,7 @@ const HelpPage = () => {
<Grid.Col span={{ base: 12, sm: 6, md: 4 }}>
<HelpCard
style={{ borderColor: dark ? "#141D34" : "white" }}
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
icon={<IconMessage size={24} color="white" />}
title="Jenna - Virtual Assistant"
h="100%"

20
src/components/keamanan-page.tsx
View File

@@ -126,7 +126,7 @@ const KeamananPage = () => {
p="md"
radius="md"
withBorder
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "white" }}
h="100%"
>
@@ -143,7 +143,7 @@ const KeamananPage = () => {
>
{kpi.value}
</Text>
<Text size="sm" c={dark ? "dark.3" : "dimmed"}>
<Text size="sm" c={dark ? "white" : "dimmed"}>
{kpi.title}
</Text>
</Group>
@@ -165,14 +165,14 @@ const KeamananPage = () => {
p="md"
radius="md"
withBorder
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "white" }}
h="100%"
>
<Title order={3} mb="md" c={dark ? "dark.0" : "black"}>
Peta Keamanan CCTV
</Title>
<Text size="sm" c={dark ? "dark.3" : "dimmed"} mb="md">
<Text size="sm" c={dark ? "white" : "dimmed"} mb="md">
Titik Lokasi CCTV
</Text>
@@ -228,13 +228,13 @@ const KeamananPage = () => {
{cctv.status === "active" ? "Online" : "Offline"}
</Badge>
</Group>
<Text size="sm" c={dark ? "dark.3" : "dimmed"}>
<Text size="sm" c={dark ? "white" : "dimmed"}>
{cctv.location}
</Text>
</Stack>
<Group gap="xs">
<IconClock size={16} stroke={1.5} />
<Text size="sm" c={dark ? "dark.3" : "dimmed"}>
<Text size="sm" c={dark ? "white" : "dimmed"}>
{cctv.lastSeen}
</Text>
</Group>
@@ -252,7 +252,7 @@ const KeamananPage = () => {
p="md"
radius="md"
withBorder
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "white" }}
h="100%"
>
@@ -287,19 +287,19 @@ const KeamananPage = () => {
<Group justify="space-between">
<Group gap="xs">
<IconMapPin size={16} stroke={1.5} />
<Text size="sm" c={dark ? "dark.3" : "dimmed"}>
<Text size="sm" c={dark ? "white" : "dimmed"}>
{report.location}
</Text>
</Group>
<Group gap="xs">
<IconClock size={16} stroke={1.5} />
<Text size="sm" c={dark ? "dark.3" : "dimmed"}>
<Text size="sm" c={dark ? "white" : "dimmed"}>
{report.reportedAt}
</Text>
</Group>
</Group>
<Text size="sm" c={dark ? "dark.3" : "dimmed"} mt="sm">
<Text size="sm" c={dark ? "white" : "dimmed"} mt="sm">
{report.date}
</Text>
</Card>

7
src/components/kinerja-divisi/activity-card.tsx
View File

@@ -1,4 +1,4 @@
import { Box, Card, Group, Progress, Text } from "@mantine/core";
import { Box, Card, Group, Progress, Text, useMantineColorScheme } from "@mantine/core";
interface ActivityCardProps {
title: string;
@@ -26,13 +26,16 @@ export function ActivityCard({
}
};
const { colorScheme } = useMantineColorScheme();
const dark = colorScheme === "dark";
return (
<Card
radius="xl"
p={0}
withBorder={false}
style={{
backgroundColor: "#F3F4F6",
backgroundColor: dark ? "#334155" : "white",
overflow: "hidden",
}}
>

14
src/components/sosial/beasiswa.tsx
View File

@@ -37,16 +37,16 @@ export const Beasiswa = ({ data }: BeasiswaProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
h={"100%"}
>
<Group justify="space-between" align="center">
<Stack gap={2}>
<Text size="sm" c={dark ? "dark.3" : "dimmed"} fw={500}>
<Text size="sm" c={dark ? "white" : "dimmed"} fw={500}>
Beasiswa Desa
</Text>
<Text size="xl" fw={700} c={dark ? "dark.0" : "#1e3a5f"}>
<Text size="xl" fw={700} c={dark ? "white" : "#1e3a5f"}>
Penerima: {displayData.penerima}
</Text>
</Stack>
@@ -61,14 +61,14 @@ export const Beasiswa = ({ data }: BeasiswaProps) => {
</Group>
<Stack gap="xs" mt="md">
<Group justify="space-between">
<Text c={dark ? "dark.3" : "dimmed"}>Dana Tersalurkan:</Text>
<Text fw={700} c={dark ? "dark.0" : "#1e3a5f"}>
<Text c={dark ? "white" : "dimmed"}>Dana Tersalurkan:</Text>
<Text fw={700} c={dark ? "white" : "#1e3a5f"}>
{displayData.dana}
</Text>
</Group>
<Group justify="space-between">
<Text c={dark ? "dark.3" : "dimmed"}>Tahun Ajaran:</Text>
<Text c={dark ? "dark.0" : "#1e3a5f"}>{displayData.tahunAjaran}</Text>
<Text c={dark ? "white" : "dimmed"}>Tahun Ajaran:</Text>
<Text c={dark ? "white" : "#1e3a5f"}>{displayData.tahunAjaran}</Text>
</Group>
</Stack>
</Card>

2
src/components/sosial/event-calendar.tsx
View File

@@ -53,7 +53,7 @@ export const EventCalendar = ({ data }: EventCalendarProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Title order={3} mb="md" c={dark ? "dark.0" : "#1e3a5f"}>

2
src/components/sosial/health-stats.tsx
View File

@@ -37,7 +37,7 @@ export const HealthStats = ({ data }: HealthStatsProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
h={"100%"}
>

2
src/components/sosial/pendidikan.tsx
View File

@@ -49,7 +49,7 @@ export const Pendidikan = ({ data }: PendidikanProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Title order={3} mb="md" c={dark ? "dark.0" : "#1e3a5f"}>

7
src/components/sosial/posyandu-schedule.tsx
View File

@@ -58,7 +58,7 @@ export const PosyanduSchedule = ({ data }: PosyanduScheduleProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Title order={3} mb="md" c={dark ? "dark.0" : "#1e3a5f"}>
@@ -73,14 +73,13 @@ export const PosyanduSchedule = ({ data }: PosyanduScheduleProps) => {
withBorder
bg={dark ? "#263852ff" : "#F1F5F9"}
style={{ borderColor: dark ? "#263852ff" : "#F1F5F9" }}
hoverable
>
<Group justify="space-between">
<Stack gap={0}>
<Text fw={600} c={dark ? "dark.0" : "#1e3a5f"}>
<Text fw={600} c={dark ? "white" : "#1e3a5f"}>
{item.nama}
</Text>
<Text size="sm" c={dark ? "dark.3" : "dimmed"}>
<Text size="sm" c={dark ? "white" : "dimmed"}>
{item.tanggal}
</Text>
</Stack>

6
src/components/sosial/summary-cards.tsx
View File

@@ -43,7 +43,7 @@ const SummaryCard = ({
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Group justify="space-between" align="center">
@@ -54,12 +54,12 @@ const SummaryCard = ({
<Text
size="xl"
fw={700}
c={highlight ? "red" : dark ? "dark.0" : "#1e3a5f"}
c={highlight ? "red" : dark ? "white" : "#1e3a5f"}
>
{value}
</Text>
{subtitle && (
<Text size="xs" c={dark ? "dark.4" : "gray.6"}>
<Text size="xs" c={dark ? "white" : "gray.6"}>
{subtitle}
</Text>
)}

2
src/components/umkm/produk-unggulan.tsx
View File

@@ -77,7 +77,7 @@ export const ProdukUnggulan = ({ data }: ProdukUnggulanProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Stack gap="lg">

2
src/components/umkm/sales-table.tsx
View File

@@ -108,7 +108,7 @@ export const SalesTable = ({ data, onDetailClick }: SalesTableProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Group justify="space-between" mb="md">

6
src/components/umkm/summary-cards.tsx
View File

@@ -54,7 +54,7 @@ const KpiCard = ({
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Group justify="space-between" align="center">
@@ -62,11 +62,11 @@ const KpiCard = ({
<Text size="sm" c={dark ? "dark.3" : "dimmed"} fw={500}>
{title}
</Text>
<Text size="xl" fw={700} c={dark ? "dark.0" : "#1e3a5f"}>
<Text size="xl" fw={700} c={dark ? "white" : "#1e3a5f"}>
{formatValue(value)}
</Text>
{subtitle && (
<Text size="xs" c={dark ? "dark.4" : "gray.6"}>
<Text size="xs" c={dark ? "white" : "gray.6"}>
{subtitle}
</Text>
)}

2
src/components/umkm/top-products.tsx
View File

@@ -84,7 +84,7 @@ export const TopProducts = ({ products }: TopProductsProps) => {
radius="xl"
withBorder
shadow="sm"
bg={dark ? "#141D34" : "white"}
bg={dark ? "#1E293B" : "white"}
style={{ borderColor: dark ? "#141D34" : "#e5e7eb" }}
>
<Title order={4} mb="md" c={dark ? "dark.0" : "#1e3a5f"}>