## Deskripsi: - Perubahan tampilan notifikasi - Pin map sesuai logo - Pin map bisa custom ### No Issue
63 lines
1.4 KiB
TypeScript
63 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import {
|
|
AccentColor,
|
|
MainColor,
|
|
} from "@/app_modules/_global/color/color_pallet";
|
|
import {
|
|
Box,
|
|
Card,
|
|
Divider,
|
|
Group,
|
|
Skeleton,
|
|
Stack,
|
|
Text,
|
|
} from "@mantine/core";
|
|
|
|
export function ComponentNotifikasi_CardSkeleton() {
|
|
return (
|
|
<>
|
|
{Array.from(new Array(10)).map((e, i) => (
|
|
<Card
|
|
key={i}
|
|
py={30}
|
|
style={{
|
|
backgroundColor: MainColor.darkblue,
|
|
color: "gray",
|
|
border: `2px solid ${AccentColor.darkblue}`,
|
|
borderRadius: "10px 10px 10px 10px",
|
|
}}
|
|
mb={"xs"}
|
|
>
|
|
<Card.Section px={"lg"}>
|
|
<Stack>
|
|
<Group position="apart">
|
|
<Skeleton h={20} w={100} radius={"xl"} />
|
|
<Skeleton h={20} w={100} radius={"xl"} />
|
|
</Group>
|
|
<Divider color="gray" />
|
|
</Stack>
|
|
</Card.Section>
|
|
|
|
<Card.Section p={"lg"}>
|
|
<Stack>
|
|
<Skeleton h={20} radius={"xl"} />
|
|
<Skeleton h={20} radius={"xl"} />
|
|
</Stack>
|
|
</Card.Section>
|
|
|
|
<Card.Section px={"lg"}>
|
|
<Stack>
|
|
|
|
<Group position="apart">
|
|
<Skeleton h={20} w={100} radius={"xl"} />
|
|
<Skeleton h={20} w={100} radius={"xl"} />
|
|
</Group>
|
|
</Stack>
|
|
</Card.Section>
|
|
</Card>
|
|
))}
|
|
</>
|
|
);
|
|
}
|