patternfly-sass 0.0.0.pre.semantically.pre.released → 1.2.0

data/{dist/sass → assets/stylesheets}/patternfly/_pager.scss

@@ -17,9 +17,13 @@
         margin: 2px 0;
       }
     }
+    > a:hover
+    > a:focus {
+      color: $gray-pf;
+    }
     a:active {
       background-image: none;
-      @include box-shadow(inset 0 3px 5px rgba($color-pf-black, (12.5/100)));
+      @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
       outline: 0;
     }
   }
@@ -32,7 +36,7 @@
       background: $pagination-bg;
       @include box-shadow(none);
       color: $pager-disabled-color;
-      cursor: not-allowed;
+      cursor: default;
     }
   }
   .next {

data/assets/stylesheets/patternfly/_pagination.scss

@@ -0,0 +1,64 @@
+//
+// Pagination
+// --------------------------------------------------
+
+.pagination {
+  > li {
+    > a,
+    > span {
+      @include button-variant($btn-default-color, $btn-default-bg, $btn-default-bg-img-start, $btn-default-bg-img-stop, $btn-default-border);
+      cursor: default;
+      font-weight: 600;
+      padding: $padding-base-vertical $padding-large-horizontal;
+      > .i {
+        font-size: 15px;
+        vertical-align: top;
+        margin: 2px 0;
+      }
+    }
+  }
+  > li > a,
+  > li > span {
+    &:active {
+      @include box-shadow(inset 0 2px 8px rgba(0,0,0,.2));
+    }
+  }
+  > .active > a,
+  > .active > span {
+    &,
+    &:hover,
+    &:focus {
+      background-color: $btn-default-bg;
+      border-color: $pagination-border;
+      @include box-shadow(inset 0 2px 8px rgba(0,0,0,.2));
+      color: $btn-default-color;
+      @include gradient-vertical($btn-default-bg-img-start, $btn-default-bg-img-stop);
+    }
+  }
+  > .disabled {
+    > span,
+    > span:hover,
+    > span:focus,
+    > a,
+    > a:hover,
+    > a:focus {
+      @include box-shadow(none);
+      cursor: default;
+      @include gradient-vertical($btn-default-bg-img-start, $btn-default-bg-img-stop);
+    }
+  }
+}
+
+.pagination-sm {
+  @include pagination-size($pagination-padding-small-vertical, $padding-small-horizontal, $font-size-small, $border-radius-small);
+  > li {
+    > a,
+    > span {
+      font-weight: 400;
+      > .i {
+        font-size: 12px;
+        margin-top: 3px;
+      }
+    }
+  }
+}

data/assets/stylesheets/patternfly/_panels.scss

@@ -0,0 +1,57 @@
+//
+// Panels
+// --------------------------------------------------
+
+.panel-title {
+  font-weight: 700;
+}
+
+//
+// Collapsable panels (aka, accordion)
+// --------------------------------------------------
+
+.panel-group {
+  .panel {
+    color: $gray-pf;
+    + .panel {
+      margin-top: -1px;
+    }
+  }
+  .panel-default {
+    border-color: $panel-default-border-color;
+    border-top-color: #c4c3c3;
+  }
+  .panel-heading {
+    @include gradient-vertical($btn-default-bg-img-start, $btn-default-bg-img-stop);
+    + .panel-collapse .panel-body {
+      border-top: 1px solid $panel-inner-border;
+    }
+  }
+  .panel-title {
+    font-weight: 500;
+    line-height: 1;
+    > a {
+      color: $gray-pf;
+      font-weight: $btn-font-weight;
+      &:before {
+        content: "\f107";
+        font-family: $icon-font-name-fa;
+        font-size: 13px;
+        margin-right: 5px;
+        vertical-align: 0;
+      }
+      &:focus {
+        outline: none;
+        text-decoration: none;
+      }
+      &:hover {
+        text-decoration: none;
+      }
+      &.collapsed:before {
+        content: "\f105";
+        margin-left: 4px;
+        margin-right: 7px;
+      }
+    }
+  }
+}

data/assets/stylesheets/patternfly/_popovers.scss

@@ -0,0 +1,32 @@
+//
+// Popovers
+// --------------------------------------------------
+
+.popover {
+  @include box-shadow(0 2px 2px rgba(0,0,0,.08));
+  padding: 0;
+}
+
+.popover-content {
+  color: $gray-pf;
+  line-height: 18px;
+  padding: 10px 14px;
+}
+
+.popover-title {
+  border-bottom: none;
+  border-radius: 0;
+  color: $gray-pf;
+  font-size: $font-size-base + 1;
+  font-weight: 700;
+  min-height: 34px;
+  .close {
+    height: 22px;
+    position: absolute;
+    right: 8px;
+    top: 6px;
+  }
+  &.closable {
+    padding-right: 30px;
+  }
+}

data/{dist/sass → assets/stylesheets}/patternfly/_progress-bars.scss

@@ -2,15 +2,21 @@
 // Progress Bar
 // --------------------------------------------------
 
+// WebKit
+@-webkit-keyframes progress-bar-stripes {
+  from  { background-position: 0 0; }
+  to    { background-position: 40px 0; }
+}
+
+// Spec and IE10+
 @keyframes progress-bar-stripes {
   from  { background-position: 0 0; }
   to    { background-position: 40px 0; }
 }
 
 .progress {
-  @include box-shadow(inset 0 0 1px rgba($color-pf-black, (25/100)));
-  &.progress-label-left,
-  &.progress-label-top-right {
+  @include box-shadow(inset 0 0 1px rgba(0, 0, 0, 0.25));
+  &.progress-label-left, &.progress-label-top-right {
     overflow: visible;
     position: relative;
   }
@@ -33,40 +39,26 @@
 
 .progress-bar {
   box-shadow: none;
-  .progress-label-left & span,
-  .progress-label-right & span,
-  .progress-label-top-right & span {
+  .progress-label-left & span, .progress-label-top-right & span {
     color: $text-color;
+    font-size: $font-size-large;
     position: absolute;
     text-align: right;
   }
   .progress-label-left & span {
-    font-size: $font-size-large;
     left: -40px;
     top: 0;
     width: 35px;
   }
-  .progress-label-right & span,
   .progress-label-top-right & span {
-    font-size: $font-size-small;
+    max-width: 25%;
     overflow: hidden;
     right: 0;
     text-overflow: ellipsis;
+    top: -($line-height-computed*1.5+1);
     white-space: nowrap;
-    strong {
-      font-weight: 600;
-    }
-  }
-  .progress-label-right & span {
-    max-width: $progress-description-label-width;
-    top: 0;
-  }
-  .progress-label-top-right & span {
-    max-width: 47%;
-    top: (-($line-height-computed * 1.5)); // -30px
   }
-  .progress-label-left.progress-sm & span,
-  .progress-label-top-right.progress-sm & span {
+  .progress-label-left.progress-sm & span, .progress-label-top-right.progress-sm & span  {
     font-size: $font-size-base;
   }
   .progress-sm & {
@@ -77,45 +69,23 @@
   }
 }
 
-.progress-bar-remaining {
-  background: transparent;
-}
-
-.progress-container {
-  position: relative;
-  &.progress-description-left {
-    padding-left :($progress-description-label-width + 5);
-  }
-  &.progress-label-right {
-    padding-right :($progress-description-label-width + 5);
-  }
-}
-
 .progress-description {
-  margin-bottom: ($line-height-computed / 2); // 10px
-  max-width: 52%;
+  margin-bottom: $line-height-computed/2;
+  max-width: 74%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   .count {
-    font-size: ($font-size-base * 1.667); // 20px
+    font-size: $font-size-base*1.667;
     font-weight: 300;
     line-height: 1;
     margin-right: 5px;
   }
-  .fa,
-  .pficon {
+  .fa, .pficon {
     font-size: 14px;
     margin-right: 3px;
   }
-  .progress-description-left & {
-    left: 0;
-    margin-bottom: 0;
-    max-width: $progress-description-label-width;
-    position: absolute;
-    top: 0;
-  }
   .tooltip {
     white-space: normal;
   }
-}
+}

data/{dist/sass/rcue → assets/stylesheets/patternfly}/_search.scss

@@ -14,10 +14,10 @@
         float: left;
         margin-left: -1px;
         &.btn-lg {
-          font-size: ($font-size-large + .5); // to make button height consistent across browsers!
+          font-size: $font-size-large + .5; // to make button height consistent across browsers!
         }
         &.btn-sm {
-          font-size: ($font-size-small - .3); // to make button height consistent across browsers!
+          font-size: $font-size-small - .3; // to make button height consistent across browsers!
         }
       }
       .form-control {
@@ -27,9 +27,10 @@
   }
   .has-clear {
     .clear {
-      background: rgba($color-pf-white, (0/100)); // to make the whole button clickable in IE9+
+      background: transparent; // IE8
+      background: rgba(255,255,255,0); // to make the whole button clickable in IE9+ 
       border: 0;
-      height: ($input-height-base - 1);
+      height: $input-height-base - 1;
       line-height: 1;
       padding: 0;
       position: absolute;
@@ -47,18 +48,18 @@
       }
     }
     .input-lg + .clear {
-      height: ($input-height-large - 2);
+      height: $input-height-large - 2;
       width: 28px;
     }
-    .input-sm + .clear {
-      height: ($input-height-small - 2);
+    .input-sm  + .clear {
+      height: $input-height-small - 2;
       width: 28px;
       span {
-        font-size: ($font-size-base - 2);
+        font-size: $font-size-base - 2;
       }
     }
     .search-pf-input-group {
       position: relative;
     }
   }
-}
+}

data/{dist/sass → assets/stylesheets}/patternfly/_sidebar.scss

@@ -5,7 +5,7 @@
 .sidebar-header {
   border-bottom: 1px solid darken($page-header-border-color, 2%);
   padding-bottom: (($line-height-computed / 2) + 1);
-  margin: (($line-height-computed * 2) + 10) 0 $line-height-computed;
+  margin: ($line-height-computed * 2)+10 0 $line-height-computed;
   .actions {
     margin-top: -2px;
   }
@@ -14,7 +14,7 @@
 .sidebar-pf {
   .sidebar-header + .list-group {
     border-top: 0;
-    margin-top: (-$grid-gutter-width / 2 / 2);
+    margin-top: -$grid-gutter-width/2/2;
     .list-group-item {
       background: transparent;
       border-color: darken($page-header-border-color, 2%);
@@ -29,31 +29,31 @@
       color: $dropdown-header-color;
       font-size: $font-size-base;
       font-weight: 400;
-      line-height: ($line-height-computed + 1);
+      line-height: $line-height-computed + 1;
       margin: 0;
       padding: 8px 0;
     }
     + .nav-category {
-      margin-top: ($grid-gutter-width / 4);
+      margin-top: $grid-gutter-width/4;
     }
   }
   .nav-pills > li {
     &.active > a {
       background: $dropdown-link-active-bg !important;
       border-color: $dropdown-link-active-border-color !important;
-      color: $color-pf-white;
+      color: #fff;
       @media (min-width: $grid-float-breakpoint) {
         &:after {
           content: $fa-var-angle-right;
           font-family: $icon-font-name-fa;
           display: block;
           position: absolute;
-          right: ($grid-gutter-width / 2 / 2);
+          right: $grid-gutter-width/2/2;
           top: 1px;
         }
       }
       .fa {
-        color: $color-pf-white;
+        color: #fff;
       }
     }
     > a {
@@ -61,26 +61,26 @@
       border-radius: 0;
       border-top: 1px solid transparent;
       color: $text-color;
-      font-size: ($font-size-base + 1);
-      line-height: ($line-height-computed + 1);
-      padding: 1px ($grid-gutter-width / 2);
+      font-size: $font-size-base + 1;
+      line-height: $line-height-computed + 1;
+      padding: 1px $grid-gutter-width/2;
       &:hover {
         background: $dropdown-link-hover-bg;
         border-color: $dropdown-link-hover-border-color;
       }
       .fa {
         color: lighten($gray-pf, 12%);
-        font-size: ($font-size-base + 3);
-        margin-right: ($grid-gutter-width / 4);
+        font-size: $font-size-base + 3;
+        margin-right: $grid-gutter-width/4;
         text-align: center;
         vertical-align: middle;
-        width: ($font-size-base + 3);
+        width: $font-size-base + 3;
       }
     }
   }
   .nav-stacked {
-    margin-left: (-($grid-gutter-width / 2));
-    margin-right: (-($grid-gutter-width / 2));
+    margin-left: -$grid-gutter-width/2;
+    margin-right: -$grid-gutter-width/2;
     li + li {
       margin-top: 0;
     }
@@ -89,13 +89,13 @@
     background: transparent;
   }
   .panel-body {
-    padding: 6px ($grid-gutter-width / 2);
+    padding: 6px $grid-gutter-width/2;
     .nav-pills > li > a {
-      padding-left: ($grid-gutter-width / 2 + 17);
+      padding-left: $grid-gutter-width/2 + 17;
     }
   }
   .panel-heading {
-    padding: 9px ($grid-gutter-width / 2);
+    padding: 9px $grid-gutter-width/2;
   }
   .panel-title {
     font-size: $font-size-base;
@@ -116,42 +116,41 @@
 
 @media (min-width: $grid-float-breakpoint-max) {
   .sidebar-header-bleed-left {
-    margin-left: (-($grid-gutter-width / 2));
+    margin-left: -$grid-gutter-width/2;
     > h2 {
-      margin-left: ($grid-gutter-width / 2);
+      margin-left: $grid-gutter-width/2;
     }
   }
   .sidebar-header-bleed-right {
-    margin-right: (-($grid-gutter-width / 2));
+    margin-right: -$grid-gutter-width/2;
     .actions {
-      margin-right: ($grid-gutter-width / 2);
+      margin-right: $grid-gutter-width/2;
     }
     > h2 {
-      margin-right: ($grid-gutter-width / 2);
+      margin-right: $grid-gutter-width/2;
     }
     + .list-group {
-      margin-right: (-($grid-gutter-width / 2));
+      margin-right: -$grid-gutter-width/2;
     }
   }
   .sidebar-pf {
-    .panel-group .panel-default,
-    .treeview {
+    .panel-group .panel-default, .treeview {
       border-left: 0;
       border-right: 0;
-      margin-left: (-($grid-gutter-width / 2));
-      margin-right: (-($grid-gutter-width / 2));
+      margin-left: -$grid-gutter-width/2;
+      margin-right: -$grid-gutter-width/2;
     }
     .treeview {
       margin-top: 5px;
       .list-group-item {
-        padding-left: ($grid-gutter-width / 2);
-        padding-right: ($grid-gutter-width / 2);
+        padding-left: $grid-gutter-width/2;
+        padding-right: $grid-gutter-width/2;
         &.node-selected:after {
           content: $fa-var-angle-right;
           font-family: $icon-font-name-fa;
           display: block;
           position: absolute;
-          right: ($grid-gutter-width/2 / 2);
+          right: $grid-gutter-width/2/2;
           top: 1px;
         }
       }
@@ -168,9 +167,8 @@
     &.sidebar-pf-right {
       border-left: 1px solid $sidebar-pf-border-color;
     }
-    > .nav-category,
-    > .nav-stacked {
+    > .nav-category, > .nav-stacked {
       margin-top: 5px;
     }
   }
-}
+}