Files
sistem-desa-mandiri/src/module/_global/layout/layout_navbar_new.tsx
lukman cbdaac6319 style : update tema
Deskripsi:
- update global
- update announcement
- update update color palette
- update group
- update home
- update position
- update project
- update member

No Issue
2024-09-12 17:31:00 +08:00

46 lines
1.5 KiB
TypeScript

'use client'
import { ActionIcon, Box, Grid, Group, Text, Title } from '@mantine/core';
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={tema.get().utama}
style={{
borderBottomLeftRadius: 20,
borderBottomRightRadius: 20,
zIndex: 900,
boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)"
}}
>
<Grid justify='center' align='center'>
{
state != undefined &&
<Grid.Col span="auto">
{state}
</Grid.Col>
}
{
back != undefined &&
<Grid.Col span="auto">
<LayoutIconBack back={back} />
</Grid.Col>
}
<Grid.Col span={8}>
<Title c={tema.get().bgUtama} ta={'center'} order={5} lineClamp={1}>{_.startCase(title)}</Title>
</Grid.Col>
<Grid.Col span="auto">
<Group justify='flex-end'>
{menu}
</Group>
</Grid.Col>
</Grid>
</Box>
);
}
export default LayoutNavbarNew