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

style : update style and components

Browse Source 
Deskripsi:
- update global
- update division
- update home
- update project
- update user
- add component natification
- add component reload

No Issue
This commit is contained in:
lukman
2024-09-18 16:03:27 +08:00
parent 42d2734c43
commit 08d4504a5b
3 changed files with 22 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/module/_global/components/notification_custome.tsx
View File

@@ -3,9 +3,12 @@ import { Box, Center, Flex, Grid, rem, Text, Transition } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import React, { useState } from 'react';
import { IoCloseOutline, IoNotifications } from 'react-icons/io5';
import { TEMA } from '../bin/val_global';
import { useHookstate } from '@hookstate/core';
export default function NotificationCustome({ onClose, title, desc, bg, color, onClick, borderColor }: { onClose: () => void, title: string, desc: string, bg: string, color: string, onClick: () => void, borderColor: string }) {
export default function NotificationCustome({ onClose, title, desc, onClick }: { onClose: () => void, title: string, desc: string, onClick: () => void, }) {
const [opened, setOpened] = useState(false);
const tema = useHookstate(TEMA)
useShallowEffect(() => {
const timer = setTimeout(() => {
@@ -49,23 +52,23 @@ export default function NotificationCustome({ onClose, title, desc, bg, color, o
<Box p={rem(15)} w={"100%"} h={rem(85)} style={{
maxWidth: rem(450),
zIndex: 999,
backgroundColor: bg,
backgroundColor: "#ffffff",
borderRadius: 15,
border: `1px solid ${borderColor}`
border: `1px solid ${tema.get().bgTotalKegiatan}`
}} onClick={onClick}>
<Grid>
<Grid.Col span={2}>
<Flex justify={'center'} align={"center"}h={"100%"} >
<IoNotifications color={color} size={30}/>
<Flex justify={'center'} align={"center"} h={"100%"} >
<IoNotifications color={tema.get().utama} size={30} />
</Flex>
</Grid.Col>
<Grid.Col span={8}>
<Text c={color} fw={"bold"} lineClamp={1}>{title}</Text>
<Text c={color} lineClamp={1}>{desc}</Text>
<Text fw={"bold"} lineClamp={1}>{title}</Text>
<Text lineClamp={1}>{desc}</Text>
</Grid.Col>
<Grid.Col span={2}>
<Flex justify={'center'} align={"center"}h={"100%"} >
<IoCloseOutline onClick={reloadData} color={color} size={25}/>
<Flex justify={'center'} align={"center"} h={"100%"} >
<IoCloseOutline onClick={reloadData} size={25} />
</Flex>
</Grid.Col>
</Grid>

7
src/module/_global/components/reload_button_top.tsx
View File

@@ -1,11 +1,14 @@
"use client"
import { useHookstate } from '@hookstate/core';
import { Button, Center, Transition } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import React, { useState } from 'react';
import { IoReload } from 'react-icons/io5';
import { TEMA } from '../bin/val_global';
export default function ReloadButtonTop({ onReload, title }: { onReload: () => void, title: string }) {
const [opened, setOpened] = useState(false);
const tema = useHookstate(TEMA)
useShallowEffect(() => {
const timer = setTimeout(() => {
@@ -40,7 +43,9 @@ export default function ReloadButtonTop({ onReload, title }: { onReload: () => v
alignItems: 'center',
}}
>
<Button leftSection={<IoReload/>} onClick={reloadData} radius={"lg"}>{title}</Button>
<Button style={{
border: `1px solid ${tema.get().bgTotalKegiatan}`
}} leftSection={<IoReload/>} bg={"white"} c={tema.get().utama} onClick={reloadData} radius={"lg"}>{title}</Button>
</div>
)}
</Transition>