export function avatar(name, side = 48) {
    const colors = [
        "#00AA55",
        "#009FD4",
        "#B381B3",
        "#939393",
        "#E3BC00",
        "#D47500",
        "#DC2A2A",
        "#3ede91",
        "#377dd4",
        "#0256b0",
        "#053d82",
        "#3d026e",
        "#b378e3",
        "#c4065c",
        "#543208",
        "#d97811",
        "#0c6b40",
    ];
    let initials = "";
    if (name.split(" ").length > 1) {
        initials =
            name.split(" ")[0].charAt(0).toUpperCase() +
            name.split(" ")[1].charAt(0).toUpperCase();
    } else {
        initials =
            name.split(" ")[0].charAt(0).toUpperCase() +
            name.split(" ")[0].charAt(1).toUpperCase();
    }

    let charIndex = name.charCodeAt(1) + name.length;
    let colorIndex = charIndex % 19;

    return `
    <div
        class="avatar"
        style="background-color:${
            colors[colorIndex]
        };height: ${side}px;width: ${side}px; font-size:${side / 2}px">
        <div class="avatar__letters">${initials}</div>
    </div>
    `;
}