feat: support gif toast (#3389)

This commit is contained in:
JimmFly
2023-07-27 13:37:18 +08:00
committed by GitHub
parent fa8086d525
commit bc27412425
5 changed files with 137 additions and 30 deletions

View File

@@ -288,10 +288,20 @@ function NotificationCard(props: NotificationCardProps): ReactElement {
}}
>
<div
className={clsx(styles.notificationContentStyle, {
className={clsx({
[typeStyle]: notification.theme,
[styles.hasMediaStyle]: notification.multimedia,
[styles.notificationContentStyle]: !notification.multimedia,
})}
>
{notification.multimedia ? (
<div className={styles.notificationMultimediaStyle}>
<>{notification.multimedia}</>
<IconButton className={styles.closeButtonWithMediaStyle}>
<CloseIcon onClick={onClickRemove} />
</IconButton>
</div>
) : null}
<Toast.Title
className={clsx(styles.notificationTitleStyle, {
[styles.darkColorStyle]: notification.theme === 'dark',
@@ -312,25 +322,28 @@ function NotificationCard(props: NotificationCardProps): ReactElement {
<div
className={clsx(styles.undoButtonStyle, {
[styles.darkColorStyle]: notification.theme === 'dark',
[styles.undoButtonWithMediaStyle]: notification.multimedia,
})}
onClick={onClickUndo}
>
UNDO
</div>
)}
<IconButton
className={clsx(styles.closeButtonStyle, {
[styles.closeButtonWithoutUndoStyle]: !notification.undo,
})}
style={{
color:
notification.theme === 'dark'
? 'var(--affine-white)'
: 'var(--affine-icon-color)',
}}
>
<CloseIcon onClick={onClickRemove} />
</IconButton>
{notification.multimedia ? null : (
<IconButton
className={clsx(styles.closeButtonStyle, {
[styles.closeButtonWithoutUndoStyle]: !notification.undo,
})}
style={{
color:
notification.theme === 'dark'
? 'var(--affine-white)'
: 'var(--affine-icon-color)',
}}
>
<CloseIcon onClick={onClickRemove} />
</IconButton>
)}
</Toast.Title>
<Toast.Description
className={clsx(styles.messageStyle, {