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

feat(ui): style input fields

Browse Source
This commit is contained in:
psychedelicious 2023-08-30 13:19:37 +10:00
parent 9a2c0554de
commit 7b49f96472
2 changed files with 2 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/InputField.tsx
View File

@ -2,7 +2,6 @@ import { Box, Flex, FormControl, FormLabel, Tooltip } from '@chakra-ui/react';
import SelectionOverlay from 'common/components/SelectionOverlay'; import SelectionOverlay from 'common/components/SelectionOverlay';
import { useConnectionState } from 'features/nodes/hooks/useConnectionState'; import { useConnectionState } from 'features/nodes/hooks/useConnectionState';
import { useDoesInputHaveValue } from 'features/nodes/hooks/useDoesInputHaveValue'; import { useDoesInputHaveValue } from 'features/nodes/hooks/useDoesInputHaveValue';
import { useFieldInputKind } from 'features/nodes/hooks/useFieldInputKind';
import { useFieldTemplate } from 'features/nodes/hooks/useFieldTemplate'; import { useFieldTemplate } from 'features/nodes/hooks/useFieldTemplate';
import { useIsMouseOverField } from 'features/nodes/hooks/useIsMouseOverField'; import { useIsMouseOverField } from 'features/nodes/hooks/useIsMouseOverField';
import { HANDLE_TOOLTIP_OPEN_DELAY } from 'features/nodes/types/constants'; import { HANDLE_TOOLTIP_OPEN_DELAY } from 'features/nodes/types/constants';
@ -21,7 +20,6 @@ interface Props {
const InputField = ({ nodeId, fieldName }: Props) => { const InputField = ({ nodeId, fieldName }: Props) => {
const fieldTemplate = useFieldTemplate(nodeId, fieldName, 'input'); const fieldTemplate = useFieldTemplate(nodeId, fieldName, 'input');
const doesFieldHaveValue = useDoesInputHaveValue(nodeId, fieldName); const doesFieldHaveValue = useDoesInputHaveValue(nodeId, fieldName);
const input = useFieldInputKind(nodeId, fieldName);
const { const {
isConnected, isConnected,
@ -72,7 +70,6 @@ const InputField = ({ nodeId, fieldName }: Props) => {
shouldDim={shouldDim} shouldDim={shouldDim}
> >
<FormControl <FormControl
as={Flex}
isInvalid={isMissingInput} isInvalid={isMissingInput}
isDisabled={isConnected} isDisabled={isConnected}
sx={{ sx={{
@ -101,7 +98,6 @@ const InputField = ({ nodeId, fieldName }: Props) => {
<FormLabel <FormLabel
sx={{ sx={{
mb: 0, mb: 0,
width: input === 'connection' ? 'auto' : '25%',
flexShrink: 0, flexShrink: 0,
flexGrow: 0, flexGrow: 0,
}} }}
@ -117,11 +113,7 @@ const InputField = ({ nodeId, fieldName }: Props) => {
</Tooltip> </Tooltip>
)} )}
</FieldContextMenu> </FieldContextMenu>
<Box <Box>
sx={{
width: input === 'connection' ? 'auto' : '75%',
}}
>
<InputFieldRenderer nodeId={nodeId} fieldName={fieldName} /> <InputFieldRenderer nodeId={nodeId} fieldName={fieldName} />
</Box> </Box>
</FormControl> </FormControl>

2
invokeai/frontend/web/src/features/nodes/types/constants.ts
View File

@ -62,7 +62,7 @@ export const FIELDS: Record<FieldType, FieldUIConfig> = {
DenoiseMaskField: { DenoiseMaskField: {
title: 'Denoise Mask', title: 'Denoise Mask',
description: 'Denoise Mask may be passed between nodes', description: 'Denoise Mask may be passed between nodes',
color: 'red.700', color: 'base.500',
}, },
LatentsField: { LatentsField: {
title: 'Latents', title: 'Latents',