Files @ 3deedb9af799
Branch filter:

Location: Copyleft/copyleft-wiki/bootstrap-3.0.0/less/buttons.less - annotation

datagrok datagrok@web
Nevermind; I'll self-publish this stuff first before cluttering this wiki.
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
b890802d732c
//
// Buttons
// --------------------------------------------------


// Base styles
// --------------------------------------------------

// Core styles
.btn {
  display: inline-block;
  padding: @padding-base-vertical @padding-base-horizontal;
  margin-bottom: 0; // For input.btn
  font-size: @font-size-base;
  font-weight: @btn-font-weight;
  line-height: @line-height-base;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: @border-radius-base;
  white-space: nowrap;
  .user-select(none);

  &:focus {
    .tab-focus();
  }

  &:hover,
  &:focus {
    color: @btn-default-color;
    text-decoration: none;
  }

  &:active,
  &.active {
    outline: 0;
    background-image: none;
    .box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
  }

  &.disabled,
  &[disabled],
  fieldset[disabled] & {
    cursor: not-allowed;
    pointer-events: none; // Future-proof disabling of clicks
    .opacity(.65);
    .box-shadow(none);
  }

}


// Alternate buttons
// --------------------------------------------------

.btn-default {
  .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
}
.btn-primary {
  .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
}
// Warning appears as orange
.btn-warning {
  .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
}
// Danger and error appear as red
.btn-danger {
  .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
}
// Success appears as green
.btn-success {
  .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
}
// Info appears as blue-green
.btn-info {
  .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
}


// Link buttons
// -------------------------

// Make a button look and behave like a link
.btn-link {
  color: @link-color;
  font-weight: normal;
  cursor: pointer;
  border-radius: 0;

  &,
  &:active,
  &[disabled],
  fieldset[disabled] & {
    background-color: transparent;
    .box-shadow(none);
  }
  &,
  &:hover,
  &:focus,
  &:active {
    border-color: transparent;
  }
  &:hover,
  &:focus {
    color: @link-hover-color;
    text-decoration: underline;
    background-color: transparent;
  }
  &[disabled],
  fieldset[disabled] & {
    &:hover,
    &:focus {
      color: @btn-link-disabled-color;
      text-decoration: none;
    }
  }
}


// Button Sizes
// --------------------------------------------------

.btn-lg {
  // line-height: ensure even-numbered height of button next to large input
  .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
}
.btn-sm,
.btn-xs {
  // line-height: ensure proper height of button next to small input
  .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
}
.btn-xs {
  padding: 1px 5px;
}


// Block button
// --------------------------------------------------

.btn-block {
  display: block;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

// Vertically space out multiple block buttons
.btn-block + .btn-block {
  margin-top: 5px;
}

// Specificity overrides
input[type="submit"],
input[type="reset"],
input[type="button"] {
  &.btn-block {
    width: 100%;
  }
}