replace margins with padding in the chat container (#3165)

Virtuoso can't calculate the size of elements that have margins. This causes
strange behaviour with scrolling in chat.

Co-authored-by: janWilejan <>
This commit is contained in:
janWilejan
2023-07-11 20:07:58 +00:00
committed by GitHub
parent f6182229f5
commit 101174f71e
8 changed files with 46 additions and 33 deletions

View File

@@ -39,22 +39,24 @@ export const ChatSocialMessage: FC<ChatSocialMessageProps> = ({ message }) => {
}
return (
<div className={cn([styles.follower, 'chat-message_social'])}>
<a href={link} target="_blank" rel="noreferrer">
<Row wrap={false}>
<Col span={6} className={styles.avatarColumn}>
<Avatar src={image} alt="Avatar" className={styles.avatar} size="large">
{title.charAt(0).toUpperCase()}
</Avatar>
<div className={styles.followerPadding}>
<div className={cn([styles.follower, 'chat-message_social'])}>
<a href={link} target="_blank" rel="noreferrer">
<Row wrap={false}>
<Col span={6} className={styles.avatarColumn}>
<Avatar src={image} alt="Avatar" className={styles.avatar} size="large">
{title.charAt(0).toUpperCase()}
</Avatar>
<Icon className={styles.icon} />
</Col>
<Col>
<Row className={styles.account}>{title}</Row>
<Row className={styles.body} dangerouslySetInnerHTML={{ __html: body }} />
</Col>
</Row>
</a>
<Icon className={styles.icon} />
</Col>
<Col>
<Row className={styles.account}>{title}</Row>
<Row className={styles.body} dangerouslySetInnerHTML={{ __html: body }} />
</Col>
</Row>
</a>
</div>
</div>
);
};