45 lines
1.1 KiB
JavaScript
45 lines
1.1 KiB
JavaScript
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>
|
|
`;
|
|
}
|