diff options
| author | Jacob Thornton <[email protected]> | 2011-08-24 15:55:08 -0700 |
|---|---|---|
| committer | Jacob Thornton <[email protected]> | 2011-08-24 15:55:08 -0700 |
| commit | 0739583a46833b4813524e69726f79fe1b009542 (patch) | |
| tree | 12e40a6aaabea6c66fd8afce3ff35c6b7834f2ec /lib | |
| parent | 7d7156bff9818c8d50affffb750b6019a9f20f26 (diff) | |
| download | bootstrap-0739583a46833b4813524e69726f79fe1b009542.tar.xz bootstrap-0739583a46833b4813524e69726f79fe1b009542.zip | |
optimize btn for outputted code + line-height: normal for firefox with adjusted padding
Diffstat (limited to 'lib')
| -rw-r--r-- | lib/preboot.less | 26 | ||||
| -rw-r--r-- | lib/scaffolding.less | 65 |
2 files changed, 42 insertions, 49 deletions
diff --git a/lib/preboot.less b/lib/preboot.less index 399d50825..964f677a6 100644 --- a/lib/preboot.less +++ b/lib/preboot.less @@ -171,26 +171,12 @@ } // Buttons -// .button(@color: #fff, @padding: 4px 14px, @textColor: #333, @textShadow: 0 1px 1px rgba(255,255,255,.75), @fontSize: 13px, @borderColor: rgba(0,0,0,.1), @borderRadius: 4px) { -// display: inline-block; -// #gradient > .vertical-three-colors(@color, @color, 0.25, darken(@color, 10%)); -// padding: @padding; -// text-shadow: @textShadow; -// color: @textColor; -// font-size: @fontSize; -// line-height: @baseline; -// border: 1px solid; -// border-color: #ccc #ccc #bbb; -// border-color: borderColor borderColor fadein(@borderColor, 15%); -// .border-radius(@borderRadius); -// @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05); -// .box-shadow(@shadow); -// &:hover { -// background-position: 0 -15px; -// color: @textColor; -// text-decoration: none; -// } -// } +.btnColoring(@primaryColor, @secondaryColor) { + #gradient > .vertical(@primaryColor, @secondaryColor); + text-shadow: 0 -1px 0 rgba(0,0,0,.25); + border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%); + border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%); +} // Add an alphatransparency value to any background or border color (via Elyse Holladay) #translucent { diff --git a/lib/scaffolding.less b/lib/scaffolding.less index a75a47c5f..5dc054f93 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -118,73 +118,80 @@ a { } // Buttons -.btnColor(@primaryColor, @secondaryColor) { - #gradient > .vertical(@primaryColor, @secondaryColor); - text-shadow: 0 -1px 0 rgba(0,0,0,.25); - border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%); - border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%); -} - .btn { - // .button(#1174C6); + // Button Base cursor: pointer; display: inline-block; #gradient > .vertical-three-colors(#fff, #fff, 0.25, darken(#fff, 10%)); - padding: 4px 14px; + padding: 5px 14px 6px; text-shadow: 0 1px 1px rgba(255,255,255,.75); color: #333; font-size: 13px; - line-height: @baseline; + line-height: normal; border: 1px solid #ccc; border-bottom-color: #bbb; .border-radius(4px); @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05); .box-shadow(@shadow); + &:hover { background-position: 0 -15px; color: #333; text-decoration: none; } + + // Transitions .transition(.1s linear all); + + // Colored Button Types &.primary, - &.danger { + &.danger, + &.danger:hover, + &.primary:hover { color: #fff; - &:hover { - color: #fff; - } } + &.primary { - .btnColor(@blue, @blueDark) + .btnColoring(@blue, @blueDark) } + &.danger { - .btnColor(lighten(@red, 15%), @red) - } - &.large { - font-size: 16px; - line-height: 28px; - .border-radius(6px); - } - &.small { - padding-right: 9px; - padding-left: 9px; - font-size: 11px; + .btnColoring(lighten(@red, 15%), @red) } + + // Active and Disabled states &.disabled { + cursor: default; background-image: none; .opacity(65); - cursor: default; } - // this can't be included with the .disabled def because IE8 and below will drop it ;_; &:disabled { + // disabled pseudo can't be included with .disabled + // def because IE8 and below will drop it ;_; + cursor: default; background-image: none; .opacity(65); - cursor: default; } + &:active { @shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05); .box-shadow(@shadow); } + + // Button Sizes + &.large { + font-size: 16px; + line-height: normal; + padding: 9px 14px 9px; + .border-radius(6px); + } + + &.small { + padding: 7px 9px 7px; + font-size: 11px; + } + } // Help Firefox not be a jerk about adding extra padding to buttons |
