Fix ScenarioEditor padding

This commit is contained in:
David Corbitt
2023-07-20 13:38:46 -07:00
parent 55c077d604
commit e885bdd365

View File

@@ -74,9 +74,8 @@ export default function ScenarioEditor({
return ( return (
<HStack <HStack
alignItems="flex-start" alignItems="flex-start"
pr={cellPadding.x} px={cellPadding.x}
py={cellPadding.y} py={cellPadding.y}
pl={canModify ? 0 : cellPadding.x}
spacing={0} spacing={0}
height="100%" height="100%"
draggable={!variableInputHovered} draggable={!variableInputHovered}
@@ -97,10 +96,13 @@ export default function ScenarioEditor({
onDrop={onReorder} onDrop={onReorder}
backgroundColor={isDragTarget ? "gray.100" : "transparent"} backgroundColor={isDragTarget ? "gray.100" : "transparent"}
> >
{canModify && ( {canModify && props.canHide && (
<Stack alignSelf="flex-start" opacity={props.hovered ? 1 : 0} spacing={0}> <Stack
{props.canHide && ( alignSelf="flex-start"
<> opacity={props.hovered ? 1 : 0}
spacing={0}
ml={-cellPadding.x}
>
<Tooltip label="Hide scenario" hasArrow> <Tooltip label="Hide scenario" hasArrow>
{/* for some reason the tooltip can't position itself properly relative to the icon without the wrapping box */} {/* for some reason the tooltip can't position itself properly relative to the icon without the wrapping box */}
<Button <Button
@@ -115,7 +117,7 @@ export default function ScenarioEditor({
cursor: "pointer", cursor: "pointer",
}} }}
> >
<Icon as={hidingInProgress ? Spinner : BsX} boxSize={6} /> <Icon as={hidingInProgress ? Spinner : BsX} boxSize={hidingInProgress ? 4 : 6} />
</Button> </Button>
</Tooltip> </Tooltip>
<Icon <Icon
@@ -124,8 +126,6 @@ export default function ScenarioEditor({
color="gray.400" color="gray.400"
_hover={{ color: "gray.800", cursor: "pointer" }} _hover={{ color: "gray.800", cursor: "pointer" }}
/> />
</>
)}
</Stack> </Stack>
)} )}