patternfly-sass 1.3.1 → 2.0.0

data/assets/stylesheets/patternfly/_cards.scss

@@ -0,0 +1,60 @@
+//
+// Cards
+// --------------------------------------------------
+
+.container-cards-pf {
+  margin-top: $grid-gutter-width/2;
+}
+
+.card-pf {
+  background: $card-pf-bg-color;
+  border-top: 2px solid $card-pf-border-top-color;
+  @include box-shadow(0 1px 1px rgba(0,0,0,.175));
+  padding: 0 $grid-gutter-width/2;
+  margin: 0 (-($grid-gutter-width/4)) $grid-gutter-width/2;
+  &.card-pf-accented {
+    border-top-color: $card-pf-accented-border-top-color;
+  }
+}
+
+.card-pf-body {
+  margin: $grid-gutter-width/2 0;
+  padding: 0 0 $grid-gutter-width/2;
+  > *:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.card-pf-footer {
+  background-color: $card-pf-footer-bg-color;
+  border-top: 1px solid $card-pf-border-color;
+  margin: 0 (-($grid-gutter-width/2)) !important;
+  padding: $grid-gutter-width/2 $grid-gutter-width/2 $grid-gutter-width/4;
+  a > {
+    .fa, .pficon {
+      margin-right: 5px;
+    }
+  }
+}
+
+.card-pf-heading {
+  border-bottom: 1px solid $card-pf-border-color;
+  margin: 0 (-($grid-gutter-width/2)) $grid-gutter-width/2;
+  padding: 0 $grid-gutter-width/2 0;
+}
+
+.card-pf-title {
+  font-size: $font-size-h3;
+  font-weight: 300;
+  margin: $grid-gutter-width/2 0;
+  padding: 0;
+}
+
+.cards-pf {
+  background: $card-pf-container-bg-color;
+}
+
+.row-cards-pf {
+  margin-left: -($grid-gutter-width/4);
+  margin-right: -($grid-gutter-width/4);
+}

data/assets/stylesheets/patternfly/_icons.scss

@@ -14,10 +14,6 @@
   font-style: normal;
 }
 
-[class*="-exclamation"] {
-  color: #fff;
-}
-
 [class^="#{$icon-prefix}-"], [class*=" #{$icon-prefix}-"] {
   display: inline-block;
   font-family: '#{$icon-font-name-pf}';
@@ -32,21 +28,6 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-.#{$icon-prefix}-layered {
-  position: relative;
-  .#{$icon-prefix}:first-child {
-    position: absolute;
-    z-index: 1;
-    + .#{$icon-prefix} {
-      position: relative;
-      z-index: 2;
-    }
-  }
-}
-
-.#{$icon-prefix}-warning-exclamation:before {
-  content: "\e60d";
-}
 .#{$icon-prefix}-screen:before {
   content: "\e600";
 }
@@ -73,32 +54,18 @@
 .#{$icon-prefix}-folder-close:before {
   content: "\e607";
 }
-.#{$icon-prefix}-error-exclamation:before {
-  content: "\e608";
-}
-.#{$icon-prefix}-error-octagon:before {
-  color: $brand-danger;
-  content: "\e609";
-}
 .#{$icon-prefix}-edit:before {
   content: "\e60a";
 }
 .#{$icon-prefix}-close:before {
   content: "\e60b";
 }
-.#{$icon-prefix}-warning-triangle:before {
-  color: $brand-warning;
-  content: "\e60c";
-}
 .#{$icon-prefix}-user:before {
   content: "\e60e";
 }
 .#{$icon-prefix}-users:before {
   content: "\e60f";
 }
-.#{$icon-prefix}-add:before {
-  content: "\e61a";
-}
 .#{$icon-prefix}-add-circle-o:before {
   content: "\e61b";
 }
@@ -144,12 +111,27 @@
 .#{$icon-prefix}-home:before {
   content: "\e618";
 }
-.#{$icon-prefix}-remove:before {
-  content: "\e619";
-}
 .#{$icon-prefix}-cluster:before {
   content: "\e620";
 }
 .#{$icon-prefix}-container-node:before {
   content: "\e621";
+}
+.#{$icon-prefix}-project:before {
+  content: "\e622";
+}
+.#{$icon-prefix}-registry:before {
+  content: "\e623";
+}
+.#{$icon-prefix}-replicator:before {
+  content: "\e624";
+}
+.#{$icon-prefix}-route:before {
+  content: "\e625";
+}
+.#{$icon-prefix}-openshift:before {
+  content: "\e626";
+}
+.#{$icon-prefix}-kubernetes:before {
+  content: "\e627";
 }

data/assets/stylesheets/patternfly/_login.scss

@@ -98,24 +98,3 @@
     }
   }
 }
-
-.ie8.login-pf {
-  #badge {
-    background: url('#{$img-path}/#{$img-badge-ie8}') no-repeat;
-    height: $img-badge-ie8-height;
-    width: $img-badge-ie8-width;
-    img {
-      width: 0;
-    }
-  }
-  #brand {
-    background: url('#{$img-path-alt}/#{$img-brand-lg-ie8}') no-repeat center;
-    background-size: cover auto;
-    @media (min-width: $screen-sm-min) {
-      background-position: 0 0;
-    }
-    img {
-      width: 0;
-    }
-  }
-}

data/assets/stylesheets/patternfly/_mixin_overrides.scss

@@ -3,7 +3,8 @@
 // --------------------------------------------------
 // Bootstrap overrides and PatternFly-specific mixins
 
-/* Bootstrap overrides */
+// Bootstrap overrides
+// -------------------
 
 
 
@@ -39,7 +40,8 @@
   &::-webkit-input-placeholder  { color: $color; font-style: italic; } // Safari and Chrome
 }
 
-/* PatternFly-specific */
+// PatternFly-specific
+// -------------------
 
 @mixin tab-indicator($background: $gray-light-pf, $left: 15px, $right: 15px) {
   &:before {

data/assets/stylesheets/patternfly/_mixins.scss

@@ -3,7 +3,8 @@
 // --------------------------------------------------
 // Bootstrap overrides and PatternFly-specific mixins
 
-/* Bootstrap overrides */
+// Bootstrap overrides
+// -------------------
 
 // Button variants
 @mixin button-variant($color, $background, $background-image-start, $background-image-stop, $border) {
@@ -30,9 +31,21 @@
   &:active,
   &.active {
     background-image: none;
+    &:hover,
+    &:focus,
+    &.focus {
+      background-color: darken($background, 5%);
+          border-color: darken($border, 7%);
+    }
   }
   .open & { &.dropdown-toggle {
     background-image: none;
+    &:hover,
+    &:focus,
+    &.focus {
+      background-color: darken($background, 5%);
+          border-color: darken($border, 7%);
+    }
   } }
   &.disabled,
   &[disabled],
@@ -80,7 +93,8 @@
   &::-webkit-input-placeholder  { color: $color; font-style: italic; } // Safari and Chrome
 }
 
-/* PatternFly-specific */
+// PatternFly-specific
+// -------------------
 
 @mixin tab-indicator($background: $gray-light-pf, $left: 15px, $right: 15px) {
   &:before {

data/assets/stylesheets/patternfly/_navbar.scss

@@ -14,16 +14,8 @@
     height: auto;
     padding: 12px 0;
     margin: 0 0 0 20px;
-    .ie8 & {
-      background: url('#{$img-path}/#{$img-brand-ie8}') no-repeat 0 49%;
-      min-width: $navbar-pf-navbar-navbar-brand-min-width;
-    }
     img {
       display: block;
-      .ie8 & {
-        height: 10px;
-        width: 0;
-      }
     }
   }
   .navbar-collapse {
@@ -404,9 +396,6 @@
         &.context-bootstrap-select .filter-option {
           max-width: 160px;
           text-overflow: ellipsis;
-          .ie8 & {
-            max-width: none;
-          }
         }
         &.dropdown {
           border-bottom: 0;

data/assets/stylesheets/patternfly/_pagination.scss

@@ -50,14 +50,14 @@
 }
 
 .pagination-sm {
-  @include pagination-size($pagination-padding-small-vertical, $padding-small-horizontal, $font-size-small, $border-radius-small);
+  @include pagination-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);
   > li {
     > a,
     > span {
       font-weight: 400;
       > .i {
         font-size: 12px;
-        margin-top: 3px;
+        margin-top: 2px;
       }
     }
   }

data/assets/stylesheets/patternfly/_spinner.scss

@@ -45,18 +45,16 @@
   }
 }
 
-.ie8, .ie9 {
-  .spinner {
-    background: url("#{$img-path}/#{$img-spinner}") no-repeat;
-    border: 0;
-    &.spinner-lg {
-      background-image: url("#{$img-path}/#{$img-spinner-lg}");
-    }
-    &.spinner-sm {
-      background-image: url("#{$img-path}/#{$img-spinner-sm}");
-    }
-    &.spinner-xs {
-      background-image: url("#{$img-path}/#{$img-spinner-xs}");
-    }
+.ie9 .spinner {
+  background: url("#{$img-path}/#{$img-spinner}") no-repeat;
+  border: 0;
+  &.spinner-lg {
+    background-image: url("#{$img-path}/#{$img-spinner-lg}");
+  }
+  &.spinner-sm {
+    background-image: url("#{$img-path}/#{$img-spinner-sm}");
   }
-}
+  &.spinner-xs {
+    background-image: url("#{$img-path}/#{$img-spinner-xs}");
+  }
+}

data/assets/stylesheets/patternfly/_tooltip.scss

@@ -5,8 +5,7 @@
 // Base class
 .tooltip {
   font-size: $tooltip-font-size;
-  
-  &.in { @include opacity(.88); }
+  line-height: 1.4
 }
 
 // Wrapper for the tooltip content

data/assets/stylesheets/patternfly/_variables.scss

@@ -4,10 +4,17 @@ $patternfly-sass-asset-helper: false !default;
 // --------------------------------------------------
 // Bootstrap overrides and PatternFly-specific variables
 
-/* PatternFly specific */
+// PatternFly-specific
+// -------------------
 $btn-default-bg-img-start:                                          #fafafa !default;
 $btn-default-bg-img-stop:                                           #ededed !default;
 $btn-xs-font-weight:                                                400 !default;
+$card-pf-accented-border-top-color:                                 #39a5dc !default;
+$card-pf-bg-color:                                                  #fff !default;
+$card-pf-border-color:                                              #d1d1d1 !default;
+$card-pf-border-top-color:                                          transparent !default;
+$card-pf-container-bg-color:                                        #f5f5f5 !default;
+$card-pf-footer-bg-color:                                           #fafafa !default;
 $dropdown-divider-margin:                                           4px 1px !default;
 $dropdown-link-active-border-color:                                 #0076b7 !default;
 $dropdown-link-hover-border-color:                                  #b3d3e7 !default;
@@ -19,12 +26,7 @@ $gray-pf:                                                           #4d5258 !def
 $icon-font-name-fa:                                                 "FontAwesome" !default;
 $icon-font-name-pf:                                                 "PatternFlyIcons-webfont" !default;
 $icon-prefix:                                                       pficon !default;
-$img-badge-ie8:                                                     "logo.png" !default;
-$img-badge-ie8-height:                                              69px !default;
-$img-badge-ie8-width:                                               73px !default;
 $img-bg-login:                                                      "bg-login.jpg" !default;
-$img-brand-ie8:                                                     "brand.png" !default;
-$img-brand-lg-ie8:                                                  "brand-lg.png" !default;
 $img-path:                                                          if($patternfly-sass-asset-helper, "patternfly", "../images/patternfly") !default;
 $img-spinner:                                                       "spinner.gif" !default;
 $img-spinner-lg:                                                    "spinner-lg.gif" !default;
@@ -94,7 +96,8 @@ $navbar-pf-navbar-primary-context-active-border-top-color:          lighten($nav
 $navbar-pf-navbar-primary-context-active-border-right-color:        $navbar-pf-navbar-primary-context-active-border-color !default;
 
 
-/* Bootstrap overrides */
+// Bootstrap overrides
+// -------------------
 $alert-info-border:                                                 #ccc !default;
 $alert-link-font-weight:                                            500 !default;
 $alert-padding:                                                     7px !default;
@@ -209,7 +212,8 @@ $panel-info-text:                                                   $panel-prima
 $panel-success-text:                                                $panel-primary-text !default;
 $panel-warning-text:                                                $panel-primary-text !default;
 
-/* PatternFly-specific variables based on Bootstrap overides */
+// PatternFly-specific variables based on Bootstrap overides
+// ---------------------------------------------------------
 $btn-danger-bg-img-start:                                           $brand-danger !default;
 $btn-danger-bg-img-stop:                                            $btn-danger-bg !default;
 $btn-primary-bg-img-start:                                          $brand-primary !default;

data/bower.json

@@ -17,12 +17,14 @@
   ],
   "devDependencies": {
     "bootstrap-combobox": "~1.1.6",
-    "bootstrap-select": "~1.5.4",
-    "bootstrap-treeview": "~1.0.1",
+    "bootstrap-datepicker": "~1.4.0",
+    "bootstrap-select": "~1.7.3",
+    "bootstrap-treeview": "~1.2.0",
     "c3": "~0.4.10",
     "datatables": "~1.10.7",
     "datatables-colreorder": "~1.1.3",
     "datatables-colvis": "~1.1.2",
-    "google-code-prettify": "~1.0.3"
+    "google-code-prettify": "~1.0.4",
+    "matchHeight": "~0.6.0"
   }
 }

data/lib/patternfly-sass/version.rb

@@ -1,4 +1,4 @@
 module Patternfly
-  VERSION = '1.3.1'
-  PATTERNFLY_SHA = '3788ee1f5e9f0ae4061925e671d83572f7bf2a1e'
+  VERSION = '2.0.0'
+  PATTERNFLY_SHA = 'bf1749e83367af53dcdd880668643171c844bc58'
 end

data/patternfly-sass.gemspec

@@ -11,8 +11,8 @@ Gem::Specification.new do |s|
   s.homepage = "https://github.com/Patternfly/patternfly-sass"
   s.license  = 'Apache-2.0'
 
-  s.add_runtime_dependency 'sass', '~> 3.2'
-  s.add_runtime_dependency 'bootstrap-sass', '~> 3.3.4.1'
+  s.add_runtime_dependency 'sass', '~> 3.4.15'
+  s.add_runtime_dependency 'bootstrap-sass', '~> 3.3.5'
   s.add_runtime_dependency 'font-awesome-sass', '~> 4.3.0'
 
   # Converter's dependencies
@@ -23,6 +23,7 @@ Gem::Specification.new do |s|
   s.add_development_dependency 'nokogiri', '~> 1.6'
   s.add_development_dependency 'rmagick', '~> 2.15'
   s.add_development_dependency 'imgur-api', '~> 0.0.4'
+  s.add_development_dependency 'selenium-webdriver', '~> 2.46'
 
   s.files      = `git ls-files`.split("\n")
   s.test_files = `git ls-files -- spec/*`.split("\n")

data/spec/compare_spec.rb

@@ -1,6 +1,7 @@
 require 'net/http'
 require 'nokogiri'
 require 'rmagick'
+require 'selenium-webdriver'
 
 RSpec.describe "compare SASS with LESS screenshots" do
   BASEURL = "http://localhost:9000"
@@ -11,6 +12,8 @@ RSpec.describe "compare SASS with LESS screenshots" do
   # See https://github.com/sass/sass/issues/1732
   TOLERANCE = 0.05
 
+  driver = Selenium::WebDriver.for(:firefox)
+
   # Give some time for the testing server to start
   html = nil
   5.times do |t|
@@ -25,10 +28,18 @@ RSpec.describe "compare SASS with LESS screenshots" do
     file = link['href']
     context "#{file}" do
       title = file.sub('.html', '')
-      RESOLUTIONS.each do |w,h|
+      RESOLUTIONS.each do |w, h|
         it "#{w}x#{h}" do
+          driver.manage.window.resize_to(w, h)
           CONTEXTS.each do |ctx|
-            `phantomjs spec/capture.js #{w} #{h} #{BASEURL}/#{ctx}/patternfly/#{file} spec/results/#{ctx}/#{title}-#{w}x#{h}.png`
+            driver.navigate.to("#{BASEURL}/#{ctx}/patternfly/#{file}")
+            driver.execute_script("
+              var style = document.createElement('style');
+              style.innerHTML = '* { -moz-animation: none !important; -moz-transition: none !important;';
+              document.body.appendChild(style);
+            ")
+            sleep(1)
+            driver.save_screenshot("spec/results/#{ctx}/#{title}-#{w}x#{h}.png")
           end
           img_less = Magick::Image.read("spec/results/less/#{title}-#{w}x#{h}.png").first
           img_sass = Magick::Image.read("spec/results/sass/#{title}-#{w}x#{h}.png").first
@@ -50,4 +61,8 @@ RSpec.describe "compare SASS with LESS screenshots" do
       end
     end
   end
+
+  after(:all) do
+    driver.quit
+  end
 end