style : update style

Deskripsi:
- update group
- update home
- update position
- update user profile

No Issue
This commit is contained in:
lukman
2024-09-05 11:14:56 +08:00
parent 36bbe99a5a
commit 7b54be072c
9 changed files with 148 additions and 116 deletions

View File

@@ -1,6 +1,6 @@
"use client"
import { WARNA } from '@/module/_global';
import { ActionIcon, Box, Center, Grid, Group, Text } from '@mantine/core';
import { ActionIcon, Box, Center, Grid, Group, Spoiler, Text } from '@mantine/core';
import { useRouter } from 'next/navigation';
import React from 'react';
import { FaBell } from 'react-icons/fa6';
@@ -8,58 +8,58 @@ import { FaBell } from 'react-icons/fa6';
const dataNotification = [
{
id: 1,
title: 'Rapat Kamis',
description: 'Dipta menambahkan berkas di document dan file.',
title: 'Rapat Kamis Kamis Kamis Kamis Kamis Kamis Kamis Kamis ',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 2,
title: 'Rapat Jumat',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 3,
title: 'Rapat Senin',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 4,
title: 'Rapat Selasa',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 5,
title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 5,
title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 5,
title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 5,
title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 5,
title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 5,
title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
{
id: 5,
title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.',
description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
},
]
@@ -79,9 +79,18 @@ export default function ListNotification() {
<ActionIcon variant="light" bg={WARNA.biruTua} size={35} radius={100} aria-label="icon">
<FaBell size={20} color='white' />
</ActionIcon>
<Text fw={'bold'} fz={18}>{v.title}</Text>
<Box
w={{
base: 240,
xl: 380
}}
>
<Text fw={'bold'} fz={18} lineClamp={1}>{v.title}</Text>
</Box>
</Group>
<Text mt={10} fz={15}>{v.description}</Text>
<Spoiler maxHeight={60} showLabel="Lebih banyak" hideLabel="Lebih sedikit">
<Text mt={10} fz={15}>{v.description}</Text>
</Spoiler>
</Box>
</Box>
)

View File

@@ -7,6 +7,7 @@ import { funGetSearchAll } from '../lib/api_search';
import { useShallowEffect } from '@mantine/hooks';
import { IDataDivisionSearch, IDataProjectSearch, IDataUserSearch } from '../lib/type_search';
import { useRouter } from 'next/navigation';
import _ from 'lodash';
export default function ViewSearch() {
const [search, setSearch] = useState('');
@@ -73,21 +74,27 @@ export default function ViewSearch() {
borderRadius: 5
}}>
{dataUser.length > 0 ? (
<Box>
<Box mt={5}>
{dataUser.map((v, i) => {
return (
<Box key={i} onClick={() => router.push(`/member/${v.id}`)}>
<Group align='center' style={{
padding: 5,
paddingLeft: 0,
}} >
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} size="lg" />
<Box>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
<Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text>
</Box>
</Group>
<Divider my={5} />
<Box key={i}>
<Box onClick={() => {
router.push(`/member/${v.id}`)
}}>
<Grid gutter={{
base: 60,
xl: "xs"
}} align="center">
<Grid.Col span={2}>
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} size={50} alt="image" />
</Grid.Col>
<Grid.Col span={9}>
<Text fw={'bold'} c={WARNA.biruTua} lineClamp={1}>{_.startCase(v.name)}</Text>
<Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text>
</Grid.Col>
</Grid>
</Box>
<Divider my={10} />
</Box>
)
})}
@@ -112,18 +119,25 @@ export default function ViewSearch() {
{dataDivision.map((v, i) => {
return (
<Box key={i} onClick={() => router.push(`/division/${v.id}`)}>
<Grid justify='center' align='center' mt={15}>
<Grid.Col span={"auto"}>
<Grid justify='center' align='center' mt={15} >
<Grid.Col span={2}>
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
<HiMiniUserGroup color={'white'} size={25} />
</ActionIcon>
</Grid.Col>
<Grid.Col span={10}>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name.toUpperCase()}</Text>
<Text fw={'lighter'} fz={12}>{v.group}</Text>
<Box
w={{
base: 220,
xl: 380
}}
>
<Text pl={{base: 10, xl:0}} fw={'bold'} c={WARNA.biruTua} lineClamp={1}>{v.name.toUpperCase()}</Text>
</Box>
<Text pl={{base: 10, xl:0}} fw={'lighter'} fz={12} lineClamp={1}>{v.group}</Text>
</Grid.Col>
</Grid>
<Text fw={'lighter'} mt={5} mb={10} lineClamp={2}>{v.desc}</Text>
<Text fw={'lighter'} mt={10} mb={10} lineClamp={2}>{v.desc}</Text>
<Divider my={5} />
</Box>
)
@@ -150,14 +164,21 @@ export default function ViewSearch() {
return (
<Box key={i} onClick={() => router.push(`/project/${v.id}`)}>
<Grid justify='center' align='center' mt={10}>
<Grid.Col span={"auto"}>
<Grid.Col span={2}>
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
<HiMiniPresentationChartBar color={'white'} size={25} />
</ActionIcon>
</Grid.Col>
<Grid.Col span={10}>
<Text fw={'bold'} c={WARNA.biruTua}>{v.title.toUpperCase()}</Text>
<Text fw={'lighter'} fz={12}>{v.group}</Text>
<Box
w={{
base: 220,
xl: 380
}}
>
<Text pl={{base: 10, xl:0}} fw={'bold'} c={WARNA.biruTua} lineClamp={1}>{v.title.toUpperCase()}</Text>
</Box>
<Text pl={{base: 10, xl:0}} fw={'lighter'} fz={12} lineClamp={1}>{v.group}</Text>
</Grid.Col>
</Grid>
<Divider mt={10} />