feat(ui): fix image fit

- Prevent init, current & control images from overflowing
This commit is contained in:
psychedelicious 2023-06-05 16:43:18 +10:00
parent b1000e30c1
commit 099e1e7c08
3 changed files with 7 additions and 2 deletions

View File

@ -60,7 +60,10 @@ const ControlNetImagePreview = (props: Props) => {
processorType !== 'none';
return (
<Box ref={containerRef} sx={{ position: 'relative', w: 'full', h: 'full' }}>
<Box
ref={containerRef}
sx={{ position: 'relative', w: 'full', h: 'full', aspectRatio: '1/1' }}
>
<IAIDndImage
image={controlImage}
onDrop={handleDrop}

View File

@ -51,6 +51,7 @@ const CurrentImageDisplay = () => {
alignItems: 'center',
justifyContent: 'center',
gap: 4,
position: 'absolute',
}}
>
<CurrentImagePreview />

View File

@ -72,9 +72,10 @@ const InitialImagePreview = () => {
sx={{
width: 'full',
height: 'full',
position: 'relative',
position: 'absolute',
alignItems: 'center',
justifyContent: 'center',
p: 4,
}}
>
<IAIDndImage