徽章组件用于渲染一个内部包含一些文本的小框:
<x-filament::badge>
New
</x-filament::badge>默认情况下,徽章的大小为“中等”。您可以使用 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>