Button and Input Styles

[jonashaefele]

Fixes a lot of bugs and visual inconsistencies with buttons and form elements.

add btn-contrast to buttons that lie on colored, textured or random backgrounds.

While testing I saw that we don't have a bg-yellow class, so I added that for testing purposes.

Also I added a class for very basic form spacing in multi-line forms. Just add form-spaced to the classes of the wrapping element and buttons, button groups, inputs and text-areas that are direct decendents of the wrapper get margin-bottoms. Complex forms still have to be spaced by individually.

Check it all out at:

http://play.decoded.co/button-testsuite/

@SomeHats this is for you. Let me know what you think.

Please tag draft a release v0.0.50 when merging this in. (Or let me know, so I can do it). I didn't add this yet, in case we add extra commits. package.json is already updated, just the git tag isn't set as it links to a commit hash.

[SomeHats]

Awesome! The only things I might be tempted to change are:

• .btn-contrast buttons other than default and primary seem kind of hard to read. Might just be me. The [disabled] ones are definitely really hard though
• .btn-link should have the same style as a hyperlink
• A couple 1-pixel-off type issues on Firefox:

Other than those, it's looking great! Can't wait to get this stuff in the editor :)

[jonashaefele]

Don't you love cross browser inconsistencies!

Got some Firefox padding issues solved, sadly had to add a few extra styles to make button-sizes behave in firefox, but nothing serious.

The disabled buttons are supposed to be hard to read, aren't they? I made the text grey, so it's easier to read. they look less disabled now though.

Safari renders everything ok, as well. Only the .btn-link underline is a couple pixels too low. If that's an important issue, I'll look into it later. Think that could be a time waster, though.

Jonas Haefele http://www.linkedin.com/profile/view?id=128093443Designer0742 906 6868 | 0742 906 6868jonas@decoded.co jonas@decoded.co| @jonashaefelehttp://twitter.com/jonashaefele http://decoded.co http://decoded.co/| @decodedcohttp://twitter.com/decodedco DECODED http://decoded.co/digital enlightenmentLondon • New YorkRead our blog http://blog.decoded.co/ to see how we're transforming business through an understanding of the digital world.

On 30 April 2014 12:00, Joe Dytrych notifications@github.com wrote:

Awesome! The only things I might be tempted to change are:

• .btn-contrast buttons other than default and primary seem kind of hard to read. Might just be me. The [disabled] ones are definitely really hard though
• .btn-link should have the same style as a hyperlink
• A couple 1-pixel-off type issues on Firefox: [image: screen shot 2014-04-30 at 11 58 45]https://cloud.githubusercontent.com/assets/1489520/2840495/7a8a41bc-d056-11e3-91ac-f121dcafecab.png

Other than those, it's looking great! Can't wait to get this stuff in the editor :)

— Reply to this email directly or view it on GitHubhttps://github.com/DecodedCo/pollen/pull/43#issuecomment-41784271 .

[jonashaefele]

@somehats should be good now. at least on my system.