diff options
| author | Mark Otto <[email protected]> | 2013-01-12 17:51:57 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-01-12 17:51:57 -0800 |
| commit | a9a66e9c341cf21bc53f2ce174254d4c615b400a (patch) | |
| tree | 1fc619d6f120213f152036bae1eceae3380f3a41 /less/buttons.less | |
| parent | ff02043bbc5a6dca3eec734a274e91cffc611dd4 (diff) | |
| download | bootstrap-a9a66e9c341cf21bc53f2ce174254d4c615b400a.tar.xz bootstrap-a9a66e9c341cf21bc53f2ce174254d4c615b400a.zip | |
finetune buttons flattened colors
Diffstat (limited to 'less/buttons.less')
| -rw-r--r-- | less/buttons.less | 55 |
1 files changed, 43 insertions, 12 deletions
diff --git a/less/buttons.less b/less/buttons.less index b9ed8e330..d0ada16ff 100644 --- a/less/buttons.less +++ b/less/buttons.less @@ -9,17 +9,17 @@ // Core styles .btn { display: inline-block; - padding: 7px 13px; + padding: 6px 12px; margin-bottom: 0; // For input.btn font-size: @font-size-base; font-weight: bold; line-height: @line-height-base; text-align: center; + text-shadow: 0 -1px 0 rgba(0,0,0,.25); vertical-align: middle; cursor: pointer; - border: 0; + border: 1px solid @btn-border; border-radius: @border-radius-base; - //.box-shadow(inset 0 1px 0 rgba(255,255,255,.25)); &:focus { .tab-focus(); @@ -33,7 +33,7 @@ &.active { outline: 0; background-image: none; - .box-shadow(~"inset 0 3px 5px rgba(0,0,0,.125), 0 1px 0 rgba(255,255,255,.1)"); + .box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); } &.disabled, @@ -116,28 +116,58 @@ input[type="button"] { .btn { color: #fff; - background-color: #ccc; - //.buttonBackground(@btn-background, @btn-background-highlight, @gray, 0 1px 0 rgba(255,255,255,.75)); + background-color: @btn-background; + border-color: @btn-border; + &:hover, + &:focus, + &:active { + background-color: darken(@btn-background, 5%); + border-color: darken(@btn-border, 10%); + } } // Primary appears as blue .btn-primary { background-color: @btn-background-primary; - //.buttonBackground(@btn-background-primary, @btn-background-primary-highlight); + border-color: @btn-border-primary; + &:hover, + &:focus, + &:active { + background-color: darken(@btn-background-primary, 5%); + border-color: darken(@btn-border-primary, 10%); + } } // Warning appears are orange .btn-warning { background-color: @btn-background-warning; - //.buttonBackground(@btn-background-warning, @btn-background-warning-highlight); + border-color: @btn-border-warning; + &:hover, + &:focus, + &:active { + background-color: darken(@btn-background-warning, 5%); + border-color: darken(@btn-border-warning, 10%); + } } // Danger and error appear as red .btn-danger { background-color: @btn-background-danger; - //.buttonBackground(@btn-background-danger, @btn-background-danger-highlight); + border-color: @btn-border-danger; + &:hover, + &:focus, + &:active { + background-color: darken(@btn-background-danger, 5%); + border-color: darken(@btn-border-danger, 10%); + } } // Success appears as green .btn-success { background-color: @btn-background-success; - //.buttonBackground(@btn-background-success, @btn-background-success-highlight); + border-color: @btn-border-success; + &:hover, + &:focus, + &:active { + background-color: darken(@btn-background-success, 5%); + border-color: darken(@btn-border-success, 10%); + } } @@ -154,9 +184,10 @@ fieldset[disabled] .btn-link { .box-shadow(none); } .btn-link { - border-color: transparent; - cursor: pointer; color: @link-color; + font-weight: normal; + cursor: pointer; + border-color: transparent; border-radius: 0; } .btn-link:hover { |
