diff --git a/src/app/api/announcement/route.ts b/src/app/api/announcement/route.ts index 8380629..ece3879 100644 --- a/src/app/api/announcement/route.ts +++ b/src/app/api/announcement/route.ts @@ -89,7 +89,7 @@ export async function GET(request: Request) { const allData = announcements.map((v: any) => ({ ..._.omit(v, ["createdAt"]), - createdAt: moment(v.createdAt).format("LL") + createdAt: moment(v.createdAt).format("ll") })) return NextResponse.json({ success: true, message: "Berhasil mendapatkan pengumuman", data: allData, }, { status: 200 }); diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 04459c5..2daadaa 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -13,6 +13,7 @@ import { Toaster } from 'react-hot-toast'; import '@mantine/dates/styles.css'; import '@mantine/notifications/styles.css'; import { Notifications } from '@mantine/notifications' +import LayoutBackground from "@/module/_global/layout/layout_background"; export const metadata = { title: "SISTEM DESA MANDIRI", @@ -42,9 +43,9 @@ export default function RootLayout({ overflowY: "auto", }}> - + {children} - + diff --git a/src/module/_global/bin/type_global.ts b/src/module/_global/bin/type_global.ts index c85b9ea..5ccecec 100644 --- a/src/module/_global/bin/type_global.ts +++ b/src/module/_global/bin/type_global.ts @@ -3,6 +3,6 @@ export interface IGlobalTema { bgUtama: string bgIcon: string bgFiturHome: string - bgFiturDivisi: string + bgFiturDivision: string bgTotalKegiatan: string } \ No newline at end of file diff --git a/src/module/_global/bin/val_global.ts b/src/module/_global/bin/val_global.ts index b6752cc..c1905ce 100644 --- a/src/module/_global/bin/val_global.ts +++ b/src/module/_global/bin/val_global.ts @@ -17,6 +17,6 @@ export const TEMA = hookstate({ bgUtama: "#F4F9FD", bgIcon: "#384288", bgFiturHome: "#FCAA4B", - bgFiturDivisi: "#FCAA4B", + bgFiturDivision: "#FCAA4B", bgTotalKegiatan: "#DCEED8" }) \ No newline at end of file diff --git a/src/module/_global/fun/WARNA.ts b/src/module/_global/fun/WARNA.ts index be463fc..4e8923a 100644 --- a/src/module/_global/fun/WARNA.ts +++ b/src/module/_global/fun/WARNA.ts @@ -1,9 +1,9 @@ export const WARNA = { bgWhite: "#F4F9FD", - // biruTua: "#19345E", - biruTua: "#508D4E", - // bgIcon: "#384288", - bgIcon: "#3C8754", + biruTua: "#19345E", + // biruTua: "#508D4E", + bgIcon: "#384288", + // bgIcon: "#3C8754", borderOrange: "#FCAA4B", bgHijauMuda: "#DCEED8", borderBiruMuda: "#9EBDED" diff --git a/src/module/_global/layout/layout_background.tsx b/src/module/_global/layout/layout_background.tsx new file mode 100644 index 0000000..12b046b --- /dev/null +++ b/src/module/_global/layout/layout_background.tsx @@ -0,0 +1,14 @@ +"use client" +import { useHookstate } from '@hookstate/core'; +import { Container, rem } from '@mantine/core'; +import React from 'react'; +import { TEMA } from '../bin/val_global'; + +export default function LayoutBackground({ children }: { children: React.ReactNode }) { + const tema = useHookstate(TEMA) + return ( + + {children} + + ); +} diff --git a/src/module/announcement/ui/detail_announcement.tsx b/src/module/announcement/ui/detail_announcement.tsx index 4d8c9e4..6fb4095 100644 --- a/src/module/announcement/ui/detail_announcement.tsx +++ b/src/module/announcement/ui/detail_announcement.tsx @@ -57,24 +57,21 @@ export default function DetailAnnouncement({ id }: { id: string }) { - - - - - - - - - - - - + + + + + + + + + : diff --git a/src/module/announcement/ui/drawer_announcement.tsx b/src/module/announcement/ui/drawer_announcement.tsx index c5847d7..94a9517 100644 --- a/src/module/announcement/ui/drawer_announcement.tsx +++ b/src/module/announcement/ui/drawer_announcement.tsx @@ -14,7 +14,7 @@ export default function DrawerAnnouncement() { (null); @@ -23,6 +24,7 @@ export default function NavbarCreateDivisionCalender() { const [openMember, setOpenMember] = useState(false) const param = useParams<{ id: string, detail: string }>() const tema = useHookstate(TEMA) + const isMobile = useMediaQuery('(max-width: 369px)'); const [touched, setTouched] = useState({ title: false, dateStart: false, @@ -301,19 +303,19 @@ export default function NavbarCreateDivisionCalender() { > - + - + {v.name} - + Anggota diff --git a/src/module/color_palette/ui/drawer_palet_edit_end_default.tsx b/src/module/color_palette/ui/drawer_palet_edit_end_default.tsx index 2dfc79c..047ee3c 100644 --- a/src/module/color_palette/ui/drawer_palet_edit_end_default.tsx +++ b/src/module/color_palette/ui/drawer_palet_edit_end_default.tsx @@ -49,7 +49,7 @@ export default function DrawerPaletEditEndDefault({ id, idVillage }: { id: strin return ( - + setModal(true)} > diff --git a/src/module/color_palette/ui/edit_palette_color.tsx b/src/module/color_palette/ui/edit_palette_color.tsx index 6af5063..405b636 100644 --- a/src/module/color_palette/ui/edit_palette_color.tsx +++ b/src/module/color_palette/ui/edit_palette_color.tsx @@ -1,7 +1,7 @@ "use client" 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 { Badge, Box, Button, Center, ColorInput, Flex, Pill, rem, SimpleGrid, Skeleton, Stack, Text, TextInput } from '@mantine/core'; import React, { useState } from 'react'; import { IEditTheme } from '../lib/type_theme'; import toast from 'react-hot-toast'; @@ -15,6 +15,7 @@ export default function EditPaletteColor() { const router = useRouter() const [isModal, setModal] = useState(false) const param = useParams<{ id: string }>() + const [loading, setLoading] = useState(true) const [touched, setTouched] = useState({ name: false, utama: false, @@ -38,15 +39,19 @@ export default function EditPaletteColor() { async function getOneData() { try { + setLoading(true) const res = await funGetThemeById(param.id) if (res.success) { setWarna(res.data) } else { toast.error(res.message); } + setLoading(false) } catch (error) { console.error(error) toast.error("Gagal menambahkan tema, coba lagi nanti"); + } finally { + setLoading(false) } } @@ -75,141 +80,154 @@ export default function EditPaletteColor() { - - { - setWarna({ ...isWarna, name: e.target.value }) - setTouched({ ...touched, name: true }) + {loading ? + + {Array(7) + .fill(null) + .map((_, i) => ( + + + + + ))} + + : + + { + setWarna({ ...isWarna, name: e.target.value }) + setTouched({ ...touched, name: true }) + } } - } - error={ - touched.name && ( - isWarna.name == "" ? "Judul Tema Tidak Boleh Kosong" : null - ) - } - /> - { - setWarna({ ...isWarna, utama: color }) - setTouched({ ...touched, utama: true }) + error={ + touched.name && ( + isWarna.name == "" ? "Judul Tema Tidak Boleh Kosong" : null + ) } - } - error={ - touched.utama && ( - isWarna.utama == "" ? "Warna Utama Tidak Boleh Kosong" : null - ) - } - /> - { - setWarna({ ...isWarna, bgUtama: color }) - setTouched({ ...touched, bgUtama: true }) + /> + { + setWarna({ ...isWarna, utama: color }) + setTouched({ ...touched, utama: true }) + } } - } - error={ - touched.bgUtama && ( - isWarna.bgUtama == "" ? "Background Utama Tidak Boleh Kosong" : null - ) - } - /> - { - setWarna({ ...isWarna, bgIcon: color }) - setTouched({ ...touched, bgIcon: true }) + error={ + touched.utama && ( + isWarna.utama == "" ? "Warna Utama Tidak Boleh Kosong" : null + ) } - } - error={ - touched.bgIcon && ( - isWarna.bgIcon == "" ? "Background Icon Tidak Boleh Kosong" : null - ) - } - /> - { - setWarna({ ...isWarna, bgFiturHome: color }) - setTouched({ ...touched, bgFiturHome: true }) + /> + { + setWarna({ ...isWarna, bgUtama: color }) + setTouched({ ...touched, bgUtama: true }) + } } - } - error={ - touched.bgFiturHome && ( - isWarna.bgFiturHome == "" ? "Background Fitur Home Tidak Boleh Kosong" : null - ) - } - /> - { - setWarna({ ...isWarna, bgFiturDivision: color }) - setTouched({ ...touched, bgFiturDivision: true }) + error={ + touched.bgUtama && ( + isWarna.bgUtama == "" ? "Background Utama Tidak Boleh Kosong" : null + ) } - } - error={ - touched.bgFiturDivision && ( - isWarna.bgFiturDivision == "" ? "Background Fitur Divisi Tidak Boleh Kosong" : null - ) - } - /> - { - setWarna({ ...isWarna, bgTotalKegiatan: color }) - setTouched({ ...touched, bgTotalKegiatan: true }) + /> + { + setWarna({ ...isWarna, bgIcon: color }) + setTouched({ ...touched, bgIcon: true }) + } } - } - error={ - touched.bgTotalKegiatan && ( - isWarna.bgTotalKegiatan == "" ? "Background Total Kegiatan Tidak Boleh Kosong" : null - ) - } - /> - + error={ + touched.bgIcon && ( + isWarna.bgIcon == "" ? "Background Icon Tidak Boleh Kosong" : null + ) + } + /> + { + setWarna({ ...isWarna, bgFiturHome: color }) + setTouched({ ...touched, bgFiturHome: true }) + } + } + error={ + touched.bgFiturHome && ( + isWarna.bgFiturHome == "" ? "Background Fitur Home Tidak Boleh Kosong" : null + ) + } + /> + { + setWarna({ ...isWarna, bgFiturDivision: color }) + setTouched({ ...touched, bgFiturDivision: true }) + } + } + error={ + touched.bgFiturDivision && ( + isWarna.bgFiturDivision == "" ? "Background Fitur Divisi Tidak Boleh Kosong" : null + ) + } + /> + { + setWarna({ ...isWarna, bgTotalKegiatan: color }) + setTouched({ ...touched, bgTotalKegiatan: true }) + } + } + error={ + touched.bgTotalKegiatan && ( + isWarna.bgTotalKegiatan == "" ? "Background Total Kegiatan Tidak Boleh Kosong" : null + ) + } + /> + + } - + {loading ? + + : + + } diff --git a/src/module/color_palette/ui/list_color_palette.tsx b/src/module/color_palette/ui/list_color_palette.tsx index 2fb5c65..53a423b 100644 --- a/src/module/color_palette/ui/list_color_palette.tsx +++ b/src/module/color_palette/ui/list_color_palette.tsx @@ -1,6 +1,6 @@ "use client" import { LayoutDrawer, LayoutNavbarNew, TEMA } from '@/module/_global'; -import { ActionIcon, Box, Checkbox, Flex, Group, Text } from '@mantine/core'; +import { ActionIcon, Box, Checkbox, Flex, Group, Skeleton, Text } from '@mantine/core'; import { useRouter } from 'next/navigation'; import React, { useState } from 'react'; import { FaCircleCheck } from 'react-icons/fa6'; @@ -24,18 +24,23 @@ export default function ListColorPalette() { const [isChooseName, setChooseName] = useState('') const [isChooseVillage, setChooseVillage] = useState('') const refresh = useHookstate(globalRefreshTheme) + const [loading, setLoading] = useState(true) async function loadData() { try { + setLoading(true) const res = await funGetAllTheme() if (res.success) { setData(res.data) } else { toast.error(res.message) } + setLoading(false) } catch (error) { console.error(error) toast.error("Gagal mendapatkan data tema, coba lagi nanti") + } finally { + setLoading(false) } } @@ -52,56 +57,68 @@ export default function ListColorPalette() { } /> - - {isData.map((v, i) => ( - - { - setChooseId(v.id) - setChooseName(v.name) - setChooseVillage(v.idVillage) - setOpenTambahan(true) - }} - > - - {v.name} - {v.isUse ? : <>} - - - - - - - - - - + {loading ? + Array(6) + .fill(null) + .map((_, i) => ( + + + - - ))} - + )) + : + + {isData.map((v, i) => ( + + { + setChooseId(v.id) + setChooseName(v.name) + setChooseVillage(v.idVillage) + setOpenTambahan(true) + }} + > + + {v.name} + {v.isUse ? : <>} + + + + + + + + + + + + + + ))} + + } setOpen(false)}> diff --git a/src/module/division_new/ui/list_division.tsx b/src/module/division_new/ui/list_division.tsx index abeb6b4..1ecd3e1 100644 --- a/src/module/division_new/ui/list_division.tsx +++ b/src/module/division_new/ui/list_division.tsx @@ -94,7 +94,7 @@ export default function ListDivision() { onChange={(val) => { searchDivision(val.target.value) }} /> - + {isList ? ( diff --git a/src/module/division_new/ui/list_document.tsx b/src/module/division_new/ui/list_document.tsx index 1600ae2..1bb51e0 100644 --- a/src/module/division_new/ui/list_document.tsx +++ b/src/module/division_new/ui/list_document.tsx @@ -4,7 +4,7 @@ import { Carousel } from "@mantine/carousel"; import { Box, Image, Text, Center, Paper, Stack, UnstyledButton, Skeleton, Group } from "@mantine/core"; import * as ICON from '../lib/file_icon' import { useParams, useRouter } from "next/navigation"; -import { useShallowEffect } from "@mantine/hooks"; +import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import toast from "react-hot-toast"; import { funGetDetailDivisionById } from "../lib/api_division"; import { IDataKalenderOnDetailDivision } from "../lib/type_division"; @@ -41,6 +41,7 @@ export default function ListDocumentOnDetailDivision() { useShallowEffect(() => { fetchData() }, [param.id]) + const isMobile = useMediaQuery('(max-width: 369px)'); return ( @@ -69,14 +70,14 @@ export default function ListDocumentOnDetailDivision() { data.map((v) => router.push(`/division/${param.id}/document`)}> - +
- image + image
- {v.name + '.' + v.extension} + {v.name + '.' + v.extension} diff --git a/src/module/division_new/ui/list_task.tsx b/src/module/division_new/ui/list_task.tsx index 67dce71..7ab3fac 100644 --- a/src/module/division_new/ui/list_task.tsx +++ b/src/module/division_new/ui/list_task.tsx @@ -2,7 +2,7 @@ import { TEMA } from "@/module/_global"; import { Carousel } from "@mantine/carousel"; import { Avatar, Box, 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 toast from "react-hot-toast"; import { CiClock2 } from "react-icons/ci"; @@ -42,6 +42,8 @@ export default function ListTaskOnDetailDivision() { fetchData() }, [param.id]) + const isMobile = useMediaQuery('(max-width: 369px)'); + return ( Tugas Hari Ini @@ -52,8 +54,8 @@ export default function ListTaskOnDetailDivision() { .fill(null) .map((_, i) => ( - - + + )) : @@ -67,7 +69,10 @@ export default function ListTaskOnDetailDivision() { {data.map((v, i) => - router.push(`/task/${v.id}`)} bg={tema.get().utama} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}> + router.push(`/task/${v.id}`)} bg={tema.get().utama} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}> {_.startCase(v.title)} diff --git a/src/module/document/ui/drawer_share_document.tsx b/src/module/document/ui/drawer_share_document.tsx index 9c5fc6c..83dfcd6 100644 --- a/src/module/document/ui/drawer_share_document.tsx +++ b/src/module/document/ui/drawer_share_document.tsx @@ -1,7 +1,7 @@ import { TEMA } from "@/module/_global"; import { funGetListDivisionByIdDivision, IDataDivison } from "@/module/division_new"; import { IDataMemberTaskDivision } from "@/module/task/lib/type_task"; -import { Box, Select, Button, Avatar, Divider, Flex, Group, Stack, Text, ActionIcon } from "@mantine/core"; +import { Box, Select, Button, Avatar, Divider, Flex, Group, Stack, Text, ActionIcon, ScrollArea } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import { useParams } from "next/navigation"; import { useState } from "react"; @@ -12,13 +12,13 @@ import { funShareDocument } from "../lib/api_document"; import { useHookstate } from "@hookstate/core"; import { globalRefreshDocument } from "../lib/val_document"; -export default function DrawerShareDocument({ data }: { data: IShareDivision[]}) { +export default function DrawerShareDocument({ data }: { data: IShareDivision[] }) { const [selectedFiles, setSelectedFiles] = useState([]) const [isData, setData] = useState([]) const param = useParams<{ id: string }>() const refresh = useHookstate(globalRefreshDocument) const tema = useHookstate(TEMA) - + async function onShare() { @@ -72,6 +72,12 @@ export default function DrawerShareDocument({ data }: { data: IShareDivision[]}) return ( + {isData.map((v, i) => { const isSelected = selectedFiles.some((i: any) => i?.id == v.id); return ( @@ -106,8 +112,9 @@ export default function DrawerShareDocument({ data }: { data: IShareDivision[]}) ); })} + - diff --git a/src/module/document/ui/navbar_document_division.tsx b/src/module/document/ui/navbar_document_division.tsx index 7dda41b..7a4069d 100644 --- a/src/module/document/ui/navbar_document_division.tsx +++ b/src/module/document/ui/navbar_document_division.tsx @@ -436,9 +436,9 @@ export default function NavbarDocumentDivision() { handleCheckboxChange(i)} /> diff --git a/src/module/group/ui/drawer_group.tsx b/src/module/group/ui/drawer_group.tsx index eaf7e85..28e27b0 100644 --- a/src/module/group/ui/drawer_group.tsx +++ b/src/module/group/ui/drawer_group.tsx @@ -47,7 +47,7 @@ export default function DrawerGroup({ onSuccess, }: { onSuccess: (val: boolean) setOpenDrawerGroup(true)} > diff --git a/src/module/home/ui/list_divisi.tsx b/src/module/home/ui/list_divisi.tsx index afe9a89..d02dcd4 100644 --- a/src/module/home/ui/list_divisi.tsx +++ b/src/module/home/ui/list_divisi.tsx @@ -8,7 +8,7 @@ import { useState } from "react"; import { IDataHomeDivision } from "../lib/type_home"; import { funGetHome } from "../lib/api_home"; import toast from "react-hot-toast"; -import { useShallowEffect } from "@mantine/hooks"; +import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import { useHookstate } from "@hookstate/core"; export default function ListDivisi() { @@ -41,6 +41,7 @@ export default function ListDivisi() { useShallowEffect(() => { fetchData(); }, []); + const isMobile = useMediaQuery('(max-width: 369px)'); return ( @@ -61,18 +62,21 @@ export default function ListDivisi() { {isData.map((v) => - + router.push(`/division/${v.id}`)}> - + - {v.name} + {v.name} - - KEGIATAN - {v.jumlah} + + KEGIATAN + {v.jumlah} diff --git a/src/module/home/ui/list_project.tsx b/src/module/home/ui/list_project.tsx index 34fafaa..5609c53 100644 --- a/src/module/home/ui/list_project.tsx +++ b/src/module/home/ui/list_project.tsx @@ -2,7 +2,7 @@ import { TEMA, WARNA } from "@/module/_global"; import { Carousel } from "@mantine/carousel"; import { Box, Card, Flex, Title, Text, Progress, Stack, Skeleton } from "@mantine/core"; -import { useShallowEffect } from "@mantine/hooks"; +import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import { useRouter } from "next/navigation"; import { useState } from "react"; import toast from "react-hot-toast"; @@ -41,6 +41,8 @@ export default function ListProjects() { useShallowEffect(() => { fetchData(); }, []); + + const isMobile = useMediaQuery('(max-width: 369px)'); return ( <> @@ -60,22 +62,25 @@ export default function ListProjects() { {isData.map((v) => - + router.push(`/project/${v.id}`)}> - + - {v.title} + {v.title} - + {v.progress}% - {v.createdAt} + {v.createdAt} diff --git a/src/module/task/ui/detail_progress_task.tsx b/src/module/task/ui/detail_progress_task.tsx index cbcd468..f7c1e6d 100644 --- a/src/module/task/ui/detail_progress_task.tsx +++ b/src/module/task/ui/detail_progress_task.tsx @@ -74,7 +74,7 @@ export default function ProgressDetailTask() { aria-label="Gradient action icon" radius={100} // gradient={{ from: "#DFDA7C", to: "#F2AF46", deg: 174 }} - bg={tema.get().bgFiturDivisi} + bg={tema.get().bgFiturDivision} > @@ -87,7 +87,7 @@ export default function ProgressDetailTask() { border: `1px solid ${"#BDBDBD"}`, }} w={"100%"} - color={tema.get().bgFiturDivisi} + color={tema.get().bgFiturDivision} radius="md" size={isMobile ? "lg" : "xl"} value={valProgress} diff --git a/src/module/task/ui/list_division_task.tsx b/src/module/task/ui/list_division_task.tsx index 35fe998..698b42b 100644 --- a/src/module/task/ui/list_division_task.tsx +++ b/src/module/task/ui/list_division_task.tsx @@ -117,12 +117,7 @@ export default function ListDivisionTask() { size={50} aria-label="Gradient action icon" radius={100} - // gradient={{ - // from: '#DFDA7C', - // to: '#F2AF46', - // deg: 174 - // }} - bg={tema.get().bgFiturDivisi} + bg={tema.get().bgFiturDivision} > diff --git a/src/module/task/ui/tabs_division_task.tsx b/src/module/task/ui/tabs_division_task.tsx index bbd833c..7d74a22 100644 --- a/src/module/task/ui/tabs_division_task.tsx +++ b/src/module/task/ui/tabs_division_task.tsx @@ -67,8 +67,8 @@ export default function TabsDivisionTask() { key={index} bg={ status == item.id - ? tema.get().bgFiturDivisi - : (status == null && item.id == "0") ? tema.get().bgFiturDivisi : "transparent" + ? tema.get().bgFiturDivision + : (status == null && item.id == "0") ? tema.get().bgFiturDivision : "transparent" } leftSection={item.icon} > diff --git a/src/module/user/member/ui/drawer_detail_member.tsx b/src/module/user/member/ui/drawer_detail_member.tsx index 2d2a48a..b8b4988 100644 --- a/src/module/user/member/ui/drawer_detail_member.tsx +++ b/src/module/user/member/ui/drawer_detail_member.tsx @@ -28,7 +28,7 @@ export default function DrawerDetailMember({ try { if (val) { const res = await funEditStatusMember(id, { - isActive: true, + isActive: status ? true : false, }); if (res.success) { toast.success(res.message); diff --git a/src/module/user/member/ui/drawer_list_member.tsx b/src/module/user/member/ui/drawer_list_member.tsx index e512fff..1f9b526 100644 --- a/src/module/user/member/ui/drawer_list_member.tsx +++ b/src/module/user/member/ui/drawer_list_member.tsx @@ -17,7 +17,7 @@ export default function DrawerListMember() { : - } size={40} onClick={() => openRef.current?.()}> + } size={40} onClick={() => openRef.current?.()}> () const router = useRouter() const [loading, setLoading] = useState(true) + const tema = useHookstate(TEMA) const [touched, setTouched] = useState({ nik: false, @@ -90,6 +92,7 @@ export default function EditProfile() { gap="xs" pt={30} px={20} + pb={100} > : - } size={40} onClick={() => openRef.current?.()}> + } size={40} onClick={() => openRef.current?.()}> { @@ -156,9 +159,9 @@ export default function EditProfile() { size="md" type="text" radius={30} placeholder="Nama" withAsterisk label="Nama" w={"100%"} styles={{ input: { - color: WARNA.biruTua, - borderRadius: WARNA.biruTua, - borderColor: WARNA.biruTua, + color: tema.get().utama, + borderRadius: tema.get().utama, + borderColor: tema.get().utama, }, }} onChange={(e) => { @@ -177,9 +180,9 @@ export default function EditProfile() { size="md" type="email" radius={30} placeholder="Email" withAsterisk label="Email" w={"100%"} styles={{ input: { - color: WARNA.biruTua, - borderRadius: WARNA.biruTua, - borderColor: WARNA.biruTua, + color: tema.get().utama, + borderRadius: tema.get().utama, + borderColor: tema.get().utama, }, }} onChange={(e) => { @@ -199,9 +202,9 @@ export default function EditProfile() { size="md" type="number" radius={30} placeholder="8xx xxxx xxxx" withAsterisk label="Nomor Telepon" w={"100%"} styles={{ input: { - color: WARNA.biruTua, - borderRadius: WARNA.biruTua, - borderColor: WARNA.biruTua, + color: tema.get().utama, + borderRadius: tema.get().utama, + borderColor: tema.get().utama, }, }} leftSection={+62} @@ -221,9 +224,9 @@ export default function EditProfile() { placeholder="Jenis Kelamin" label="Jenis Kelamin" w={"100%"} size="md" required withAsterisk radius={30} styles={{ input: { - color: WARNA.biruTua, - borderRadius: WARNA.biruTua, - borderColor: WARNA.biruTua, + color: tema.get().utama, + borderRadius: tema.get().utama, + borderColor: tema.get().utama, }, }} data={ @@ -256,14 +259,14 @@ export default function EditProfile() { {loading ? :