import { FC } from 'react';

import Typography from '@material-hu/mui/Typography';

import surfIcon from 'src/assets/svg/surfe.svg';

export type InvitePeopleTitleProps = {
  title: string;
};

export const InvitePeopleTitle: FC<InvitePeopleTitleProps> = props => {
  const { title } = props;

  return (
    <Typography
      color="textPrimary"
      sx={{
        display: 'flex',
        alignItems: 'center',
        fontSize: '20px',
        fontWeight: 'bold',
      }}
    >
      {title}
      <img
        src={surfIcon}
        alt=""
        style={{ width: '26px', height: '26px', marginLeft: '10px' }}
      />
    </Typography>
  );
};

export default InvitePeopleTitle;
