style : update skeleton

This commit is contained in:
lukman
2024-08-22 17:42:13 +08:00
parent 176ec5ec64
commit 4c63fcbf9a
11 changed files with 348 additions and 186 deletions

View File

@@ -0,0 +1,86 @@
import { ActionIcon, Box, Group, Skeleton } from '@mantine/core';
import React from 'react';
export default function SkeletonDetailProfile() {
return (
<Box p={20}>
<Group justify="space-between" grow py={5}>
<Group>
<ActionIcon
variant="light"
bg={"#DCEED8"}
size={28}
radius={100}
aria-label="icon"
>
<Skeleton height={20} width={40} />
</ActionIcon>
<Box>
<Skeleton height={18} width={80} />
</Box>
</Group>
<Box>
<Skeleton height={18} width={"100%"} />
</Box>
</Group>
<Group justify="space-between" grow py={5}>
<Group>
<ActionIcon
variant="light"
bg={"#DCEED8"}
size={28}
radius={100}
aria-label="icon"
>
<Skeleton height={20} width={40} />
</ActionIcon>
<Box>
<Skeleton height={18} width={80} />
</Box>
</Group>
<Box>
<Skeleton height={18} width={"100%"} />
</Box>
</Group>
<Group justify="space-between" grow py={5}>
<Group>
<ActionIcon
variant="light"
bg={"#DCEED8"}
size={28}
radius={100}
aria-label="icon"
>
<Skeleton height={20} width={40} />
</ActionIcon>
<Box>
<Skeleton height={18} width={80} />
</Box>
</Group>
<Box>
<Skeleton height={18} width={"100%"} />
</Box>
</Group>
<Group justify="space-between" grow py={5}>
<Group>
<ActionIcon
variant="light"
bg={"#DCEED8"}
size={28}
radius={100}
aria-label="icon"
>
<Skeleton height={20} width={40} />
</ActionIcon>
<Box>
<Skeleton height={18} width={80} />
</Box>
</Group>
<Box>
<Skeleton height={18} width={"100%"} />
</Box>
</Group>
</Box>
);
}