wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style : update style

Browse Source
This commit is contained in:
lukman
2024-09-30 11:29:33 +08:00
parent c67b1b8a37
commit 75c5a0039d
4 changed files with 47 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/module/calender/ui/detail_event_division.tsx
View File

@@ -320,7 +320,7 @@ export default function DetailEventDivision() {
<Box <Box
key={i} key={i}
> >
<SkeletonList/> <SkeletonList />
</Box> </Box>
))} ))}
</Box> </Box>
@@ -365,7 +365,7 @@ export default function DetailEventDivision() {
lg: 1, lg: 1,
xl: 1, xl: 1,
}}> }}>
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
</Grid.Col> </Grid.Col>
<Grid.Col span={{ <Grid.Col span={{
base: 11, base: 11,
@@ -375,14 +375,11 @@ export default function DetailEventDivision() {
lg: 11, lg: 11,
xl: 11, xl: 11,
}}> }}>
<Flex justify='space-between' align={"center"}> <Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
<Flex direction={'column'} align="flex-start" justify="flex-start"> <Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
<Text lineClamp={1} pl={isMobile ? 35 : 40}>{v.name}</Text> style={{
<Text c={"#5A687D"} fz={14} lineClamp={1} pl={isMobile ? 35 : 40}> overflowWrap: "break-word"
{v.email} }}>{v.email}</Text>
</Text>
</Flex>
</Flex>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Box mt={10}> <Box mt={10}>

9
src/module/division_new/ui/information_division.tsx
View File

@@ -31,6 +31,7 @@ export default function InformationDivision() {
const roleLogin = useHookstate(globalRole) const roleLogin = useHookstate(globalRole)
const [isAdmin, setAdmin] = useState(false) const [isAdmin, setAdmin] = useState(false)
const isMobile = useMediaQuery('(max-width: 455px)'); const isMobile = useMediaQuery('(max-width: 455px)');
const isMobile2 = useMediaQuery("(max-width: 438px)");
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
async function getOneData() { async function getOneData() {
@@ -164,8 +165,8 @@ export default function InformationDivision() {
((roleLogin.get() != 'user' && roleLogin.get() != 'coadmin') || isAdmin) ? ((roleLogin.get() != 'user' && roleLogin.get() != 'coadmin') || isAdmin) ?
<Group align='center' onClick={() => router.push('/division/add-member/' + param.id)}> <Group align='center' onClick={() => router.push('/division/add-member/' + param.id)}>
<Avatar size={isMobile ? 'md' : 'lg'}> <Avatar size={'lg'}>
<AiOutlineUserAdd size={isMobile ? 25 : 30} color={tema.get().utama} /> <AiOutlineUserAdd size={30} color={tema.get().utama} />
</Avatar> </Avatar>
<Text fz={isMobile ? 14 : 16}>Tambah Anggota</Text> <Text fz={isMobile ? 14 : 16}>Tambah Anggota</Text>
</Group> </Group>
@@ -194,10 +195,10 @@ export default function InformationDivision() {
}} }}
> >
<Grid.Col span={1}> <Grid.Col span={1}>
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
</Grid.Col> </Grid.Col>
<Grid.Col span={8}> <Grid.Col span={8}>
<Text c={tema.get().utama} fw={"bold"} truncate="end" pl={isMobile ? 25 : 30} fz={isMobile ? 14 : 16}> <Text c={tema.get().utama} fw={"bold"} truncate="end" pl={isMobile2 ? 40 : 30} fz={isMobile ? 14 : 16}>
{v.name} {v.name}
</Text> </Text>
</Grid.Col> </Grid.Col>

34
src/module/project/ui/list_anggota_detail_project.tsx
View File

@@ -1,6 +1,6 @@
'use client' 'use client'
import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from '@/module/_global'; import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global';
import { Avatar, Box, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core'; import { Avatar, Box, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { funDeleteMemberProject, funGetOneProjectById } from '../lib/api_project'; import { funDeleteMemberProject, funGetOneProjectById } from '../lib/api_project';
import toast from 'react-hot-toast'; import toast from 'react-hot-toast';
@@ -24,6 +24,7 @@ export default function ListAnggotaDetailProject() {
const roleLogin = useHookstate(globalRole) const roleLogin = useHookstate(globalRole)
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
const [reason, setReason] = useState("") const [reason, setReason] = useState("")
const isMobile2 = useMediaQuery("(max-width: 438px)");
async function getOneDataCancel() { async function getOneDataCancel() {
try { try {
@@ -83,7 +84,7 @@ export default function ListAnggotaDetailProject() {
toast.error("Gagal menghapus anggota Kegiatan, coba lagi nanti"); toast.error("Gagal menghapus anggota Kegiatan, coba lagi nanti");
} }
} }
const isMobile = useMediaQuery('(max-width: 369px)'); const isMobile = useMediaQuery('(max-width: 369px)');
return ( return (
<Box pt={20}> <Box pt={20}>
@@ -107,7 +108,7 @@ const isMobile = useMediaQuery('(max-width: 369px)');
.fill(null) .fill(null)
.map((_, i) => ( .map((_, i) => (
<Box key={i}> <Box key={i}>
<SkeletonSingle /> <SkeletonList />
</Box> </Box>
)) ))
: :
@@ -123,19 +124,15 @@ const isMobile = useMediaQuery('(max-width: 369px)');
: setOpenDrawer(false) : setOpenDrawer(false)
}} }}
> >
<Grid.Col span={9}> <Grid.Col span={1}>
<Group> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> </Grid.Col>
<Box w={{ <Grid.Col span={8}>
base: isMobile ? 130 : 140, <Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
xl: 270 <Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
}}> style={{
<Flex direction={'column'} align="flex-start" justify="flex-start"> overflowWrap: "break-word"
<Text lineClamp={1} fz={isMobile ? 14 : 16}>{v.name}</Text> }}>{v.email}</Text>
<Text c={"#5A687D"} fz={isMobile ? 10 : 14} lineClamp={1}>{v.email}</Text>
</Flex>
</Box>
</Group>
</Grid.Col> </Grid.Col>
<Grid.Col span={3}> <Grid.Col span={3}>
<Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}> <Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
@@ -143,6 +140,9 @@ const isMobile = useMediaQuery('(max-width: 369px)');
</Text> </Text>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Box mt={10}>
<Divider my={10} />
</Box>
</Box> </Box>
); );
})} })}

36
src/module/task/ui/detail_list_anggota_task.tsx
View File

@@ -1,6 +1,6 @@
'use client' 'use client'
import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from "@/module/_global"; import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from "@/module/_global";
import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid } from "@mantine/core"; import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid, Divider } from "@mantine/core";
import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
@@ -25,6 +25,7 @@ export default function ListAnggotaDetailTask() {
const roleLogin = useHookstate(globalRole) const roleLogin = useHookstate(globalRole)
const adminLogin = useHookstate(globalIsAdminDivision) const adminLogin = useHookstate(globalIsAdminDivision)
const isMobile = useMediaQuery('(max-width: 369px)'); const isMobile = useMediaQuery('(max-width: 369px)');
const isMobile2 = useMediaQuery("(max-width: 438px)");
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
const [reason, setReason] = useState("") const [reason, setReason] = useState("")
@@ -109,7 +110,7 @@ export default function ListAnggotaDetailTask() {
.fill(null) .fill(null)
.map((_, i) => ( .map((_, i) => (
<Box key={i}> <Box key={i}>
<SkeletonSingle /> <SkeletonList />
</Box> </Box>
)) ))
: :
@@ -121,23 +122,19 @@ export default function ListAnggotaDetailTask() {
onClick={() => { onClick={() => {
setDataChoose({ id: v.idUser, name: v.name }) setDataChoose({ id: v.idUser, name: v.name })
reason == null ? reason == null ?
setOpenDrawer(true) setOpenDrawer(true)
: setOpenDrawer(false) : setOpenDrawer(false)
}} }}
> >
<Grid.Col span={9}> <Grid.Col span={1}>
<Group> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> </Grid.Col>
<Box w={{ <Grid.Col span={8}>
base: isMobile ? 130 : 140, <Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
xl: 270 <Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
}}> style={{
<Flex direction={'column'} align="flex-start" justify="flex-start"> overflowWrap: "break-word"
<Text lineClamp={1} fz={isMobile ? 14 : 16}>{v.name}</Text> }}>{v.email}</Text>
<Text c={"#5A687D"} lineClamp={1} fz={isMobile ? 10 : 14}>{v.email}</Text>
</Flex>
</Box>
</Group>
</Grid.Col> </Grid.Col>
<Grid.Col span={3}> <Grid.Col span={3}>
<Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}> <Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
@@ -145,6 +142,9 @@ export default function ListAnggotaDetailTask() {
</Text> </Text>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Box mt={10}>
<Divider my={10} />
</Box>
</Box> </Box>
); );
})} })}