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 .button-variant(@color; @background; @border) {

     7   color: @color;

     8   background-color: @background;

     9   border-color: @border;

    10 

    11   &:hover,

    12   &:focus,

    13   &.focus,

    14   &:active,

    15   &.active,

    16   .open > .dropdown-toggle& {

    17     color: @color;

    18     background-color: darken(@background, 10%);

    19         border-color: darken(@border, 12%);

    20   }

    21   &:active,

    22   &.active,

    23   .open > .dropdown-toggle& {

    24     background-image: none;

    25   }

    26   &.disabled,

    27   &[disabled],

    28   fieldset[disabled] & {

    29     &,

    30     &:hover,

    31     &:focus,

    32     &.focus,

    33     &:active,

    34     &.active {

    35       background-color: @background;

    36           border-color: @border;

    37     }

    38   }

    39 

    40   .badge {

    41     color: @background;

    42     background-color: @color;

    43   }

    44 }

    45 

    46 // Button sizes

    47 .button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {

    48   padding: @padding-vertical @padding-horizontal;

    49   font-size: @font-size;

    50   line-height: @line-height;

    51   border-radius: @border-radius;

    52 }