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

Separate group notifications with border

This commit is contained in:
Vladimir Volek 2018-10-10 17:29:43 +02:00 committed by Szymon Lesisz
parent 4072e9480d
commit 2ed673b05a
2 changed files with 11 additions and 2 deletions

View File

@ -21,6 +21,7 @@ type Props = {
type: string,
cancelable?: boolean;
title: string;
className: string;
message?: string;
actions?: Array<CallbackAction>;
close?: typeof NotificationActions.close,
@ -127,7 +128,7 @@ const Notification = (props: Props): React$Element<string> => {
const close: Function = typeof props.close === 'function' ? props.close : () => {}; // TODO: add default close action
return (
<Wrapper type={props.type}>
<Wrapper className={props.className} type={props.type}>
{props.loading && <Loader size={50} /> }
{props.cancelable && (
<CloseClick onClick={() => close()}>

View File

@ -32,6 +32,14 @@ const Title = styled.div`
color: ${props => props.color};
`;
const StyledNotification = styled(Notification)`
border-bottom: 1px solid ${props => getColor(props.type)};
&:last-child {
border: 0;
}
`;
class Group extends PureComponent {
constructor() {
super();
@ -87,7 +95,7 @@ class Group extends PureComponent {
{groupNotifications
.slice(0, this.state.visibleCount)
.map(notification => (
<Notification
<StyledNotification
key={notification.key}
type={notification.type}
title={notification.title}