Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): better node footer spacing

Browse Source
This commit is contained in:
psychedelicious
2024-01-06 08:43:55 +11:00
parent 6e06935e75
commit f51e8eeae1
3 changed files with 12 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeFooter.tsx
View File

@ -1,4 +1,6 @@
import type { ChakraProps } from '@chakra-ui/react';
import { Flex } from '@chakra-ui/react';
import { InvControlGroup } from 'common/components/InvControl/InvControlGroup';
import { useHasImageOutput } from 'features/nodes/hooks/useHasImageOutput';
import { DRAG_HANDLE_CLASSNAME } from 'features/nodes/types/constants';
import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
@ -11,6 +13,8 @@ type Props = {
nodeId: string;
};
const props: ChakraProps = { w: 'unset' };
const InvocationNodeFooter = ({ nodeId }: Props) => {
const hasImageOutput = useHasImageOutput(nodeId);
const isCacheEnabled = useFeatureStatus('invocationCache').isFeatureEnabled;
@ -20,13 +24,16 @@ const InvocationNodeFooter = ({ nodeId }: Props) => {
layerStyle="nodeFooter"
w="full"
borderBottomRadius="base"
gap={4}
px={2}
py={0}
h={8}
justifyContent="space-between"
>
{isCacheEnabled && <UseCacheCheckbox nodeId={nodeId} />}
{hasImageOutput && <SaveToGalleryCheckbox nodeId={nodeId} />}
<InvControlGroup controlProps={props} labelProps={props}>
{isCacheEnabled && <UseCacheCheckbox nodeId={nodeId} />}
{hasImageOutput && <SaveToGalleryCheckbox nodeId={nodeId} />}
</InvControlGroup>
</Flex>
);
};