Adds a small badge in the upper-right corner of some content.
Reads the text from the ws-text attribute.
<ws-flex>
<div ws-x="[p.b 12px]">
Add a badge in the corner of some area, can control the color
</div>
<ws-badge ws-text="0" ws-x="[w 30%]">
<div ws-x="[p 8px] [b 1px solid @primary] [r 4px]">
<ws-icon class="bi-envelope">
Messages
</ws-icon>
</div>
</ws-badge>
<ws-badge ws-text="text" ws-x="[w 30%] [$color @secondary]">
<div ws-x="[p 8px] [b 1px solid @primary] [r 4px]">
<ws-icon class="bi-hexagon">
I Dunno
</ws-icon>
</div>
</ws-badge>
</ws-flex>