Fix drop overlay with single rowed grids

This commit is contained in:
Mitchell McCaffrey 2021-05-21 16:12:32 +10:00
parent db460b2a4a
commit f496adae1d

View File

@ -43,11 +43,10 @@ function Sortable({ id, children }) {
borderWidth: "4px", borderWidth: "4px",
borderRadius: "4px", borderRadius: "4px",
borderStyle: over?.id === `__group__${id}` ? "solid" : "none", borderStyle: over?.id === `__group__${id}` ? "solid" : "none",
pointerEvents: "none",
}; };
return ( return (
<Box style={{ position: "relative" }}> <Box sx={{ position: "relative" }}>
<Box <Box
ref={setDraggableNodeRef} ref={setDraggableNodeRef}
style={dragStyle} style={dragStyle}
@ -56,12 +55,23 @@ function Sortable({ id, children }) {
> >
{children} {children}
</Box> </Box>
<Box ref={setDroppableNodeRef} style={sortDropStyle} bg="primary" />
<Box <Box
ref={setGroupNodeRef} sx={{
style={groupDropStyle} width: "100%",
sx={{ borderColor: "primary" }} height: 0,
/> paddingTop: "100%",
pointerEvents: "none",
position: "absolute",
top: 0,
}}
>
<Box ref={setDroppableNodeRef} style={sortDropStyle} bg="primary" />
<Box
ref={setGroupNodeRef}
style={groupDropStyle}
sx={{ borderColor: "primary" }}
/>
</Box>
</Box> </Box>
); );
} }