31 lines
652 B
TypeScript
31 lines
652 B
TypeScript
import { getStyleScope, useSmartStylesheet } from ':plugins/SmartStylesheet.tsx'
|
|
|
|
export type MemberCardProps = {
|
|
id: string
|
|
icon: string
|
|
name: string
|
|
groups: string[]
|
|
}
|
|
|
|
const scope = getStyleScope(MemberCard)
|
|
|
|
export function MemberCard(
|
|
{ id, icon, name, groups }: MemberCardProps,
|
|
) {
|
|
useSmartStylesheet(import.meta, { scope })
|
|
|
|
return (
|
|
<div class={scope} style={{ backgroundImage: icon }}>
|
|
<div class='spacer'></div>
|
|
<div class='content'>
|
|
<h3>
|
|
<a href={`/membres/${id}`}>{name}</a>
|
|
</h3>
|
|
<div class='groups'>
|
|
{groups.map((group, index) => <span key={index}>{group}</span>)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|