style : update style

This commit is contained in:
lukman
2024-09-26 15:25:25 +08:00
parent 17e737ed24
commit 654796dab7
7 changed files with 70 additions and 63 deletions

View File

@@ -71,13 +71,13 @@ export default function ListDocumentOnDetailDivision() {
<Carousel.Slide key={v.id}> <Carousel.Slide key={v.id}>
<UnstyledButton onClick={() => router.push(`/division/${param.id}/document`)}> <UnstyledButton onClick={() => router.push(`/division/${param.id}/document`)}>
<Stack gap={0} w={isMobile ? 100 : 170}> <Stack gap={0} w={isMobile ? 100 : 170}>
<Paper withBorder shadow="sm" radius={12} > <Box bg={"white"} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }} >
<Center p={"md"}> <Center p={"md"}>
<Image w={isMobile ? 50 : 75} src={(v.extension == "pdf") ? iconContainer(ICON.PDF) : iconContainer(ICON.IMAGE)} alt="image" /> <Image w={isMobile ? 50 : 75} src={(v.extension == "pdf") ? iconContainer(ICON.PDF) : iconContainer(ICON.IMAGE)} alt="image" />
</Center> </Center>
</Paper> </Box>
<Box> <Box>
<Text c={"dimmed"}ta={"center"} lineClamp={1} fz={isMobile? 14 : 16}>{v.name + '.' + v.extension}</Text> <Text c={"dimmed"} ta={"center"} lineClamp={1} fz={isMobile ? 14 : 16}>{v.name + '.' + v.extension}</Text>
</Box> </Box>
</Stack> </Stack>
</UnstyledButton> </UnstyledButton>

View File

@@ -72,10 +72,10 @@ export default function ListTaskOnDetailDivision() {
<Box p={20} w={{ <Box p={20} w={{
base: isMobile ? 230 : 300, base: isMobile ? 230 : 300,
md: 400 md: 400
}} onClick={() => router.push(`/task/${v.id}`)} bg={tema.get().utama} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}> }} onClick={() => router.push(`/task/${v.id}`)} bg={"white"} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}>
<Text fw={'bold'} c={tema.get().bgUtama} lineClamp={1}>{_.startCase(v.title)}</Text> <Text fw={'bold'} c={tema.get().utama} lineClamp={1}>{_.startCase(v.title)}</Text>
<Group justify="space-between" mt={20}> <Group justify="space-between" mt={20}>
<Group gap={5} align="center" c={"#CFCDCD"}> <Group gap={5} align="center">
<CiClock2 size={18} /> <CiClock2 size={18} />
<Text fz={13}>{v.dateStart}</Text> <Text fz={13}>{v.dateStart}</Text>
</Group > </Group >

View File

@@ -526,19 +526,15 @@ export default function NavbarDocumentDivision() {
> >
{dataJalur.slice(0, 3).map((v, i) => { {dataJalur.slice(0, 3).map((v, i) => {
return ( return (
<Box p={5}>
<Text <Text
onClick={() => router.push("?path=" + v.id)} onClick={() => router.push("?path=" + v.id)}
key={i} key={i}
style={{ truncate="end"
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
maxWidth: "100%",
}}
truncate={"end"}
> >
{v.name} {v.name}
</Text> </Text>
</Box>
); );
})} })}
{dataJalur.length > 3 && ( {dataJalur.length > 3 && (
@@ -575,13 +571,15 @@ export default function NavbarDocumentDivision() {
> >
{dataJalur.slice(0, 4).map((v, i) => { {dataJalur.slice(0, 4).map((v, i) => {
return ( return (
<Text <Box p={5}>
onClick={() => router.push("?path=" + v.id)} <Text
key={i} onClick={() => router.push("?path=" + v.id)}
truncate="end" key={i}
> truncate="end"
{v.name} >
</Text> {v.name}
</Text>
</Box>
); );
})} })}
{dataJalur.length > 4 && ( {dataJalur.length > 4 && (

View File

@@ -19,7 +19,7 @@ export default function ProgressDetailProject() {
const [loading, setLoading] = useState(true) const [loading, setLoading] = useState(true)
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
const [reason, setReason] = useState("") const [reason, setReason] = useState("")
async function getOneData() { async function getOneData() {
try { try {
setLoading(true) setLoading(true)
@@ -76,22 +76,23 @@ export default function ProgressDetailProject() {
return ( return (
<> <>
<Box mt={10}> <Box mt={10}>
{reason !== null ? {loading ? "" :
( reason !== null ?
<Box mb={10}> (
<Box p={15} bg={"#FFF2CD"} style={{ <Box mb={10}>
borderRadius: 10, <Box p={15} bg={"#FFF2CD"} style={{
}}> borderRadius: 10,
<Group align='center'> }}>
<IoIosWarning size={25}/> <Group align='center'>
<Text fw={"bold"}>Kegiatan dibatalkan</Text> <IoIosWarning size={25} />
</Group> <Text fw={"bold"}>Kegiatan dibatalkan</Text>
<Text mt={5} truncate="end">{reason}</Text> </Group>
</Box> <Text mt={5} truncate="end">{reason}</Text>
</Box> </Box>
) </Box>
: null )
} : null
}
{loading ? {loading ?
<Skeleton width={"100%"} height={100} radius={"md"} /> <Skeleton width={"100%"} height={100} radius={"md"} />
: :

View File

@@ -131,14 +131,17 @@ export default function ListFileDetailTask() {
}} }}
> >
<Grid gutter={"sm"} justify='flex-start' align='flex-start'> <Grid gutter={"sm"} justify='flex-start' align='flex-start'>
<Grid.Col span={"auto"}> <Grid.Col span={2}>
<Center > <Center >
{item.extension == "pdf" && <BsFiletypePdf size={25} />} {item.extension == "pdf" && <BsFiletypePdf size={30} />}
{item.extension == "csv" && <BsFiletypeCsv size={25} />} {item.extension == "csv" && <BsFiletypeCsv size={30} />}
{item.extension == "png" && <BsFiletypePng size={25} />} {item.extension == "png" && <BsFiletypePng size={30} />}
{item.extension == "jpg" && <BsFiletypeJpg size={25} />} {item.extension == "jpg" && <BsFiletypeJpg size={30} />}
{item.extension == "jpeg" && <BsFiletypeJpg size={25} />} {item.extension == "jpeg" && <BsFiletypeJpg size={30} />}
{item.extension == "heic" && <BsFiletypeHeic size={25} />} {item.extension == "PNG" && <BsFiletypePng size={30} />}
{item.extension == "JPG" && <BsFiletypeJpg size={30} />}
{item.extension == "JPEG" && <BsFiletypeJpg size={30} />}
{item.extension == "heic" && <BsFiletypeHeic size={30} />}
</Center> </Center>
</Grid.Col> </Grid.Col>
<Grid.Col span={10}> <Grid.Col span={10}>
@@ -155,7 +158,7 @@ export default function ListFileDetailTask() {
<LayoutDrawer opened={openDrawer} title={<Text lineClamp={1}>{nameData}</Text>} onClose={() => setOpenDrawer(false)}> <LayoutDrawer opened={openDrawer} title={<Text truncate={'end'}>{nameData}</Text>} onClose={() => setOpenDrawer(false)}>
<Box> <Box>
<Stack pt={10}> <Stack pt={10}>
<SimpleGrid <SimpleGrid
@@ -172,8 +175,8 @@ export default function ListFileDetailTask() {
<Flex onClick={() => { <Flex onClick={() => {
reason == null ? reason == null ?
setOpenModal(true) setOpenModal(true)
: setOpenModal(false) : setOpenModal(false)
}} justify={'center'} align={'center'} direction={'column'} > }} justify={'center'} align={'center'} direction={'column'} >
<Box> <Box>
<FaTrash size={30} color={reason == null ? tema.get().utama : "gray"} /> <FaTrash size={30} color={reason == null ? tema.get().utama : "gray"} />

View File

@@ -78,21 +78,22 @@ export default function ProgressDetailTask() {
return ( return (
<Box mt={10}> <Box mt={10}>
{reason !== null ? {loading ? "" :
( reason !== null ?
<Box mb={10}> (
<Box p={15} bg={"#FFF2CD"} style={{ <Box mb={10}>
borderRadius: 10, <Box p={15} bg={"#FFF2CD"} style={{
}}> borderRadius: 10,
<Group align='center'> }}>
<IoIosWarning size={25} /> <Group align='center'>
<Text fw={"bold"}>Tugas dibatalkan</Text> <IoIosWarning size={25} />
</Group> <Text fw={"bold"}>Tugas dibatalkan</Text>
<Text mt={5} truncate="end">{reason}</Text> </Group>
<Text mt={5} truncate="end">{reason}</Text>
</Box>
</Box> </Box>
</Box> )
) : null
: null
} }
{loading ? {loading ?
<Skeleton width={"100%"} height={100} radius={"md"} /> <Skeleton width={"100%"} height={100} radius={"md"} />

View File

@@ -16,12 +16,16 @@ export default function ResultsFile({ name, extension }: IListFileTask) {
{extension == "pdf" && <BsFiletypePdf size={30} />} {extension == "pdf" && <BsFiletypePdf size={30} />}
{extension == "csv" && <BsFiletypeCsv size={30} />} {extension == "csv" && <BsFiletypeCsv size={30} />}
{extension == "png" && <BsFiletypePng size={30} />} {extension == "png" && <BsFiletypePng size={30} />}
{extension == "jpg" || extension == "jpeg" && <BsFiletypeJpg size={30} />} {extension == "jpg" && <BsFiletypeJpg size={30} />}
{extension == "jpeg" && <BsFiletypeJpg size={30} />}
{extension == "PNG" && <BsFiletypePng size={30} />}
{extension == "JPG" && <BsFiletypeJpg size={30} />}
{extension == "JPEG" && <BsFiletypeJpg size={30} />}
{extension == "heic" && <BsFiletypeHeic size={30} />} {extension == "heic" && <BsFiletypeHeic size={30} />}
</Center> </Center>
</Grid.Col> </Grid.Col>
<Grid.Col span={10}> <Grid.Col span={10}>
<Text>{name}</Text> <Text truncate={'end'}>{name}</Text>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Group> <Group>