{"id":912,"date":"2013-02-09T19:26:53","date_gmt":"2013-02-09T19:26:53","guid":{"rendered":"http:\/\/hogash-demo.com\/kallyas_wp\/?page_id=912"},"modified":"2013-02-09T19:26:53","modified_gmt":"2013-02-09T19:26:53","slug":"button-designs","status":"publish","type":"page","link":"https:\/\/ceniferr.com\/?page_id=912","title":{"rendered":"Button Designs"},"content":{"rendered":"

Welcome to Kalypso Template, a wonderful and premium product for multipurpose websites<\/h2>\n

<\/p>\n

\n

Buttons<\/h1>\n<\/div>\n

Default buttons<\/h2>\n

Button styles can be applied to anything with the .btn<\/code> class applied. However, typically you’ll want to apply these to only <a><\/code> and <button><\/code> elements for the best rendering.<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n
Button<\/th>\nclass=\u00bb\u00bb<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
btn<\/code><\/td>\nStandard gray button with gradient<\/td>\n<\/tr>\n
btn btn-primary<\/code><\/td>\nProvides extra visual weight and identifies the primary action in a set of buttons<\/td>\n<\/tr>\n
btn btn-info<\/code><\/td>\nUsed as an alternative to the default styles<\/td>\n<\/tr>\n
btn btn-success<\/code><\/td>\nIndicates a successful or positive action<\/td>\n<\/tr>\n
btn btn-warning<\/code><\/td>\nIndicates caution should be taken with this action<\/td>\n<\/tr>\n
btn btn-danger<\/code><\/td>\nIndicates a dangerous or potentially negative action<\/td>\n<\/tr>\n
btn btn-inverse<\/code><\/td>\nAlternate dark gray button, not tied to a semantic action or use<\/td>\n<\/tr>\n
btn btn-link<\/code><\/td>\nDeemphasize a button by making it look like a link while maintaining button behavior<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Cross browser compatibility<\/h4>\n

IE9 doesn’t crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled button<\/code> elements, rendering text gray with a nasty text-shadow that we cannot fix.<\/p>\n

Button sizes<\/h2>\n

Fancy larger or smaller buttons? Add .btn-large<\/code>, .btn-small<\/code>, or .btn-mini<\/code> for additional sizes.<\/p>\n

\n