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): wip layouting

Browse Source
This commit is contained in:
psychedelicious
2023-05-08 00:55:31 +10:00
parent 3dc60254b9
commit 5365f42a04
25 changed files with 687 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
invokeai/frontend/web/src/features/parameters/components/AnimatedImageToImagePanel.tsx
View File

@ -20,7 +20,7 @@ const AnimatedImageToImagePanel = () => {
exit={{ opacity: 0, scale: 0, width: 0 }}
transition={{ type: 'spring', bounce: 0, duration: 0.35 }}
>
<Box sx={{ h: 'full', w: 'full', pl: 4 }}>
<Box sx={{ h: 'full', w: 'full' }}>
<ImageToImageSettings />
</Box>
</motion.div>

64
invokeai/frontend/web/src/features/parameters/components/ProcessButtons/CancelButton.tsx
View File

@ -11,7 +11,7 @@ import {
CancelStrategy,
} from 'features/system/store/systemSlice';
import { isEqual } from 'lodash-es';
import { useCallback, memo } from 'react';
import { useCallback, memo, useMemo } from 'react';
import {
ButtonSpinner,
ButtonGroup,
@ -102,39 +102,39 @@ const CancelButton = (
[isConnected, isProcessing, isCancelable]
);
const cancelLabel = useMemo(() => {
if (isCancelScheduled) {
return t('parameters.cancel.isScheduled');
}
if (cancelType === 'immediate') {
return t('parameters.cancel.immediate');
}
return t('parameters.cancel.schedule');
}, [t, cancelType, isCancelScheduled]);
const cancelIcon = useMemo(() => {
if (isCancelScheduled) {
return <ButtonSpinner />;
}
if (cancelType === 'immediate') {
return <MdCancel />;
}
return <MdCancelScheduleSend />;
}, [cancelType, isCancelScheduled]);
return (
<ButtonGroup isAttached width={btnGroupWidth}>
{cancelType === 'immediate' ? (
<IAIIconButton
icon={<MdCancel />}
tooltip={t('parameters.cancel.immediate')}
aria-label={t('parameters.cancel.immediate')}
isDisabled={!isConnected || !isProcessing || !isCancelable}
onClick={handleClickCancel}
colorScheme="error"
{...rest}
/>
) : (
<IAIIconButton
icon={
isCancelScheduled ? <ButtonSpinner /> : <MdCancelScheduleSend />
}
tooltip={
isCancelScheduled
? t('parameters.cancel.isScheduled')
: t('parameters.cancel.schedule')
}
aria-label={
isCancelScheduled
? t('parameters.cancel.isScheduled')
: t('parameters.cancel.schedule')
}
isDisabled={!isConnected || !isProcessing || !isCancelable}
onClick={handleClickCancel}
colorScheme="error"
{...rest}
/>
)}
<IAIIconButton
icon={cancelIcon}
tooltip={cancelLabel}
aria-label={cancelLabel}
isDisabled={!isConnected || !isProcessing || !isCancelable}
onClick={handleClickCancel}
colorScheme="error"
{...rest}
/>
<Menu closeOnSelect={false}>
<MenuButton