1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-11-30 20:28:09 +00:00

fix overlap of action button and close button in notification layout

This commit is contained in:
slowbackspace 2019-01-21 15:42:48 +01:00
parent 1280800c91
commit 67a1b6af4e

View File

@ -58,11 +58,8 @@ const Title = styled.div`
`; `;
const CloseClick = styled.div` const CloseClick = styled.div`
position: absolute; margin-left: 24px;
right: 0; align-self: flex-start;
top: 0;
padding-right: inherit;
padding-top: inherit;
cursor: pointer; cursor: pointer;
`; `;
@ -102,15 +99,6 @@ const Notification = (props: Props): React$Element<string> => {
<Wrapper className={props.className} type={props.type}> <Wrapper className={props.className} type={props.type}>
<Content> <Content>
{props.loading && <Loader size={50} /> } {props.loading && <Loader size={50} /> }
{props.cancelable && (
<CloseClick onClick={() => close()}>
<Icon
color={getPrimaryColor(props.type)}
icon={icons.CLOSE}
size={20}
/>
</CloseClick>
)}
<Body> <Body>
<IconWrapper> <IconWrapper>
<StyledIcon <StyledIcon
@ -138,6 +126,15 @@ const Notification = (props: Props): React$Element<string> => {
</ActionContent> </ActionContent>
)} )}
</AdditionalContent> </AdditionalContent>
{props.cancelable && (
<CloseClick onClick={() => close()}>
<Icon
color={getPrimaryColor(props.type)}
icon={icons.CLOSE}
size={20}
/>
</CloseClick>
)}
</Content> </Content>
</Wrapper> </Wrapper>
); );