less/patternfly/mixins.less

   1 //
   2 // Mixins
   3 // --------------------------------------------------
   4 // Bootstrap overrides and PatternFly-specific mixins
   5
   6 /* Bootstrap overrides */
   7
   8 // Button variants
   9 .button-variant(@color; @background; @background-image-start; @background-image-stop; @border) {
  10   background-color: @background;
  11   #gradient .vertical(@background-image-start, @background-image-stop);
  12   border-color: @border;
  13   color: @color;
  14
  15   &:hover,
  16   &:focus,
  17   &:active,
  18   &.active,
  19   .open .dropdown-toggle& {
  20     background-color: @background;
  21     background-image: none;
  22     border-color: @border;
  23     color: @color;
  24   }
  25   &:active,
  26   &.active,
  27   .open .dropdown-toggle& {
  28     background-image: none;
  29   }
  30   &.disabled,
  31   &[disabled],
  32   fieldset[disabled] & {
  33     &,
  34     &:hover,
  35     &:focus,
  36     &:active,
  37     &.active {
  38       background-color: @background;
  39       border-color: @border
  40     }
  41   }
  42 }
  43
  44 // Horizontal dividers
  45 .nav-divider(@color: #e5e5e5, @margin: 4px 1px) {
  46   background-color: @color;
  47   height: 1px;
  48   margin: @margin;
  49   overflow: hidden;
  50 }
  51
  52 // Placeholder text
  53 .placeholder(@color: @input-color-placeholder) {
  54   &:-moz-placeholder            { color: @color; font-style: italic; } // Firefox 4-18
  55   &::-moz-placeholder           { color: @color; font-style: italic;} // Firefox 19+
  56   &:-ms-input-placeholder       { color: @color; font-style: italic; } // Internet Explorer 10+
  57   &::-webkit-input-placeholder  { color: @color; font-style: italic; } // Safari and Chrome
  58 }
  59
  60 /* PatternFly-specific */
  61
  62 .tab-indicator(@background: @gray-light-pf, @left: 15px, @right: 15px) {
  63   &:before {
  64     background: @background;
  65     bottom: -1px;
  66     content: '';
  67     display: block;
  68     height: 2px;
  69     left: @left;
  70     position: absolute;
  71     right: @right;
  72   }
  73 }