import {Fragment} from "react";
import './ColoredCircle.css'
import i18n from "i18next";

export const ColoredCircle = ({color, boolean}) => {
    const styles = {backgroundColor: '#F00'};

    if (boolean === undefined) {
        styles.backgroundColor = color
    } else {
        styles.backgroundColor = (boolean) ? '#00c700' : '#e50000';
    }

    return <Fragment>
        <span className="colored-circle" style={styles}/>
    </Fragment>
};

export const ColoredText = ({boolean, text={true: i18n.t('oui'), false: i18n.t('non')}}) => {
    const styles = {color: '#F00'};

    if (boolean !== undefined) {
        styles.color = (boolean) ? '#00c700' : '#e50000';
    }

    return <Fragment>
        <span className="font-weight-bold" style={styles}>{text[boolean]}</span>
    </Fragment>
};
