LineOne's skeleton: placeholder blocks shown while the content loads, with a light wave passing over them or a pulse.
<.skeleton class="size-16" shape="circle" />
<.skeleton class="h-3 w-full" />
<.skeleton class="h-48 w-full" shape="square" />For the pulse, put animation="none" blocks inside an element with animate-pulse (as
LineOne does), or give a single block animation="pulse".
Summary
Functions
Renders a placeholder block; its size comes from class.
Functions
Renders a placeholder block; its size comes from class.
<.skeleton shape="circle" class="size-16" />
<.skeleton class="h-3 w-8/12" />Attributes
animation(:string) - Defaults to"wave". Must be one of"wave","pulse", or"none".shape(:string) -roundedis LineOne's small radius,lgthe large one,squarenone. Defaults to"rounded". Must be one of"rounded","pill","circle","square", or"lg".class(:any) - Defaults tonil.- Global attributes are accepted.