badgecomponent, implemented in Ruby. Use it like any other matestack component in your apps, pages and components. It offers customizable options to simply achieve what is possible in bootstrap with this component. See below for more information about the possible options.
Returns a bootstrap badge containing text and/or content specified by a block. Also the badge is customizable with the following options.
:variant- Specify a variant for the badge. Variant represent bootstraps contextual classes and can have one of the following values:
:primary, :secondary, :success, :info, :warning, :info, :light, :darkor your custom contextual class. The default is
false. By default is set as
false. Set this parameter to true to apply bootstraps "rounded-pill" class.
:text- Expects a string which gets displayed plain inside the badge. If a text and block is given, the text will be rendered before the block content.
:visually_hidden- Screen reader only text like bootstrap establishes it, following the badge in another "span" containing the given string. As default no screen reader only "span" and text is rendered.
&block- Use a block to create custom content/markup inside a badge. If used together with
:textthe text will be displayed before the block.
- Html attributes - all w3c confirm html attributes for span's can be set via options and will be added to the surrounding badge span.
<span class="badge bg-secondary"></span>
bs_badge variant: :warning do
paragraph "Custom inner html"
<span class="badge bg-warning">
<p>Custom inner html</p>
bs_badge "Success", variant: :success, rounded: true
<span class="badge rounded-pill bg-success">Success</span>