Update bootstrap, update/add all of PatternFly, add font-awesome
[cascardo/ipsilon.git] / less / patternfly / mixins.less
index a8a4670..6ec3d31 100644 (file)
@@ -3,12 +3,13 @@
 // --------------------------------------------------
 // Bootstrap overrides and PatternFly-specific mixins
 
-/* Bootstrap overrides */
+// Bootstrap overrides
+// -------------------
 
 // Button variants
 .button-variant(@color; @background; @background-image-start; @background-image-stop; @border) {
   background-color: @background;
-  #gradient .vertical(@background-image-start, @background-image-stop);
+  #gradient .vertical(@background-image-start, @background-image-stop);
   border-color: @border;
   color: @color;
 
   &.active,
   .open .dropdown-toggle& {
     background-image: none;
+    &:hover,
+    &:focus,
+    &.focus {
+      background-color: darken(@background, 5%);
+          border-color: darken(@border, 7%);
+    }
   }
   &.disabled,
   &[disabled],
   }
 }
 
+// Form control outline
+.form-control-outline(@color: @input-border-focus) {
+  @color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
+  &:focus {
+    border-color: @color;
+    outline: 0 !important;
+    .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
+  }
+}
+
+// Gradients
+#gradient {
+  .striped(@color: rgba(0,0,0,.15); @angle: -45deg) {
+    background-image: -webkit-linear-gradient(@angle, @color 25%, @color 26%, transparent 27%, transparent 49%, @color 50%, @color 51%, transparent 52%, transparent 74%, @color 75%, @color 76%, transparent 77%);
+    background-image: linear-gradient(@angle, @color 25%, @color 26%, transparent 27%, transparent 49%, @color 50%, @color 51%, transparent 52%, transparent 74%, @color 75%, @color 76%, transparent 77%);
+  }
+}
+
 // Horizontal dividers
 .nav-divider(@color: #e5e5e5, @margin: 4px 1px) {
   background-color: @color;
@@ -57,7 +82,8 @@
   &::-webkit-input-placeholder  { color: @color; font-style: italic; } // Safari and Chrome
 }
 
-/* PatternFly-specific */
+// PatternFly-specific
+// -------------------
 
 .tab-indicator(@background: @gray-light-pf, @left: 15px, @right: 15px) {
   &:before {
@@ -70,4 +96,4 @@
     position: absolute;
     right: @right;
   }
-}
\ No newline at end of file
+}