put edit button back in the layout flow!

This commit is contained in:
Matt Dunn-Rankin 2020-04-25 23:06:54 -07:00
parent 800cccf61c
commit a3778d0467

View file

@ -146,13 +146,13 @@ function OutfitHeading({ outfitState, dispatchToOutfit }) {
} }
> >
{({ isEditing, onRequestEdit }) => ( {({ isEditing, onRequestEdit }) => (
<> <Flex align="flex-top">
<EditablePreview /> <EditablePreview />
<EditableInput /> <EditableInput />
{!isEditing && ( {!isEditing && (
<OutfitNameEditButton onRequestEdit={onRequestEdit} /> <OutfitNameEditButton onRequestEdit={onRequestEdit} />
)} )}
</> </Flex>
)} )}
</Editable> </Editable>
</Heading1> </Heading1>
@ -164,12 +164,10 @@ function OutfitHeading({ outfitState, dispatchToOutfit }) {
function OutfitNameEditButton({ onRequestEdit }) { function OutfitNameEditButton({ onRequestEdit }) {
return ( return (
<PseudoBox <PseudoBox
d="inline-block"
opacity="0" opacity="0"
transition="opacity 0.5s" transition="opacity 0.5s"
_groupHover={{ opacity: "1" }} _groupHover={{ opacity: "1" }}
onClick={onRequestEdit} onClick={onRequestEdit}
position="absolute"
> >
<IconButton <IconButton
icon="edit" icon="edit"