x
1
<img class="inline-block rounded-lg avatar-md" src="https://placekitten.com/300/300" alt="">
1
render Elements::AvatarComponent.new(src: "https://placekitten.com/300/300", size: size, square: true)
Param Description Input

The size to display the avatar at.

This is a custom panel! See the documentation for details on how to add custom panels to your Lookbook instance.

avatar_component.css

1
2
3
4
5
6
7
8
9
10
11
12
13
@layer components {
.avatar-sm {
@apply h-10 w-10;
}
.avatar-md {
@apply h-20 w-20;
}
.avatar-lg {
@apply h-32 w-32;
}
}