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:
parent
1280800c91
commit
67a1b6af4e
@ -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>
|
||||||
);
|
);
|
||||||
|
Loading…
Reference in New Issue
Block a user