徽章组件
概述
徽章组件用作在文本内部渲染小盒子:
<x-filament::badge>
New
</x-filament::badge>
设置徽章大小
默认情况下,徽章大小为 "medium"。你可以使用 size
属性将其设为“超小”或者“小”:
<x-filament::badge size="xs">
New
</x-filament::badge>
<x-filament::badge size="sm">
New
</x-filament::badge>
改变徽章颜色
默认情况下,徽章颜色为 "primary"。你可以使用 color
属性将其修改为 danger
、gray
、info
、success
或 warning
:
<x-filament::badge color="danger">
New
</x-filament::badge>
<x-filament::badge color="gray">
New
</x-filament::badge>
<x-filament::badge color="info">
New
</x-filament::badge>
<x-filament::badge color="success">
New
</x-filament::badge>
<x-filament::badge color="warning">
New
</x-filament::badge>
将图标添加到徽章
你可以使用 icon
属性,在徽章中添加图标:
<x-filament::badge icon="heroicon-m-sparkles">
New
</x-filament::badge>
你也可以修改使用 icon-position
属性修改图标位置,将其放到文本后面,而非前面。
<x-filament::badge
icon="heroicon-m-sparkles"
icon-position="after"
>
New
</x-filament::badge>