56 lines
1.2 KiB
TypeScript
56 lines
1.2 KiB
TypeScript
import { Avatar } from 'antd';
|
|
import Title from 'antd/es/typography/Title';
|
|
|
|
interface HeaderProps {
|
|
title: string;
|
|
additionalContent?: React.ReactNode;
|
|
}
|
|
|
|
export default function Header({ title, additionalContent }: HeaderProps) {
|
|
return (
|
|
<div
|
|
style={{
|
|
height: '72px',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
}}
|
|
>
|
|
<Title style={{ marginLeft: '16px' }} level={3}>
|
|
{title}
|
|
</Title>
|
|
<div
|
|
style={{
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
gap: '24px',
|
|
marginRight: '26px',
|
|
}}
|
|
>
|
|
{additionalContent}
|
|
<img
|
|
src="./icons/header/more.svg"
|
|
alt="more"
|
|
style={{ height: '16px', width: '16px' }}
|
|
/>
|
|
<div
|
|
style={{
|
|
borderRadius: '50%',
|
|
border: '2px solid #8BC34A',
|
|
height: '32px',
|
|
width: '32px',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
}}
|
|
>
|
|
<Avatar
|
|
size={25.77}
|
|
src={`https://cdn-icons-png.flaticon.com/512/219/219986.png`}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|