github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-02-13 03:05:11 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): ref images feel more like buttons

Browse Source
This commit is contained in:
psychedelicious
2025-06-17 12:17:19 +10:00
parent 32aa3e6d48
commit a7e45731ec
1 changed files with 15 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
invokeai/frontend/web/src/features/controlLayers/components/RefImage/RefImage.tsx
View File

@@ -1,3 +1,4 @@
import type { SystemStyleObject } from '@invoke-ai/ui-library';
import {
Divider,
Flex,
@@ -79,6 +80,18 @@ export const RefImage = memo(() => {
});
RefImage.displayName = 'RefImage';
const imageSx: SystemStyleObject = {
opacity: 0.7,
transitionProperty: 'opacity',
transitionDuration: 'normal',
_hover: {
opacity: 1,
},
'&[data-is-open="true"]': {
opacity: 1,
},
};
const Thumbnail = memo(({ disclosure }: { disclosure: UseDisclosure }) => {
const id = useRefImageIdContext();
const entity = useRefImageEntity(id);
@@ -123,8 +136,8 @@ const Thumbnail = memo(({ disclosure }: { disclosure: UseDisclosure }) => {
borderRadius="base"
onClick={disclosure.toggle}
flexShrink={0}
// sx={imageSx}
// data-is-open={disclosure.isOpen}
sx={imageSx}
data-is-open={disclosure.isOpen}
/>
</PopoverAnchor>
);