Deskripsi: - update global - update announcement - update update color palette - update group - update home - update position - update project - update member No Issue
46 lines
1.5 KiB
TypeScript
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 |