aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components/ui/circle.tsx
blob: 26764ec71e61d5c68d4b3d492f6b4bed40712e05 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
import { styled } from '../../style/theme';

export interface CircleProps {
    diameter: number;
    fillColor?: string;
}

export const Circle =
    styled.div <
    CircleProps >
    `
    && {
        width: ${props => props.diameter}px;
        height: ${props => props.diameter}px;
        background-color: ${props => props.fillColor};
        border-radius: 50%;
    }
`;

Circle.displayName = 'Circle';

Circle.defaultProps = {
    fillColor: 'white',
};