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 slider divider styling

Browse Source
This commit is contained in:
psychedelicious 2024-06-01 19:17:18 +10:00
parent 08bcc71e99
commit 8bb9571485
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageComparisonSlider.tsx
View File

@ -11,7 +11,7 @@ import type { ImageDTO } from 'services/api/types';
const DROP_SHADOW = 'drop-shadow(0px 0px 4px rgb(0, 0, 0))';
const INITIAL_POS = '50%';
const HANDLE_WIDTH = 1;
const HANDLE_WIDTH = 2;
const HANDLE_WIDTH_PX = `${HANDLE_WIDTH}px`;
const HANDLE_HITBOX = 20;
const HANDLE_HITBOX_PX = `${HANDLE_HITBOX}px`;
@ -226,15 +226,16 @@ export const ImageComparisonSlider = memo(({ firstImage, secondImage }: Props) =
bottom={0}
left={left}
w={HANDLE_HITBOX_PX}
tabIndex={-1}
cursor="ew-resize"
filter={DROP_SHADOW}
opacity={0.8}
color="base.50"
>
<Box
id="image-comparison-handle-divider"
w={HANDLE_WIDTH_PX}
h="full"
bg="base.50"
bg="currentColor"
shadow="dark-lg"
position="absolute"
top={0}