feat(dross): avatar component (soft-eye / wisp / motes)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
root
2026-06-09 23:58:03 +10:00
parent 4535b03207
commit f52fb05f5e
2 changed files with 41 additions and 0 deletions

View File

@@ -0,0 +1,20 @@
// public/components/dross_avatar.js
import { el } from '../dom.js';
// Returns a .dross-orb element rendering the chosen avatar. Colours come from
// CSS vars (--dross*), set on the element by the caller for per-user accent.
export function drossAvatar(variant = 'soft-eye', size = 60) {
let inner;
if (variant === 'wisp') {
inner = [el('div', { class: 'b-core' }), el('div', { class: 'b-bright' })];
} else if (variant === 'motes') {
inner = [
el('div', { class: 'd-ring' }, el('div', { class: 'd-mote' })),
el('div', { class: 'd-ring r2' }, el('div', { class: 'd-mote' })),
el('div', { class: 'd-core' })
];
} else { // soft-eye (default)
inner = [el('div', { class: 'av-eye' }, el('div', { class: 'av-pupil' }))];
}
return el('div', { class: 'dross-orb', style: { width: size + 'px', height: size + 'px' } }, ...inner);
}