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

style : update tema

Browse Source 
Deskripsi:
- update calender
- update color palette
- update discussion
- update division
- update task

No Issue
This commit is contained in:
lukman
2024-09-13 11:58:55 +08:00
parent a6d66dd823
commit e803452a00
63 changed files with 502 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/module/color_palette/ui/create_palette_color.tsx
View File

@@ -1,11 +1,13 @@
"use client"
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import { Badge, Box, Button, Center, ColorInput, Flex, Pill, rem, SimpleGrid, Stack, Text } from '@mantine/core';
import { LayoutNavbarNew, TEMA } from '@/module/_global';
import { useHookstate } from '@hookstate/core';
import { Badge, Box, Button, Center, ColorInput, Flex, Pill, rem, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
import React, { useState } from 'react';
export default function CreatePaletteColor() {
const tema = useHookstate(TEMA)
const [isWarna, setWarna] = useState({
judulTema: '',
warnaUtama: '',
backgroundUtama: '',
backgroundIcon: '',
@@ -18,6 +20,16 @@ export default function CreatePaletteColor() {
<LayoutNavbarNew back='/color-palette' title='Tambah Tema' menu />
<Box p={20}>
<Stack>
<TextInput
label={'Judul Tema'}
placeholder='Judul Tema'
required
size="md"
radius="md"
onChange={
(e) => setWarna({ ...isWarna, judulTema: e.target.value })
}
/>
<ColorInput
label={'Warna Utama'}
placeholder='Pilih Warna'
@@ -152,11 +164,11 @@ export default function CreatePaletteColor() {
<Box pos={'fixed'} bottom={0} p={rem(20)} w={"100%"} style={{
maxWidth: rem(535),
zIndex: 999,
backgroundColor: `${WARNA.bgWhite}`,
backgroundColor: `${tema.get().bgUtama}`,
}}>
<Button
color="white"
bg={WARNA.biruTua}
bg={tema.get().utama}
size="lg"
radius={30}
fullWidth

8
src/module/color_palette/ui/drawer_create_palette.tsx
View File

@@ -1,4 +1,5 @@
import { WARNA } from '@/module/_global';
import { TEMA } from '@/module/_global';
import { useHookstate } from '@hookstate/core';
import { Box, Flex, SimpleGrid, Text } from '@mantine/core';
import { useRouter } from 'next/navigation';
import React from 'react';
@@ -6,6 +7,7 @@ import { IoAddCircle } from 'react-icons/io5';
export default function DrawerCreatePalette() {
const router = useRouter()
const tema = useHookstate(TEMA)
return (
<Box>
<SimpleGrid
@@ -15,10 +17,10 @@ export default function DrawerCreatePalette() {
onClick={() => router.push('/color-palette/create')}
>
<Box>
<IoAddCircle size={30} color={WARNA.biruTua} />
<IoAddCircle size={30} color={tema.get().utama} />
</Box>
<Box>
<Text ta={'center'} c={WARNA.biruTua}>Tambah Tema</Text>
<Text ta={'center'} c={tema.get().utama}>Tambah Tema</Text>
</Box>
</Flex>
</SimpleGrid>

10
src/module/color_palette/ui/drawer_palet_edit_end_default.tsx
View File

@@ -1,4 +1,4 @@
import { TEMA, WARNA } from '@/module/_global';
import { TEMA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { useHookstate } from '@hookstate/core';
import { Box, Flex, SimpleGrid, Text } from '@mantine/core';
@@ -29,20 +29,20 @@ export default function DrawerPaletEditEndDefault() {
onClick={() => setModal(true)}
>
<Box>
<IoColorPalette size={30} color={WARNA.biruTua} />
<IoColorPalette size={30} color={tema.get().utama} />
</Box>
<Box>
<Text ta={'center'} c={WARNA.biruTua}>Gunakan Tema</Text>
<Text ta={'center'} c={tema.get().utama}>Gunakan Tema</Text>
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'}
onClick={() => router.push('/color-palette/update/1')}
>
<Box>
<FaPencil size={30} color={WARNA.biruTua} />
<FaPencil size={30} color={tema.get().utama} />
</Box>
<Box>
<Text ta={'center'} c={WARNA.biruTua}>Edit Tema</Text>
<Text ta={'center'} c={tema.get().utama}>Edit Tema</Text>
</Box>
</Flex>
</SimpleGrid>

21
src/module/color_palette/ui/edit_palette_color.tsx
View File

@@ -1,10 +1,13 @@
"use client"
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import { Badge, Box, Button, Center, ColorInput, Flex, Pill, rem, SimpleGrid, Stack, Text } from '@mantine/core';
import { LayoutNavbarNew, TEMA } from '@/module/_global';
import { useHookstate } from '@hookstate/core';
import { Badge, Box, Button, Center, ColorInput, Flex, Pill, rem, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
import React, { useState } from 'react';
export default function EditPaletteColor() {
const tema = useHookstate(TEMA)
const [isWarna, setWarna] = useState({
judulTema: '',
warnaUtama: '',
backgroundUtama: '',
backgroundIcon: '',
@@ -17,6 +20,16 @@ export default function EditPaletteColor() {
<LayoutNavbarNew back='/color-palette' title='Edit Tema' menu />
<Box p={20}>
<Stack>
<TextInput
label={'Judul Tema'}
placeholder='Judul Tema'
required
size="md"
radius="md"
onChange={
(e) => setWarna({ ...isWarna, judulTema: e.target.value })
}
/>
<ColorInput
label={'Warna Utama'}
placeholder='Pilih Warna'
@@ -151,11 +164,11 @@ export default function EditPaletteColor() {
<Box pos={'fixed'} bottom={0} p={rem(20)} w={"100%"} style={{
maxWidth: rem(535),
zIndex: 999,
backgroundColor: `${WARNA.bgWhite}`,
backgroundColor: `${tema.get().bgUtama}`,
}}>
<Button
color="white"
bg={WARNA.biruTua}
bg={tema.get().utama}
size="lg"
radius={30}
fullWidth

10
src/module/color_palette/ui/list_color_palette.tsx
View File

@@ -1,5 +1,5 @@
"use client"
import { LayoutDrawer, LayoutNavbarNew, WARNA } from '@/module/_global';
import { LayoutDrawer, LayoutNavbarNew, TEMA } from '@/module/_global';
import { ActionIcon, Box, Checkbox, Flex, Group, Text } from '@mantine/core';
import { useRouter } from 'next/navigation';
import React, { useState } from 'react';
@@ -7,8 +7,9 @@ import { FaCircleCheck } from 'react-icons/fa6';
import { HiMenu } from 'react-icons/hi';
import DrawerCreatePalette from './drawer_create_palette';
import DrawerPaletEditEndDefault from './drawer_palet_edit_end_default';
import { useHookstate } from '@hookstate/core';
const paletWarna = [
const palettema = [
{
id: 1,
name: 'Tema Bawaan 1',
@@ -38,15 +39,16 @@ export default function ListColorPalette() {
const router = useRouter()
const [isOpen, setOpen] = useState(false)
const [isOpenTambahan, setOpenTambahan] = useState(false)
const tema = useHookstate(TEMA)
return (
<Box>
<LayoutNavbarNew back='/home' title='Tema Aplikasi' menu={
<ActionIcon onClick={() => { setOpen(true) }} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
<ActionIcon onClick={() => { setOpen(true) }} variant="light" bg={tema.get().bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiMenu size={20} color='white' />
</ActionIcon>
} />
<Box p={20}>
{paletWarna.map((v, i) => (
{palettema.map((v, i) => (
<Box mb={20} key={i}>
<Box style={{
borderWidth: "3px",