import { CSSProperties } from 'react'

import handStarsIcon from '../assets/handStars.svg'

type PointsProps = {
    points: number | string,
}

const styles = {
    points: {
        float: 'right',
    } as CSSProperties,
    icon: {
        height: 24,
        paddingBottom: 5,
        marginRight: 5,
    } as CSSProperties,
}

function Points({ points }: PointsProps) {
    return (
        <h5>
            Набрано очков:
            <span style={styles.points}>
                <img
                    style={styles.icon}
                    src={handStarsIcon}
                    alt='Иконка руки, дающей звёзды' />
                {points}
            </span>
        </h5>
    )
}

export default Points