style: update skelaton

This commit is contained in:
lukman
2024-08-23 14:12:01 +08:00
parent 6fef9ae028
commit f1121afee6
16 changed files with 756 additions and 278 deletions

View File

@@ -0,0 +1,60 @@
import { Box, Center, Grid, Group, SimpleGrid, Skeleton } from '@mantine/core';
import React from 'react';
export default function SkeletonDetailListTugasTask() {
return (
<Grid>
<Grid.Col span={"auto"}>
<Center>
<Skeleton width={30} height={30} radius={"md"} />
</Center>
</Grid.Col>
<Grid.Col span={10}>
<Box
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10,
}}
>
<Group>
<Skeleton width={25} height={25} radius={"md"} />
<Skeleton width={"50%"} height={20} radius={"md"} />
</Group>
</Box>
<Box>
<SimpleGrid cols={{ base: 2, sm: 2, lg: 2 }} mt={20}>
<Box>
<Skeleton width={"50%"} height={20} radius={"md"} />
<Group
bg={"white"}
mt={3}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Skeleton ml={5} width={"80%"} height={20} radius={"md"} />
</Group>
</Box>
<Box>
<Skeleton width={"50%"} height={20} radius={"md"} />
<Group
bg={"white"}
mt={3}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Skeleton ml={5} width={"80%"} height={20} radius={"md"} />
</Group>
</Box>
</SimpleGrid>
</Box>
</Grid.Col>
</Grid>
);
}

View File

@@ -2,6 +2,7 @@ import prisma from "./bin/prisma";
import { pwd_key_config } from "./bin/val_global";
import SkeletonDetailDiscussionComment from "./components/skeleton_detail_discussion_comment";
import SkeletonDetailDiscussionMember from "./components/skeleton_detail_discussion_member";
import SkeletonDetailListTugasTask from "./components/skeleton_detail_list_tugas_task";
import SkeletonDetailProfile from "./components/skeleton_detail_profile";
import SkeletonSingle from "./components/skeleton_single";
import { funUploadFile } from "./fun/upload-file";
@@ -28,4 +29,5 @@ export { SkeletonSingle }
export { SkeletonDetailDiscussionComment }
export { SkeletonDetailDiscussionMember }
export { funUploadFile }
export { SkeletonDetailProfile }
export { SkeletonDetailProfile }
export {SkeletonDetailListTugasTask}