Variants such as .-defualt
, .-primary
, .-sky
, .-emerald
, .-sun
, .-crimson
or .-link
. Depends on your need.
Apply one of .-xs, .-small, .-large
+Apply one of .-xs
, .-small,
or .-large
Simply use .-inverted
to a button to make it appear no action.
Make any button full-width by adding .btn-block. It adds width: 100%;, changes the display from inline-block to block, and centers the button text.
+Make any button full-width by adding .-block
to make it full-width in a block element with centered text.
Just add .-rounded
to make the button rounded.
Want your button itself serves as loading or progress indicator? Just create a div with class of .tri-circle-loader
inside the button and add 3 empty divs inside that will serve as circles. You can also add .-light
for a different variant.