Details | Last modification | View Log | RSS feed
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 1 | espaco | 1 | // Button variants |
| 2 | // |
||
| 3 | // Easily pump out default styles, as well as :hover, :focus, :active, |
||
| 4 | // and disabled options for all buttons |
||
| 5 | |||
| 6 | @mixin button-variant($color, $background, $border) { |
||
| 7 | color: $color; |
||
| 8 | background-color: $background; |
||
| 9 | border-color: $border; |
||
| 10 | |||
| 11 | &:focus, |
||
| 12 | &.focus { |
||
| 13 | color: $color; |
||
| 14 | background-color: darken($background, 10%); |
||
| 15 | border-color: darken($border, 25%); |
||
| 16 | } |
||
| 17 | &:hover { |
||
| 18 | color: $color; |
||
| 19 | background-color: darken($background, 10%); |
||
| 20 | border-color: darken($border, 12%); |
||
| 21 | } |
||
| 22 | &:active, |
||
| 23 | &.active, |
||
| 24 | .open > &.dropdown-toggle { |
||
| 25 | color: $color; |
||
| 26 | background-color: darken($background, 10%); |
||
| 27 | border-color: darken($border, 12%); |
||
| 28 | |||
| 29 | &:hover, |
||
| 30 | &:focus, |
||
| 31 | &.focus { |
||
| 32 | color: $color; |
||
| 33 | background-color: darken($background, 17%); |
||
| 34 | border-color: darken($border, 25%); |
||
| 35 | } |
||
| 36 | } |
||
| 37 | &:active, |
||
| 38 | &.active, |
||
| 39 | .open > &.dropdown-toggle { |
||
| 40 | background-image: none; |
||
| 41 | } |
||
| 42 | &.disabled, |
||
| 43 | &[disabled], |
||
| 44 | fieldset[disabled] & { |
||
| 45 | &:hover, |
||
| 46 | &:focus, |
||
| 47 | &.focus { |
||
| 48 | background-color: $background; |
||
| 49 | border-color: $border; |
||
| 50 | } |
||
| 51 | } |
||
| 52 | |||
| 53 | .badge { |
||
| 54 | color: $background; |
||
| 55 | background-color: $color; |
||
| 56 | } |
||
| 57 | } |
||
| 58 | |||
| 59 | // Button sizes |
||
| 60 | @mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) { |
||
| 61 | padding: $padding-vertical $padding-horizontal; |
||
| 62 | font-size: $font-size; |
||
| 63 | line-height: $line-height; |
||
| 64 | border-radius: $border-radius; |
||
| 65 | } |