enhance picture uploader, change justify content (#6974)

Fixes https://github.com/twentyhq/twenty/issues/6966

to put label in the place and change remove button to gray.

sorry you dont assign this to me but I want to help, hope that if 6
hours pass u could check it

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Heber Santiago Alvarez Rincon
2024-09-18 08:08:28 -05:00
committed by GitHub
parent 55a3ee2c3b
commit 44587b4908

View File

@@ -52,16 +52,17 @@ const StyledContent = styled.div`
display: flex; display: flex;
flex: 1; flex: 1;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: start;
margin-left: ${({ theme }) => theme.spacing(4)}; margin-left: ${({ theme }) => theme.spacing(4)};
gap: ${({ theme }) => theme.spacing(3)};
`; `;
const StyledButtonContainer = styled.div` const StyledButtonContainer = styled.div`
display: flex; display: flex;
flex-direction: row; flex-direction: row;
> * + * {
margin-left: ${({ theme }) => theme.spacing(2)}; gap: ${({ theme }) => theme.spacing(2)};
}
`; `;
const StyledText = styled.span` const StyledText = styled.span`
@@ -143,7 +144,6 @@ export const ImageInput = ({
variant="secondary" variant="secondary"
title="Abort" title="Abort"
disabled={!pictureURI || disabled} disabled={!pictureURI || disabled}
fullWidth
/> />
) : ( ) : (
<Button <Button
@@ -152,17 +152,14 @@ export const ImageInput = ({
variant="secondary" variant="secondary"
title="Upload" title="Upload"
disabled={disabled} disabled={disabled}
fullWidth
/> />
)} )}
<Button <Button
Icon={IconTrash} Icon={IconTrash}
accent="danger"
onClick={onRemove} onClick={onRemove}
variant="secondary" variant="secondary"
title="Remove" title="Remove"
disabled={!pictureURI || disabled} disabled={!pictureURI || disabled}
fullWidth
/> />
</StyledButtonContainer> </StyledButtonContainer>
<StyledText> <StyledText>