style : update tema

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

View File

@@ -1,11 +1,14 @@
import { Box, Drawer, Text } from '@mantine/core';
import React from 'react';
import { WARNA } from '../fun/WARNA';
import { useHookstate } from '@hookstate/core';
import { TEMA } from '../bin/val_global';
export default function LayoutDrawer({ opened, onClose, title, children, size }: { children: React.ReactNode, opened: boolean, size?: string, onClose: () => void, title: React.ReactNode }) {
const tema = useHookstate(TEMA)
return (
<Box>
<Drawer opened={opened} title={<Text c={WARNA.biruTua} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%'}
<Drawer opened={opened} title={<Text c={tema.get().utama} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%'}
styles={{
content: {
backgroundColor: "white",

View File

@@ -5,9 +5,12 @@ import React from 'react';
import { HiChevronLeft } from 'react-icons/hi2';
import { WARNA } from '../fun/WARNA';
import _ from 'lodash';
import { useHookstate } from '@hookstate/core';
import { TEMA } from '../bin/val_global';
function LayoutIconBack({ back }: { back?: string }) {
const router = useRouter()
const tema = useHookstate(TEMA)
return (
<Box>
<ActionIcon variant="light" onClick={() => {
@@ -17,7 +20,7 @@ function LayoutIconBack({ back }: { back?: string }) {
return router.back()
}
}} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
}} bg={tema.get().bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiChevronLeft size={20} color='white' />
</ActionIcon>
</Box>

View File

@@ -1,17 +1,20 @@
import { Image, rem, Stack, Title } from "@mantine/core";
import React from "react";
import { WARNA } from "../fun/WARNA";
import { useHookstate } from "@hookstate/core";
import { TEMA } from "../bin/val_global";
export default function LayoutLogin({
children,
}: {
children: React.ReactNode;
}) {
}) {
const tema = useHookstate(TEMA)
return (
<>
<Stack justify="center" align="center" pt={rem(50)}>
<Image w={102} h={103} src={"/assets/img/logo/logo-1.png"} alt="logo" />
<Title c={WARNA.biruTua} order={4}>
<Title c={tema.get().utama} order={4}>
PERBEKEL DARMASABA
</Title>
</Stack>

View File

@@ -1,4 +1,4 @@
import { Box, Button, Flex, Group, Modal, Text } from '@mantine/core';
import { Box, Button, Flex, Group, Modal, SimpleGrid, Text } from '@mantine/core';
import React, { useState } from 'react';
import { BsQuestionCircleFill } from 'react-icons/bs';
import { WARNA } from '../fun/WARNA';
@@ -18,11 +18,14 @@ export default function LayoutModal({ opened, onClose, description, onYes }: { o
<Flex justify={"center"} align={"center"} direction={"column"}>
<BsQuestionCircleFill size={100} color="red" />
<Text mt={30} ta={"center"} fw={"bold"} fz={18}>{description}</Text>
<Group mt={30} w={'100%'} justify='center'>
<Button w={"47%"} size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
<Button w={"47%"} size="lg" radius={'xl'} bg={WARNA.biruTua} onClick={() => onYes(true)}>YA</Button>
</Group>
</Flex>
<SimpleGrid
cols={{ base: 1, sm: 2, lg: 2 }}
mt={30}
>
<Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
<Button fullWidth size="lg" radius={'xl'} bg={WARNA.biruTua} onClick={() => onYes(true)}>YA</Button>
</SimpleGrid>
</Modal>
);
}

View File

@@ -1,10 +1,14 @@
"use client"
import { Box, Grid, Group } from '@mantine/core';
import React from 'react';
import { WARNA } from '../fun/WARNA';
import { useHookstate } from '@hookstate/core';
import { TEMA } from '../bin/val_global';
export const LayoutNavbarHome = ({ children }: { children: React.ReactNode }) => {
const tema = useHookstate(TEMA)
return (
<Box pt={25} pl={20} pr={20} m={0} pos={'sticky'} top={0} pb={25} bg={WARNA.biruTua}
<Box pt={25} pl={20} pr={20} m={0} pos={'sticky'} top={0} pb={25} bg={tema.get().utama}
style={{
borderBottomLeftRadius: 20,
borderBottomRightRadius: 20,

View File

@@ -4,10 +4,13 @@ import React from 'react';
import { WARNA } from '../fun/WARNA';
import LayoutIconBack from './layout_icon_back';
import _ from 'lodash';
import { useHookstate } from '@hookstate/core';
import { TEMA } from '../bin/val_global';
export const LayoutNavbarNew = ({ back, state, title, menu }: { back?: string, title: string, menu: React.ReactNode, state?: React.ReactNode }) => {
const tema = useHookstate(TEMA)
return (
<Box pt={25} pl={20} pr={20} m={0} pos={'sticky'} top={0} pb={25} bg={WARNA.biruTua}
<Box pt={25} pl={20} pr={20} m={0} pos={'sticky'} top={0} pb={25} bg={tema.get().utama}
style={{
borderBottomLeftRadius: 20,
borderBottomRightRadius: 20,
@@ -29,7 +32,7 @@ export const LayoutNavbarNew = ({ back, state, title, menu }: { back?: string, t
</Grid.Col>
}
<Grid.Col span={8}>
<Title c={WARNA.bgWhite} ta={'center'} order={5} lineClamp={1}>{_.startCase(title)}</Title>
<Title c={tema.get().bgUtama} ta={'center'} order={5} lineClamp={1}>{_.startCase(title)}</Title>
</Grid.Col>
<Grid.Col span="auto">
<Group justify='flex-end'>