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

style: update mobile

Browse Source 
Deskripsi:
- update calender
- update division
- document
- update home
- update project
- update task

No Issue
This commit is contained in:
lukman
2024-09-11 16:44:57 +08:00
parent 57c245a880
commit 0f0acf5e67
16 changed files with 110 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/module/division_new/ui/create_division.tsx
View File

@@ -16,7 +16,7 @@ import {
Textarea,
TextInput,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { IoIosArrowDropright } from "react-icons/io";
@@ -34,6 +34,7 @@ export default function CreateDivision() {
const [isChooseAnggota, setChooseAnggota] = useState(false)
const [isChooseAdmin, setChooseAdmin] = useState(false)
const member = useHookstate(globalMemberDivision)
const isMobile = useMediaQuery('(max-width: 369px)');
const [body, setBody] = useState<any>({
idGroup: "",
name: "",
@@ -194,19 +195,19 @@ export default function CreateDivision() {
>
<Grid.Col span={9}>
<Group>
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} alt="it's me" size="lg" />
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} />
<Box w={{
base: 140,
base: isMobile ? 130 : 140,
xl: 270
}}>
<Text c={WARNA.biruTua} fw={"bold"} lineClamp={1}>
<Text c={WARNA.biruTua} fw={"bold"} lineClamp={1} fz={isMobile ? 14 : 16}>
{v.name}
</Text>
</Box>
</Group>
</Grid.Col>
<Grid.Col span={3}>
<Text c={WARNA.biruTua} fw={"bold"} ta={'end'}>
<Text c={WARNA.biruTua} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
Anggota
</Text>
</Grid.Col>

2
src/module/division_new/ui/drawer_division.tsx
View File

@@ -25,7 +25,7 @@ export default function DrawerDivision() {
<IoAddCircle size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Tambah Divisi</Text>
<Text c={WARNA.biruTua} ta={"center"}>Tambah Divisi</Text>
</Box>
</Flex>
{

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

@@ -1,7 +1,7 @@
"use client"
import { globalRole, LayoutDrawer, LayoutNavbarNew, SkeletonSingle, WARNA } from '@/module/_global';
import { ActionIcon, Avatar, Box, Button, Divider, Flex, Grid, Group, Skeleton, Stack, Text } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
import { useParams, useRouter } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
@@ -30,6 +30,7 @@ export default function InformationDivision() {
const [isOpenModal, setOpenModal] = useState(false)
const roleLogin = useHookstate(globalRole)
const [isAdmin, setAdmin] = useState(false)
const isMobile = useMediaQuery('(max-width: 369px)');
async function getOneData() {
try {
@@ -176,10 +177,10 @@ export default function InformationDivision() {
((roleLogin.get() != 'user' && roleLogin.get() != 'coadmin') || isAdmin) ?
<Group align='center' onClick={() => router.push('/division/add-member/' + param.id)}>
<Avatar size="lg">
<AiOutlineUserAdd size={30} color={WARNA.biruTua} />
<Avatar size={isMobile ? 'md' : 'lg'}>
<AiOutlineUserAdd size={isMobile ? 25 : 30} color={WARNA.biruTua} />
</Avatar>
<Text>Tambah Anggota</Text>
<Text fz={isMobile ? 14 : 16}>Tambah Anggota</Text>
</Group>
: <></>
}
@@ -207,19 +208,19 @@ export default function InformationDivision() {
>
<Grid.Col span={9}>
<Group>
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} alt="it's me" size="lg" />
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} />
<Box w={{
base: 140,
base: isMobile ? 130 : 140,
xl: 270
}}>
<Text c={WARNA.biruTua} fw={"bold"} lineClamp={1}>
<Text c={WARNA.biruTua} fw={"bold"} lineClamp={1} fz={isMobile ? 14 : 16}>
{v.name}
</Text>
</Box>
</Group>
</Grid.Col>
<Grid.Col span={3}>
<Text c={WARNA.biruTua} fw={"bold"} ta={'end'}>
<Text c={WARNA.biruTua} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
{(v.isAdmin) ? 'Admin' : 'Anggota'}
</Text>
</Grid.Col>

14
src/module/division_new/ui/list_discussion.tsx
View File

@@ -1,7 +1,7 @@
"use client"
import { WARNA } from "@/module/_global";
import { Box, Grid, Group, Skeleton, Stack, Text } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation";
import { useState } from "react";
import toast from "react-hot-toast";
@@ -16,6 +16,7 @@ export default function ListDiscussionOnDetailDivision() {
const param = useParams<{ id: string }>()
const [data, setData] = useState<IDataDiscussionOnDetailDivision[]>([])
const [loading, setLoading] = useState(true);
const isMobile = useMediaQuery('(max-width: 369px)');
async function fetchData() {
try {
@@ -86,8 +87,11 @@ export default function ListDiscussionOnDetailDivision() {
>
<Group>
<GoDiscussionClosed size={25} />
<Box w={{ base: 230, md: 400 }}>
<Text fw={"bold"} truncate="end">
<Box w={{
base: isMobile ? 180 : 230,
md: 400
}}>
<Text fw={"bold"} truncate="end" fz={isMobile ? 14 : 16}>
{v.desc}
</Text>
</Box>
@@ -100,7 +104,7 @@ export default function ListDiscussionOnDetailDivision() {
<Group gap={5} align="center">
<CiUser size={18} />
<Box w={{
base: 125,
base: isMobile ? 110 : 125,
xl: 300
}}>
<Text fz={13} lineClamp={1}>
@@ -115,7 +119,7 @@ export default function ListDiscussionOnDetailDivision() {
}}>
<Group gap={5} align="center" justify="flex-end">
<CiClock2 size={18} />
<Text fz={13}>{v.date}</Text>
<Text fz={isMobile ? 11 : 13}>{v.date}</Text>
</Group>
</Grid.Col>
</Grid>