x
1
<div class="relative overflow-hidden bg-gray-200 dark:bg-gray-600 rounded-full w-10 h-10"><svg class="absolute text-gray-400 -left-1 w-12 h-12" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"></path></svg></div>
1
2
3
4
5
6
7
8
9
render Fluxbit::AvatarComponent.new( color: color == "" ? nil : color, rounded: rounded, placeholder_initials: placeholder_initials == "" ? false : placeholder_initials, status: status == "" ? false : status.to_sym, status_position: status_position.to_sym, size: size.to_sym, src: src == "" ? nil : src)
Fluxbit::AvatarComponent
You can use this component to display a message to the user
Param | Description | Input |
---|---|---|
Color |
|
|
Rounded? |
|
|
— |
|
|
Status |
|
|
Status |
|
|
Size |
|
|
— |
|