mirror of
https://github.com/owncast/owncast.git
synced 2024-12-25 10:38:28 +03:00
7ff71985ea
* Issue#2662: Make Followers Content Fit With overflow ending in ellipsis * Prettified Code! * Fixed Linting Issue * Resolved line break issue --------- Co-authored-by: prachurjya15 <prachurjya15@users.noreply.github.com>
31 lines
1 KiB
TypeScript
31 lines
1 KiB
TypeScript
import { Avatar, Col, Row, Typography } from 'antd';
|
|
import React, { FC } from 'react';
|
|
import cn from 'classnames';
|
|
import { Follower } from '../../../../interfaces/follower';
|
|
import styles from './SingleFollower.module.scss';
|
|
|
|
export type SingleFollowerProps = {
|
|
follower: Follower;
|
|
};
|
|
|
|
export const SingleFollower: FC<SingleFollowerProps> = ({ follower }) => (
|
|
<div className={cn([styles.follower, 'followers-follower'])}>
|
|
<a href={follower.link} target="_blank" rel="noreferrer">
|
|
<Row wrap={false}>
|
|
<Col span={6}>
|
|
<Avatar src={follower.image} alt="Avatar" className={styles.avatar}>
|
|
<img src="/logo" alt="Logo" className={styles.placeholder} />
|
|
</Avatar>
|
|
</Col>
|
|
<Col span={18}>
|
|
<Row className={styles.name}>
|
|
<Typography.Text ellipsis>{follower.name}</Typography.Text>
|
|
</Row>
|
|
<Row className={styles.account}>
|
|
<Typography.Text ellipsis>{follower.username}</Typography.Text>
|
|
</Row>
|
|
</Col>
|
|
</Row>
|
|
</a>
|
|
</div>
|
|
);
|