Noticescomponent

<div class="notice">
    ... content ...
</div>

<div class="notice marker-on-top">
    ... content ...
</div>

<div class="notice marker-on-right">
    ... content ...
</div>

<div class="notice marker-on-bottom">
    ... content ...
</div>

To set background color you can use predefined colors bg-*. To set color you can use predefined colors fg-*.

<div class="notice bg-amber fg-white">
    ... content ...
</div>

Data-* attributes fro popover

    <button class="button"
            data-popover="popover"
            data-popover-mode="click"
            data-popover-shadow="true"
            data-popover-position="top"
            data-popover-text="Button clicked"
            data-popover-background="bg-cyan"
            data-popover-color="fg-white">Click Me</button>

    <input type="text"
           placeholder="put cursor here"
           data-popover="popover"
           data-popover-position="right"
           data-popover-text="Please, input you data here"
           data-popover-background="bg-red"
           data-popover-color="fg-white"
           data-popover-mode="focus">

    <input type="text" id="popover_by_script"
           placeholder="Click button on right"
           data-popover="popover"
           data-popover-position="right"
           data-popover-text="Please, input you data here"
           data-popover-background="bg-red"
           data-popover-color="fg-white">
    <button class="button" onclick="$('#popover_by_script').popover('show')">Click me</button>