mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-10-24 03:59:50 +02:00
feat: better control layout
This commit is contained in:
1 parent
c057e295d2
commit
8160935081
1 file changed
+58
-56
@@ -292,52 +292,67 @@ export default function Page() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<PageWrapper color="crimson" size="100%">
|
<PageWrapper color="crimson" size="100%">
|
||||||
<Flex justify="center" gap="2" align="center" mt="4">
|
<Flex justify="center" gap="2" align="center" mt="4" direction="column">
|
||||||
<Dialog.Root
|
<Flex gap="2">
|
||||||
open={addTankDialogOpen}
|
<Dialog.Root
|
||||||
onOpenChange={setAddTankDialogOpen}
|
open={addTankDialogOpen}
|
||||||
>
|
onOpenChange={setAddTankDialogOpen}
|
||||||
<Dialog.Trigger>
|
>
|
||||||
<Button>
|
<Dialog.Trigger>
|
||||||
<PlusIcon /> Add
|
<Button>
|
||||||
</Button>
|
<PlusIcon /> Add
|
||||||
</Dialog.Trigger>
|
</Button>
|
||||||
|
</Dialog.Trigger>
|
||||||
|
|
||||||
<Dialog.Content>
|
<Dialog.Content>
|
||||||
<Flex gap="4" direction="column">
|
<Flex gap="4" direction="column">
|
||||||
<Flex
|
<Flex
|
||||||
direction="column"
|
direction="column"
|
||||||
gap="4"
|
gap="4"
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
justify="center"
|
justify="center"
|
||||||
>
|
>
|
||||||
<TankSearch
|
<TankSearch
|
||||||
compact
|
compact
|
||||||
onSelect={(tank) => {
|
onSelect={(tank) => {
|
||||||
mutateCompareTemporary((draft) => {
|
mutateCompareTemporary((draft) => {
|
||||||
draft.members.push(
|
draft.members.push(
|
||||||
tankToCompareMember(tank, awaitedSkillDefinitions),
|
|
||||||
);
|
|
||||||
draft.sorting = undefined;
|
|
||||||
});
|
|
||||||
setAddTankDialogOpen(false);
|
|
||||||
}}
|
|
||||||
onSelectAll={(tanks) => {
|
|
||||||
mutateCompareTemporary((draft) => {
|
|
||||||
draft.members.push(
|
|
||||||
...tanks.map((tank) =>
|
|
||||||
tankToCompareMember(tank, awaitedSkillDefinitions),
|
tankToCompareMember(tank, awaitedSkillDefinitions),
|
||||||
),
|
);
|
||||||
);
|
draft.sorting = undefined;
|
||||||
draft.sorting = undefined;
|
});
|
||||||
});
|
setAddTankDialogOpen(false);
|
||||||
setAddTankDialogOpen(false);
|
}}
|
||||||
}}
|
onSelectAll={(tanks) => {
|
||||||
/>
|
mutateCompareTemporary((draft) => {
|
||||||
|
draft.members.push(
|
||||||
|
...tanks.map((tank) =>
|
||||||
|
tankToCompareMember(tank, awaitedSkillDefinitions),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
draft.sorting = undefined;
|
||||||
|
});
|
||||||
|
setAddTankDialogOpen(false);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</Flex>
|
||||||
</Flex>
|
</Flex>
|
||||||
</Flex>
|
</Dialog.Content>
|
||||||
</Dialog.Content>
|
</Dialog.Root>
|
||||||
</Dialog.Root>
|
|
||||||
|
<Button
|
||||||
|
variant="soft"
|
||||||
|
color="red"
|
||||||
|
onClick={() => {
|
||||||
|
mutateCompareTemporary((draft) => {
|
||||||
|
draft.members = [];
|
||||||
|
draft.sorting = undefined;
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<TrashIcon /> Clear
|
||||||
|
</Button>
|
||||||
|
</Flex>
|
||||||
|
|
||||||
<SegmentedControl.Root
|
<SegmentedControl.Root
|
||||||
value={deltaMode}
|
value={deltaMode}
|
||||||
@@ -357,19 +372,6 @@ export default function Page() {
|
|||||||
Nominal
|
Nominal
|
||||||
</SegmentedControl.Item>
|
</SegmentedControl.Item>
|
||||||
</SegmentedControl.Root>
|
</SegmentedControl.Root>
|
||||||
|
|
||||||
<IconButton
|
|
||||||
variant="soft"
|
|
||||||
color="red"
|
|
||||||
onClick={() => {
|
|
||||||
mutateCompareTemporary((draft) => {
|
|
||||||
draft.members = [];
|
|
||||||
draft.sorting = undefined;
|
|
||||||
});
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<TrashIcon />
|
|
||||||
</IconButton>
|
|
||||||
</Flex>
|
</Flex>
|
||||||
|
|
||||||
{members.length > 0 && (
|
{members.length > 0 && (
|
||||||
|
|||||||
Reference in new issue
Block a user