Avatar .avt
Identidade visual em miniatura: suporte para fotos, iniciais, status online e grupos com sobreposição dinâmica.
PP
Escala de Tamanhos
Formas e Imagens
Iniciais e Cores
JD
WF
X
Indicadores de Status (.avt-dot)
Online
.is-on
Ocupado
.is-bsy
Offline
.is-off
Grupo de Avatares (.avt-grp)
+3
Quick Reference
| Classe | Tipo | Descrição |
|---|---|---|
.avt |
Base | Container principal - 4rem circular, fundo primário por padrão. |
.is-pp, .is-p, .is-lg, .is-xg |
Tamanho | Escala de tamanhos: PP (2.4rem), P (3.2rem), padrão (4rem), LG (5.6rem), XG (7.2rem). |
.is-sq |
Forma | Converte o avatar circular em quadrado arredondado. |
.is-sec, .is-suc, .is-per, .is-ale, .is-neu |
Cor | Variantes de cor de fundo para avatares de iniciais: Secondary, Success, Peril, Alert, Neutral. |
.avt-dot |
Status | Habilita o indicador de presença (bolinha no canto inferior direito). |
.is-on, .is-bsy, .is-off |
Status | Cor do indicador: Online (verde), Busy/Ocupado (amarelo), Offline (cinza). |
.avt-grp |
Layout | Wrapper para empilhamento lateral com sobreposição. |