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 global
- update announcement
- update update color palette
- update group
- update home
- update position
- update project
- update member

No Issue
This commit is contained in:
lukman
2024-09-12 17:31:00 +08:00
parent a211e7e4e4
commit cbdaac6319
80 changed files with 870 additions and 568 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/module/group/ui/drawer_group.tsx
View File

@@ -1,4 +1,4 @@
import { LayoutDrawer, WARNA } from "@/module/_global";
import { LayoutDrawer, TEMA, WARNA } from "@/module/_global";
import {
Box,
Button,
@@ -14,10 +14,12 @@ import React, { useState } from "react";
import { IoAddCircle } from "react-icons/io5";
import { funCreateGroup } from "../lib/api_group";
import toast from "react-hot-toast";
import { useHookstate } from "@hookstate/core";
export default function DrawerGroup({ onSuccess, }: { onSuccess: (val: boolean) => void; }) {
const [openDrawerGroup, setOpenDrawerGroup] = useState(false);
const [namaGroup, setNamaGroup] = useState("");
const tema = useHookstate(TEMA)
const [touched, setTouched] = useState({
name: false,
});
@@ -50,10 +52,10 @@ export default function DrawerGroup({ onSuccess, }: { onSuccess: (val: boolean)
>
<Flex justify={"center"} align={"center"} direction={"column"}>
<Box>
<IoAddCircle size={30} color={WARNA.biruTua} />
<IoAddCircle size={30} color={tema.get().utama} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Tambah Grup</Text>
<Text c={tema.get().utama}>Tambah Grup</Text>
</Box>
</Flex>
</SimpleGrid>
@@ -67,9 +69,9 @@ export default function DrawerGroup({ onSuccess, }: { onSuccess: (val: boolean)
<TextInput
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
color: tema.get().utama,
borderRadius: tema.get().utama,
borderColor: tema.get().utama,
},
}}
size="lg"
@@ -87,7 +89,7 @@ export default function DrawerGroup({ onSuccess, }: { onSuccess: (val: boolean)
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
bg={tema.get().utama}
size="lg"
radius={30}
fullWidth

20
src/module/group/ui/edit_drawer_group.tsx
View File

@@ -1,5 +1,5 @@
"use client";
import { LayoutDrawer, WARNA } from "@/module/_global";
import { LayoutDrawer, TEMA, WARNA } from "@/module/_global";
import LayoutModal from "@/module/_global/layout/layout_modal";
import {
Box,
@@ -18,12 +18,14 @@ import toast from "react-hot-toast";
import { FaPencil, FaToggleOff } from "react-icons/fa6";
import { IoAddCircle, IoCloseCircleOutline } from "react-icons/io5";
import { funEditGroup, funEditStatusGroup, funGetGroupById } from "../lib/api_group";
import { useHookstate } from "@hookstate/core";
export default function EditDrawerGroup({ onUpdated, id, isActive, }: { onUpdated: (val: boolean) => void; id: string; isActive: boolean; }) {
const [openDrawerGroup, setOpenDrawerGroup] = useState(false);
const [isModal, setModal] = useState(false);
const [name, setName] = useState("");
const [loading, setLoading] = useState(false);
const tema = useHookstate(TEMA)
const [touched, setTouched] = useState({
name: false,
});
@@ -100,10 +102,10 @@ export default function EditDrawerGroup({ onUpdated, id, isActive, }: { onUpdate
style={{ cursor: "pointer" }}
>
<Box>
<FaToggleOff size={30} color={WARNA.biruTua} />
<FaToggleOff size={30} color={tema.get().utama} />
</Box>
<Box>
<Text c={WARNA.biruTua}>{isActive == false ? "Aktifkan" : "Non Aktifkan"}</Text>
<Text c={tema.get().utama}>{isActive == false ? "Aktifkan" : "Non Aktifkan"}</Text>
</Box>
</Flex>
<Flex
@@ -114,10 +116,10 @@ export default function EditDrawerGroup({ onUpdated, id, isActive, }: { onUpdate
style={{ cursor: "pointer" }}
>
<Box>
<FaPencil size={30} color={WARNA.biruTua} />
<FaPencil size={30} color={tema.get().utama} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Edit</Text>
<Text c={tema.get().utama}>Edit</Text>
</Box>
</Flex>
</SimpleGrid>
@@ -131,9 +133,9 @@ export default function EditDrawerGroup({ onUpdated, id, isActive, }: { onUpdate
<TextInput
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
color: tema.get().utama,
borderRadius: tema.get().utama,
borderColor: tema.get().utama,
},
}}
size="lg"
@@ -154,7 +156,7 @@ export default function EditDrawerGroup({ onUpdated, id, isActive, }: { onUpdate
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
bg={tema.get().utama}
size="lg"
radius={30}
fullWidth

18
src/module/group/ui/list_group_active.tsx
View File

@@ -1,4 +1,4 @@
import { LayoutDrawer, SkeletonSingle, WARNA } from "@/module/_global";
import { LayoutDrawer, SkeletonSingle, TEMA, WARNA } from "@/module/_global";
import {
ActionIcon,
Box,
@@ -19,6 +19,7 @@ import { funGetAllGroup } from "../lib/api_group";
import { IDataGroup } from "../lib/type_group";
import { useSearchParams } from "next/navigation";
import _ from "lodash";
import { useHookstate } from "@hookstate/core";
export default function ListGroupActive() {
@@ -31,6 +32,7 @@ export default function ListGroupActive() {
const [loading, setLoading] = useState(true);
const searchParams = useSearchParams()
const status = searchParams.get('active')
const tema = useHookstate(TEMA)
const fetchData = async () => {
@@ -64,9 +66,9 @@ export default function ListGroupActive() {
<TextInput
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
color: tema.get().utama,
borderRadius: tema.get().utama,
borderColor: tema.get().utama,
},
}}
size="md"
@@ -96,7 +98,7 @@ export default function ListGroupActive() {
<Group
align="center"
style={{
border: `1px solid ${"#DCEED8"}`,
border: `1px solid ${tema.get().bgTotalKegiatan}`,
padding: 10,
borderRadius: 10,
cursor: "pointer",
@@ -116,13 +118,13 @@ export default function ListGroupActive() {
<Flex justify={{base: "center", xl: "flex-start"}}>
<ActionIcon
variant="light"
bg={"#DCEED8"}
bg={tema.get().bgTotalKegiatan}
size={50}
radius={100}
aria-label="icon"
>
<HiOutlineOfficeBuilding
color={WARNA.biruTua}
color={tema.get().utama}
size={25}
/>
</ActionIcon>
@@ -138,7 +140,7 @@ export default function ListGroupActive() {
xl: 400
}}
>
<Text fw={"bold"} c={WARNA.biruTua} lineClamp={1}>
<Text fw={"bold"} c={tema.get().utama} lineClamp={1}>
{v.name}
</Text>
</Box>

6
src/module/group/ui/navbar_group.tsx
View File

@@ -1,17 +1,19 @@
"use client"
import { LayoutDrawer, LayoutNavbarNew, WARNA } from '@/module/_global';
import { LayoutDrawer, LayoutNavbarNew, TEMA, WARNA } from '@/module/_global';
import { ActionIcon, } from '@mantine/core';
import React, { useState } from 'react';
import { HiMenu } from "react-icons/hi";
import DrawerGroup from './drawer_group';
import { useHookstate } from '@hookstate/core';
export default function NavbarGroup() {
const [isOpen, setOpen] = useState(false)
const tema = useHookstate(TEMA)
return (
<>
<LayoutNavbarNew back='/home' title='Grup'
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>
}

6
src/module/group/ui/tab_list_group.tsx
View File

@@ -4,17 +4,19 @@ import { IoCloseCircleOutline } from "react-icons/io5";
import { IoMdCheckmarkCircleOutline } from "react-icons/io";
import ListGroupActive from "./list_group_active";
import { useRouter, useSearchParams } from "next/navigation";
import { useHookstate } from "@hookstate/core";
import { TEMA } from "@/module/_global";
export default function TabListGroup() {
const iconStyle = { width: rem(20), height: rem(20) };
const router = useRouter()
const searchParams = useSearchParams()
const status = searchParams.get('active')
const tema = useHookstate(TEMA)
return (
<Box p={20}>
<Tabs variant="pills" color="#FF9861" radius="xl" defaultValue={(status == "false") ? "false" : "true"}>
<Tabs variant="pills" color={tema.get().bgFiturHome} radius="xl" defaultValue={(status == "false") ? "false" : "true"}>
<Tabs.List
bg={"white"}
style={{