Badge

Small status indicators with gradient backgrounds. Use for important status labels, counts, and highlights.

Variants

Primary Success Warning Danger Purple Secondary Info

Without Icons

42 New Draft

// Using the component helper
<?= $m->badge('id', 'Primary')->primary()->icon('fa-star') ?>
<?= $m->badge('id', 'Success')->success()->icon('fa-check') ?>
<?= $m->badge('id', '42')->primary() ?>

// Using raw CSS classes
<span class="m-badge m-badge-primary">
    <i class="fas fa-star"></i> Primary
</span>

PHP PHP Methods (Fluent)

Method / Property	Parameters	Description
`$m->badge($id, $text)`	`string, string`	Create a badge component.
`->text($text)`	`string`	Set badge text.
`->icon($faIcon)`	`string`	Add a Font Awesome icon.
`->variant($variant)`	`string`	Set the colour variant.
`->primary()`		Apply primary variant.
`->success()`		Apply success (green) variant.
`->warning()`		Apply warning (orange) variant.
`->danger()`		Apply danger (red) variant.
`->purple()`		Apply purple variant.
`->secondary()`		Apply secondary (grey) variant.
`->info()`		Apply info (blue) variant.

PHP CSS Classes

Method / Property	Parameters	Description
`.m-badge`		Base badge styling.
`.m-badge-primary`		Blue gradient.
`.m-badge-success`		Green gradient.
`.m-badge-warning`		Orange gradient.
`.m-badge-danger`		Red gradient.
`.m-badge-purple`		Purple gradient.
`.m-badge-secondary`		Grey gradient.
`.m-badge-info`		Light blue gradient.