Utility classes
Text highlight
Highlight a part of a text.
- Default
- Inverse
Text classes
Set the foreground color of an element.
- Default
- Inverse
Background classes
Set the background and foreground colors of an element.
lui-bg-default
lui-bg-alt
lui-bg-inverse
lui-bg-inverse-alt
lui-bg-info
lui-bg-danger
lui-bg-warning
lui-bg-success
<div class="lui-bg-default" style="padding: 5px;">
lui-bg-default
</div>
<div class="lui-bg-alt" style="padding: 5px;">
lui-bg-alt
</div>
<div class="lui-bg-inverse" style="padding: 5px;">
lui-bg-inverse
</div>
<div class="lui-bg-inverse-alt" style="padding: 5px;">
lui-bg-inverse-alt
</div>
<div class="lui-bg-info" style="padding: 5px;">
lui-bg-info
</div>
<div class="lui-bg-danger" style="padding: 5px;">
lui-bg-danger
</div>
<div class="lui-bg-warning" style="padding: 5px;">
lui-bg-warning
</div>
<div class="lui-bg-success" style="padding: 5px;">
lui-bg-success
</div>
Helper classes
Remove rounded corners.
Simple Button
Group buttons
Input
Checkbox
Radio buttons
Select
Switch
<button class="lui-button lui-noround">Default</button>
<div class="lui-buttongroup">
<button class="lui-button lui-noround lui-buttongroup__button">
First button
</button>
<button class="lui-button lui-buttongroup__button">
Second button
</button>
<button class="lui-button lui-noround lui-buttongroup__button lui-active">
Third button
</button>
</div>
<input class="lui-input lui-noround"/>