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 brush fill UI

Browse Source
This commit is contained in:
psychedelicious 2024-08-29 09:07:20 +10:00
parent 292e00ab68
commit 0098c33f81
2 changed files with 9 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
invokeai/frontend/web/public/locales/en.json
View File

@ -1741,6 +1741,7 @@
"flipHorizontal": "Flip Horizontal", "flipHorizontal": "Flip Horizontal",
"flipVertical": "Flip Vertical", "flipVertical": "Flip Vertical",
"fill": { "fill": {
"fillColor": "Fill Color",
"fillStyle": "Fill Style", "fillStyle": "Fill Style",
"solid": "Solid", "solid": "Solid",
"grid": "Grid", "grid": "Grid",

20
invokeai/frontend/web/src/features/controlLayers/components/Tool/ToolFillColorPicker.tsx
View File

@ -1,4 +1,4 @@
import { Flex, Popover, PopoverBody, PopoverContent, PopoverTrigger } from '@invoke-ai/ui-library'; import { Box, Flex, Popover, PopoverBody, PopoverContent, PopoverTrigger, Tooltip } from '@invoke-ai/ui-library';
import { createSelector } from '@reduxjs/toolkit'; import { createSelector } from '@reduxjs/toolkit';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import IAIColorPicker from 'common/components/IAIColorPicker'; import IAIColorPicker from 'common/components/IAIColorPicker';
@ -23,17 +23,13 @@ export const ToolFillColorPicker = memo(() => {
return ( return (
<Popover isLazy> <Popover isLazy>
<PopoverTrigger> <PopoverTrigger>
<Flex <Flex role="button" aria-label={t('controlLayers.fill.fillColor')} tabIndex={-1} w={8} h={8}>
as="button" <Tooltip label={t('controlLayers.fill.fillColor')}>
aria-label={t('controlLayers.brushColor')} <Flex w="full" h="full" alignItems="center" justifyContent="center">
borderRadius="full" <Box borderRadius="full" w={6} h={6} borderWidth={1} bg={rgbaColorToString(fill)} />
borderWidth={1} </Flex>
bg={rgbaColorToString(fill)} </Tooltip>
w={8} </Flex>
h={8}
cursor="pointer"
tabIndex={-1}
/>
</PopoverTrigger> </PopoverTrigger>
<PopoverContent> <PopoverContent>
<PopoverBody minH={64}> <PopoverBody minH={64}>