Create Bootstrap Button Components

[Cleop]

As a user I want to have access to the same components as bootstrap so that I can replicate it with the extra opportunities provided by functional css.

See http://getbootstrap.com/css/#buttons

• [x] Style each of the button variations from bootstrap using tachyons css
• [x] Ensure they each have border box sizing

[Cleop]

Opted for the darker of the two info buttons to match Bootstrap's:

Bootstrap:

Options:

Which size looks best for the large button? Bootstrap:

Options:

OR But here it doesn't look bigger than the default button

[ghost]

Are there only limited options? Is it not possible to use the same sizes and colour codes as bootstrap? It might make more sense to emulate bootstrap designs for now and then they can be reviewed and further improved upon in future. (Although I don't know the entire context of the project, so I might be way off here)

[Cleop]

Thanks for your thoughts @markwilliamfirth.

These are the increments for sizing that tachyons offers and as you can see, some don't match bootstrap's identically. We could replicate the bootstrap colours but this would mean not using tachyons for some of these in order to get some custom sizes. However, I think based on what @nelsonic said here: https://github.com/dwyl/learn-tachyons/issues/8#issue-221166053 that the idea is that we replicate bootstrap using what tachyons provides us with.

From the issue by @nelsonic:

[ghost]

Ah, I see - nice :)

[Cleop]

Should we make all of the buttons have border-box sizing?

[Cleop]

The buttons are now complete but border-box sizing needs adding to them all.

[katbow]

border box added in #32 👍