Avatar
An image element with a fallback for representing the user.
import { Component } from '@angular/core';
import { HlmAvatarComponent } from '@spartan-ng/ui-avatar-helm';
@Component({
selector: 'spartan-avatar-preview',
standalone: true,
imports: [HlmAvatarComponent],
template: `
<hlm-avatar>
<img src='/assets/avatar.png' alt='spartan logo. Resembling a spartanic shield' hlmAvatarImage />
<span class='bg-destructive text-white' hlmAvatarFallback>RG</span>
</hlm-avatar>
`,
})
export class AvatarPreviewComponent {}
Installation
npx nx g @spartan-ng/nx:ui avatar
Usage
import { HlmAvatarComponent } from '@spartan-ng/ui-avatar-helm';
<hlm-avatar>
<img src='/assets/avatar.png' alt='spartan logo. Resembling a spartanic shield' hlmAvatarImage />
<span class='bg-destructive text-white' hlmAvatarFallback>RG</span>
</hlm-avatar>