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): Set Min Width for Nodes

Browse Source
This commit is contained in:
blessedcoolant 2023-04-23 00:55:43 +12:00
parent f258aba6d1
commit b73fd2a6d2
3 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
invokeai/frontend/web/src/app/constants.ts
View File

@ -60,3 +60,5 @@ export const IN_PROGRESS_IMAGE_TYPES: Array<{
{ key: 'Fast', value: 'latents' }, { key: 'Fast', value: 'latents' },
{ key: 'Accurate', value: 'full-res' }, { key: 'Accurate', value: 'full-res' },
]; ];
export const NODE_MIN_WIDTH = 250;

3
invokeai/frontend/web/src/features/nodes/components/IAINode/IAINodeResizer.tsx
View File

@ -1,3 +1,4 @@
import { NODE_MIN_WIDTH } from 'app/constants';
import { memo } from 'react'; import { memo } from 'react';
import { NodeResizeControl, NodeResizerProps } from 'reactflow'; import { NodeResizeControl, NodeResizerProps } from 'reactflow';
@ -14,7 +15,7 @@ const IAINodeResizer = (props: NodeResizerProps) => {
bottom: 0, bottom: 0,
right: 0, right: 0,
}} }}
minWidth={350} minWidth={NODE_MIN_WIDTH}
{...rest} {...rest}
></NodeResizeControl> ></NodeResizeControl>
); );

2
invokeai/frontend/web/src/features/nodes/components/InvocationComponent.tsx
View File

@ -12,6 +12,7 @@ import { RootState } from 'app/store';
import { AnyInvocationType } from 'services/events/types'; import { AnyInvocationType } from 'services/events/types';
import { createSelector } from '@reduxjs/toolkit'; import { createSelector } from '@reduxjs/toolkit';
import { useAppSelector } from 'app/storeHooks'; import { useAppSelector } from 'app/storeHooks';
import { NODE_MIN_WIDTH } from 'app/constants';
type InvocationComponentWrapperProps = PropsWithChildren & { type InvocationComponentWrapperProps = PropsWithChildren & {
selected: boolean; selected: boolean;
@ -28,6 +29,7 @@ const InvocationComponentWrapper = (props: InvocationComponentWrapperProps) => {
sx={{ sx={{
position: 'relative', position: 'relative',
borderRadius: 'md', borderRadius: 'md',
minWidth: NODE_MIN_WIDTH,
boxShadow: props.selected boxShadow: props.selected
? `${nodeSelectedOutline}, ${nodeShadow}` ? `${nodeSelectedOutline}, ${nodeShadow}`
: `${nodeShadow}`, : `${nodeShadow}`,