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): tweak filter styling

Browse Source
This commit is contained in:
psychedelicious 2024-08-28 08:07:36 +10:00
parent 2217fb8485
commit cf819e8eab
1 changed files with 6 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
invokeai/frontend/web/src/features/controlLayers/components/Filters/Filter.tsx
View File

@ -15,18 +15,6 @@ export const Filter = memo(() => {
const isFiltering = useStore(canvasManager.filter.$isFiltering); const isFiltering = useStore(canvasManager.filter.$isFiltering);
const isProcessing = useStore(canvasManager.filter.$isProcessing); const isProcessing = useStore(canvasManager.filter.$isProcessing);
const previewFilter = useCallback(() => {
canvasManager.filter.previewFilter();
}, [canvasManager.filter]);
const applyFilter = useCallback(() => {
canvasManager.filter.applyFilter();
}, [canvasManager.filter]);
const cancelFilter = useCallback(() => {
canvasManager.filter.cancelFilter();
}, [canvasManager.filter]);
const onChangeFilterConfig = useCallback( const onChangeFilterConfig = useCallback(
(filterConfig: FilterConfig) => { (filterConfig: FilterConfig) => {
canvasManager.filter.$config.set(filterConfig); canvasManager.filter.$config.set(filterConfig);
@ -65,24 +53,27 @@ export const Filter = memo(() => {
<FilterSettings filterConfig={config} onChange={onChangeFilterConfig} /> <FilterSettings filterConfig={config} onChange={onChangeFilterConfig} />
<ButtonGroup isAttached={false} size="sm" alignSelf="self-end"> <ButtonGroup isAttached={false} size="sm" alignSelf="self-end">
<Button <Button
variant="ghost"
leftIcon={<PiShootingStarBold />} leftIcon={<PiShootingStarBold />}
onClick={previewFilter} onClick={canvasManager.filter.previewFilter}
isLoading={isProcessing} isLoading={isProcessing}
loadingText={t('controlLayers.filter.preview')} loadingText={t('controlLayers.filter.preview')}
> >
{t('controlLayers.filter.preview')} {t('controlLayers.filter.preview')}
</Button> </Button>
<Button <Button
variant="ghost"
leftIcon={<PiCheckBold />} leftIcon={<PiCheckBold />}
onClick={applyFilter} onClick={canvasManager.filter.applyFilter}
isLoading={isProcessing} isLoading={isProcessing}
loadingText={t('controlLayers.filter.apply')} loadingText={t('controlLayers.filter.apply')}
> >
{t('controlLayers.filter.apply')} {t('controlLayers.filter.apply')}
</Button> </Button>
<Button <Button
variant="ghost"
leftIcon={<PiXBold />} leftIcon={<PiXBold />}
onClick={cancelFilter} onClick={canvasManager.filter.cancelFilter}
isLoading={isProcessing} isLoading={isProcessing}
loadingText={t('controlLayers.filter.cancel')} loadingText={t('controlLayers.filter.cancel')}
> >