Ryan/docmost-ryan
1
0
Fork 0
mirror of https://github.com/Shadowfita/docmost.git synced 2025-11-17 18:21:04 +10:00
Code Issues Packages Projects Releases Wiki Activity

Wrap menu in a filled fieldset

Browse Source
This commit is contained in:
Ryan Palmer
2024-09-04 15:21:12 +10:00
parent bd15401e7f
commit 9a11d1d086
1 changed files with 27 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
apps/client/src/features/editor/components/table-of-contents/table-of-contents-menu.tsx
View File

@ -13,6 +13,7 @@ import {
Text, Text,
Checkbox, Checkbox,
Card, Card,
Fieldset,
} from "@mantine/core"; } from "@mantine/core";
import { IconLayoutAlignCenter, IconLayoutAlignLeft, IconLayoutAlignRight } from "@tabler/icons-react"; import { IconLayoutAlignCenter, IconLayoutAlignLeft, IconLayoutAlignRight } from "@tabler/icons-react";
import { NodeWidthResize } from "@/features/editor/components/common/node-width-resize.tsx"; import { NodeWidthResize } from "@/features/editor/components/common/node-width-resize.tsx";
@ -81,7 +82,8 @@ export function TableOfContentsMenu({ editor }: EditorMenuProps) {
}} }}
shouldShow={shouldShow} shouldShow={shouldShow}
> >
<Group gap={0}> <Fieldset variant="filled" p="xs">
<Group gap="xs">
<Tooltip position="top" label="Divider type"> <Tooltip position="top" label="Divider type">
<Select <Select
w={100} w={100}
@ -103,13 +105,6 @@ export function TableOfContentsMenu({ editor }: EditorMenuProps) {
/> />
</Tooltip> </Tooltip>
<Tooltip position="top" label="Show page icons"> <Tooltip position="top" label="Show page icons">
<Card
p="xs"
m={0}
onClick={() => setPageIcons(!editor.getAttributes("tableOfContents").icons)}
style={{ cursor: "pointer" }}
withBorder
>
<Group gap="xs"> <Group gap="xs">
<Text size="sm">Page Icons</Text> <Text size="sm">Page Icons</Text>
<Checkbox <Checkbox
@ -117,9 +112,9 @@ export function TableOfContentsMenu({ editor }: EditorMenuProps) {
onChange={(event) => setPageIcons(event.currentTarget.checked)} onChange={(event) => setPageIcons(event.currentTarget.checked)}
/> />
</Group> </Group>
</Card>
</Tooltip> </Tooltip>
</Group> </Group>
</Fieldset>
</BaseBubbleMenu> </BaseBubbleMenu>
); );
} }