style : update style

src/module/_global/components/skeleton_list.tsx

@@ -0,0 +1,21 @@
+import { Box, Divider, Grid, Skeleton } from '@mantine/core';
+import React from 'react';
+
+export default function SkeletonList() {
+  return (
+    <div>
+      <Box>
+        <Grid p={10} align="center">
+          <Grid.Col span={2}>
+            <Skeleton w={50} h={50} radius={100} />
+          </Grid.Col>
+          <Grid.Col span={9}>
+            <Skeleton w={"80%"} h={20} />
+          </Grid.Col>
+        </Grid>
+      </Box>
+      <Divider my={2} />
+    </div >
+  );
+}
+

src/module/_global/components/skeleton_user.tsx

@@ -0,0 +1,22 @@
+import { Box, Divider, Grid, Skeleton } from '@mantine/core';
+import React from 'react';
+
+export default function SkeletonUser() {
+  return (
+    <div>
+      <Box>
+        <Grid p={10} align="center">
+          <Grid.Col span={2}>
+            <Skeleton w={50} h={50} radius={100} />
+          </Grid.Col>
+          <Grid.Col span={9}>
+            <Skeleton w={"50%"} h={20} />
+            <Skeleton mt={5} w={"30%"} h={10} />
+          </Grid.Col>
+        </Grid>
+      </Box>
+      <Divider my={10} />
+    </div>
+  );
+}
+

src/module/_global/index.ts

@@ -25,6 +25,8 @@ import ViewFilter from "./view/view_filter";
 import mtqq_client from "./bin/mqtt_client"
 import NotificationCustome from "./components/notification_custome";
 import { ScrollProvider } from "./components/scroll_provider";
+import SkeletonUser from "./components/skeleton_user";
+import SkeletonList from "./components/skeleton_list";
 
 export { WARNA };
 export { LayoutLogin };
@@ -58,3 +60,5 @@ export { ReloadButtonTop }
 export { NotificationCustome }
 export { ScrollProvider }
 export { currentScroll }
+export { SkeletonUser }
+export { SkeletonList }