From e4175d17f8afbe1aed7efa7c419d0beb43c40cc5 Mon Sep 17 00:00:00 2001 From: lukman Date: Fri, 13 Sep 2024 17:15:46 +0800 Subject: [PATCH] style : update style --- src/module/discussion/ui/list_discussion.tsx | 21 +++- .../ui/feature_detail_division.tsx | 59 ++++++++-- src/module/division_new/ui/list_division.tsx | 24 ++-- src/module/project/ui/list_project.tsx | 22 +++- src/module/project/ui/tab_project.tsx | 103 +++--------------- src/module/task/ui/list_division_task.tsx | 19 +++- src/module/task/ui/tabs_division_task.tsx | 86 ++++++--------- 7 files changed, 166 insertions(+), 168 deletions(-) diff --git a/src/module/discussion/ui/list_discussion.tsx b/src/module/discussion/ui/list_discussion.tsx index 4d1b6d8..1c789cc 100644 --- a/src/module/discussion/ui/list_discussion.tsx +++ b/src/module/discussion/ui/list_discussion.tsx @@ -1,5 +1,5 @@ 'use client' -import { TEMA} from "@/module/_global"; +import { TEMA } from "@/module/_global"; import { Avatar, Badge, Box, Divider, Flex, Grid, Group, Skeleton, Spoiler, Text, TextInput } from "@mantine/core"; import { useParams, useRouter, useSearchParams } from "next/navigation"; import { useState } from "react"; @@ -106,15 +106,30 @@ export default function ListDiscussion({ id }: { id: string }) { { router.push(`/division/${param.id}/discussion/${v.id}`) }}> - + - + diff --git a/src/module/division_new/ui/feature_detail_division.tsx b/src/module/division_new/ui/feature_detail_division.tsx index 86aa43f..70536f1 100644 --- a/src/module/division_new/ui/feature_detail_division.tsx +++ b/src/module/division_new/ui/feature_detail_division.tsx @@ -40,7 +40,7 @@ export default function FeatureDetailDivision() { fetchData() }, [param.id]) const isMobile = useMediaQuery('(max-width: 399px)'); - const isMobile2 = useMediaQuery('(max-width: 369px)'); + const isMobile2 = useMediaQuery('(max-width: 411px)'); return ( @@ -58,7 +58,12 @@ export default function FeatureDetailDivision() { padding: 10 }} onClick={() => router.push(param.id + '/task?status=0')}> - + - + Tugas {feature?.tugas} Tugas @@ -83,7 +94,12 @@ export default function FeatureDetailDivision() { padding: 10 }} onClick={() => router.push(param.id + '/document')}> - + - + Dokumen {feature?.dokumen} File @@ -108,7 +129,12 @@ export default function FeatureDetailDivision() { padding: 10 }} onClick={() => router.push(param.id + '/discussion')}> - + - + Diskusi {feature?.diskusi} Diskusi @@ -133,7 +164,12 @@ export default function FeatureDetailDivision() { padding: 10 }} onClick={() => router.push(param.id + '/calender')}> - + - + Kalender {feature?.kalender} Acara diff --git a/src/module/division_new/ui/list_division.tsx b/src/module/division_new/ui/list_division.tsx index bec93e2..abeb6b4 100644 --- a/src/module/division_new/ui/list_division.tsx +++ b/src/module/division_new/ui/list_division.tsx @@ -7,7 +7,7 @@ import { HiMenu } from 'react-icons/hi'; import { HiMagnifyingGlass, HiMiniUserGroup, HiOutlineListBullet, HiSquares2X2 } from 'react-icons/hi2'; import { MdAccountCircle } from 'react-icons/md'; import DrawerDivision from './drawer_division'; -import { useShallowEffect } from '@mantine/hooks'; +import { useMediaQuery, useShallowEffect } from '@mantine/hooks'; import { IDataDivison } from '../lib/type_division'; import { funGetAllDivision } from '../lib/api_division'; import toast from 'react-hot-toast'; @@ -27,6 +27,8 @@ export default function ListDivision() { const roleLogin = useHookstate(globalRole) const tema = useHookstate(TEMA) + const paddingLift = useMediaQuery('(max-width: 505px)') + const handleList = () => { setIsList(!isList) @@ -131,12 +133,16 @@ export default function ListDivision() { data?.map((v: any, i: any) => { return ( - + router.push(`/division/${v.id}`)}> - router.push(`/division/${v.id}`)}> +
- + {v.name} diff --git a/src/module/project/ui/list_project.tsx b/src/module/project/ui/list_project.tsx index 4ef28da..ddb5b5f 100644 --- a/src/module/project/ui/list_project.tsx +++ b/src/module/project/ui/list_project.tsx @@ -55,6 +55,8 @@ export default function ListProject() { } const isMobile = useMediaQuery('(max-width: 369px)'); + const paddingLift = useMediaQuery('(max-width: 505px)') + return ( @@ -104,12 +106,16 @@ export default function ListProject() { {isData.map((v, i) => { return ( - + router.push(`/project/${v.id}`)}> - router.push(`/project/${v.id}`)}> +
@@ -138,7 +148,7 @@ export default function ListProject() { base: isMobile ? 200 : 230, xl: 430 }}> - + {v.title} diff --git a/src/module/project/ui/tab_project.tsx b/src/module/project/ui/tab_project.tsx index 6da18d5..6a7c73a 100644 --- a/src/module/project/ui/tab_project.tsx +++ b/src/module/project/ui/tab_project.tsx @@ -57,9 +57,18 @@ export default function TabProject() { } /> - - {dataStatus.map((item, index) => ( - + + + {dataStatus.map((item, index) => ( - - ))} - - {/* - {dataStatus.map((v, i) => ( - - - - ))} - */} + ))} + + - {/* - - } - onClick={() => { router.push("?status=0&group=" + group) }} - color={tema.get().utama} - > - Segera - - } - onClick={() => { router.push("?status=1&group=" + group) }} - color={tema.get().utama} - > - Dikerjakan - - } - onClick={() => { router.push("?status=2&group=" + group) }} - color={tema.get().utama}> - Selesai - - } - onClick={() => { router.push("?status=3&group=" + group) }} - color={tema.get().utama}> - Batal - - - - */} - {/* - - } - onClick={() => { router.push("?status=0&group=" + group) }} - color={tema.get().utama} - > - Segera - - } - onClick={() => { router.push("?status=1&group=" + group) }} - color={tema.get().utama} - > - Dikerjakan - - } - onClick={() => { router.push("?status=2&group=" + group) }} - color={tema.get().utama}> - Selesai - - } - onClick={() => { router.push("?status=3&group=" + group) }} - color={tema.get().utama}> - Batal - - - - */} diff --git a/src/module/task/ui/list_division_task.tsx b/src/module/task/ui/list_division_task.tsx index 82dd51a..35fe998 100644 --- a/src/module/task/ui/list_division_task.tsx +++ b/src/module/task/ui/list_division_task.tsx @@ -7,7 +7,7 @@ import { MdAccountCircle } from "react-icons/md"; import { IDataTask } from "../lib/type_task"; import { funGetAllTask } from "../lib/api_task"; import toast from "react-hot-toast"; -import { useShallowEffect } from "@mantine/hooks"; +import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import _ from "lodash"; import { useHookstate } from "@hookstate/core"; @@ -21,6 +21,7 @@ export default function ListDivisionTask() { const [searchQuery, setSearchQuery] = useState('') const [loading, setLoading] = useState(true); const tema = useHookstate(TEMA) + const paddingLift = useMediaQuery('(max-width: 505px)') const handleList = () => { setIsList(!isList) @@ -102,7 +103,11 @@ export default function ListDivisionTask() { router.push(`task/${v.id}`)}> @@ -125,15 +130,19 @@ export default function ListDivisionTask() { - + {v.title} diff --git a/src/module/task/ui/tabs_division_task.tsx b/src/module/task/ui/tabs_division_task.tsx index 7278fe2..50368e5 100644 --- a/src/module/task/ui/tabs_division_task.tsx +++ b/src/module/task/ui/tabs_division_task.tsx @@ -1,5 +1,5 @@ 'use client' -import { Box, Button, rem, Tabs } from "@mantine/core"; +import { Box, Button, Flex, rem, Tabs } from "@mantine/core"; import { IoIosCheckmarkCircleOutline } from "react-icons/io"; import { IoCloseCircleOutline } from "react-icons/io5"; import { RiProgress3Line } from "react-icons/ri"; @@ -42,60 +42,40 @@ export default function TabsDivisionTask() { return ( - {/* - - } - onClick={() => { router.push("?status=0") }}> - Segera - - } - onClick={() => { router.push("?status=1") }}> - Dikerjakan - - } - onClick={() => { router.push("?status=2") }}> - Selesai - - } - onClick={() => { router.push("?status=3") }}> - Batal - - - - */} - + + {dataStatus.map((item, index) => ( - - - + ))} - + + )