The DefaultButton component is your basic button. It can have a text and an icon, and both are optional (although having one or the other is important).
Creating buttons
A button can be created as follows:
add(new DefaultButton("Click me", FaIcon.faHeart, b -> MsgBox.info(this, "Hi, I was clicked!")));
Rendering and styles
The DefaultButton component renders the following structure when both text and icon are present:
<button class="ui-button" type="button>
<span class="ui-icon">
<span class="fa fa-heart />
</span>
<span class="ui-btntext">Click me</span>
</button>
The button class' rendering was modeled after Bulma's buttons, and the code and styling of the scss steals a lot from there:
There are a few problems to fix still, though:
- The butons do not properly show navigational state (hover, active, focus mainly).