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:
@@ -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",
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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'>
|
||||
|
||||
Reference in New Issue
Block a user