aboutsummaryrefslogtreecommitdiff
path: root/less
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2013-02-02 19:08:59 -0800
committerMark Otto <[email protected]>2013-02-02 19:08:59 -0800
commit2f7087eae9790626b46223445b6406ff59b7a56e (patch)
tree84bcf2d0c4aff025f53ba820fc7708b588f4126a /less
parent5638b2559a042d8a89f352b03de60900229643ac (diff)
parentc77a459b3520a8ee14bebad887427c3cb540f76b (diff)
downloadbootstrap-2f7087eae9790626b46223445b6406ff59b7a56e.tar.xz
bootstrap-2f7087eae9790626b46223445b6406ff59b7a56e.zip
Merge branch '3.0.0-wip' of https://github.com/vickash/bootstrap into vickash-3.0.0-wip
Diffstat (limited to 'less')
-rw-r--r--less/buttons.less65
1 files changed, 27 insertions, 38 deletions
diff --git a/less/buttons.less b/less/buttons.less
index 80d19494d..143ab42fd 100644
--- a/less/buttons.less
+++ b/less/buttons.less
@@ -109,7 +109,26 @@ input[type="button"] {
}
}
+// Mixin for darkening only enabled buttons for link states
+.darken-button-states (@background, @border) {
+ &:hover,
+ &:focus,
+ &:active {
+ background-color: darken(@background, 5%);
+ border-color: darken(@border, 10%);
+ }
+ &.disabled,
+ &[disabled],
+ fieldset[disabled] & {
+ &:hover,
+ &:focus,
+ &:active {
+ background-color: @background;
+ border-color: @border
+ }
+ }
+}
// Alternate buttons
// --------------------------------------------------
@@ -117,67 +136,37 @@ input[type="button"] {
.btn {
color: @btn-color;
background-color: @btn-background;
- border-color: @btn-border;
- &:hover,
- &:focus,
- &:active {
- background-color: darken(@btn-background, 5%);
- border-color: darken(@btn-border, 10%);
- }
+ border-color: @btn-border;
+ .darken-button-states(@btn-background, @btn-border)
}
.btn-primary {
background-color: @btn-background-primary;
border-color: @btn-border-primary;
- &:hover,
- &:focus,
- &:active {
- background-color: darken(@btn-background-primary, 5%);
- border-color: darken(@btn-border-primary, 10%);
- }
+ .darken-button-states(@btn-background-primary, @btn-border-primary)
}
-// Warning appears are orange
+// Warning appears as orange
.btn-warning {
background-color: @btn-background-warning;
border-color: @btn-border-warning;
- &:hover,
- &:focus,
- &:active {
- background-color: darken(@btn-background-warning, 5%);
- border-color: darken(@btn-border-warning, 10%);
- }
+ .darken-button-states(@btn-background-warning, @btn-border-warning)
}
// Danger and error appear as red
.btn-danger {
background-color: @btn-background-danger;
border-color: @btn-border-danger;
- &:hover,
- &:focus,
- &:active {
- background-color: darken(@btn-background-danger, 5%);
- border-color: darken(@btn-border-danger, 10%);
- }
+ .darken-button-states(@btn-background-danger, @btn-border-danger)
}
// Success appears as green
.btn-success {
background-color: @btn-background-success;
border-color: @btn-border-success;
- &:hover,
- &:focus,
- &:active {
- background-color: darken(@btn-background-success, 5%);
- border-color: darken(@btn-border-success, 10%);
- }
+ .darken-button-states(@btn-background-success, @btn-border-success)
}
// Info appears as blue-green
.btn-info {
background-color: @btn-background-info;
border-color: @btn-border-info;
- &:hover,
- &:focus,
- &:active {
- background-color: darken(@btn-background-info, 5%);
- border-color: darken(@btn-border-info, 10%);
- }
+ .darken-button-states(@btn-background-info, @btn-border-info)
}