mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
fix: crop tool overflows viewport with tall portrait images
The crop area flex container lacked min-h-0, preventing it from shrinking below its content's intrinsic height. For tall images, react-image-crop's CSS (max-height: inherit at specificity 0-1-1) overrides the Tailwind max-h constraint, and without min-h-0 the flex item refuses to shrink, causing viewport overflow. Closes #122
This commit is contained in:
@@ -98,7 +98,7 @@ export function CropCanvas({
|
||||
return (
|
||||
<div ref={containerRef} className="flex flex-col w-full h-full max-w-4xl mx-auto outline-none">
|
||||
{/* Crop area */}
|
||||
<div className="flex-1 flex items-center justify-center overflow-hidden bg-muted/20 p-4">
|
||||
<div className="flex-1 flex items-center justify-center overflow-hidden bg-muted/20 p-4 min-h-0">
|
||||
<ReactCrop
|
||||
crop={crop}
|
||||
onChange={(_pixelCrop, percentCrop) => onCropChange(percentCrop)}
|
||||
|
||||
Reference in New Issue
Block a user