💄 Update AppShell menu and item styling

Co-authored-by: Bjorn L. <walkxnl@gmail.com>
This commit is contained in:
ajnart
2022-05-18 22:10:31 +02:00
parent 0400188ea7
commit b0be26300e
2 changed files with 15 additions and 5 deletions

View File

@@ -1,4 +1,4 @@
import { Menu, Modal, Text } from '@mantine/core';
import { Menu, Modal, Text, useMantineTheme } from '@mantine/core';
import { showNotification } from '@mantine/notifications';
import { useState } from 'react';
import { Check, Edit, Trash } from 'tabler-icons-react';
@@ -8,12 +8,13 @@ import { AddAppShelfItemForm } from './AddAppShelfItem';
export default function AppShelfMenu(props: any) {
const { service } = props;
const { config, setConfig } = useConfig();
const theme = useMantineTheme();
const [opened, setOpened] = useState(false);
return (
<>
<Modal
size="xl"
radius="lg"
radius="md"
opened={props.opened || opened}
onClose={() => setOpened(false)}
title="Modify a service"
@@ -28,7 +29,16 @@ export default function AppShelfMenu(props: any) {
message="Save service"
/>
</Modal>
<Menu position="right">
<Menu
position="right"
radius="md"
styles={{
body: {
backgroundColor:
theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],
},
}}
>
<Menu.Label>Settings</Menu.Label>
<Menu.Item
color="primary"