groundworkcss 2.2.1 → 2.3.1

data/app/assets/javascripts/groundworkcss/components/forms.coffee

@@ -1,7 +1,7 @@
 $ ->
 
   $body = $ 'body'
-  $body.on 'click', [
+  $targets = [
       '.error input'
       '.error textarea'
       '.invalid input'
@@ -10,20 +10,10 @@ $ ->
       'textarea.error'
       'input.invalid'
       'textarea.invalid'
-    ].join(','), ->
-    $(@).focus().select()
+      'input[aria-invalid="true"]'
+      'textarea[aria-invalid="true"]'
+    ].join(',')
+  $body.on 'click', $targets, ->
+    $(@).focus()
+    $(@).select()
 
-  $('.select select').each ->
-    setSelectState(@)
-
-  $body.on 'change', '.select select', ->
-    setSelectState(@)
-
-  setSelectState = (el) ->
-    $el = $(el)
-    firstOptionVal = $el.children('option').first().val()
-    firstOptionSelected = $el.children('option').first().attr('selected')
-    if firstOptionVal == '' and firstOptionSelected
-      $el.addClass('unselected')
-    else
-      $el.removeClass('unselected')

data/app/assets/stylesheets/groundworkcss/_settings-rails3.scss

@@ -1,6 +1,6 @@
 // =============================================
 //              Custom Settings
-//          Last Updated:2013-9-12
+//          Last Updated:2013-10-3
 // =============================================
 
 
@@ -15,6 +15,7 @@ $fonts_path:          'groundworkcss/';
 $boxsizing_path:      asset-path("groundworkcss/libs/boxsizing.htc", javascript);
 $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 
+// $oldIE:                     false; // enable polyfills for legacy IE
 
 // =============================================
 //                  Web Fonts
@@ -43,8 +44,8 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 //                 Color Palette
 // =============================================
 
-// $white:               #ffffff;
-// $black:               #111111;
+// $white:                     #ffffff;
+// $black:                     #111111;
 
 // document
 // $background-color:          #ffffff;
@@ -196,7 +197,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 // =============================================
 
 // flexible box layout
-// $flexbox-classes:           true; enable output of flexbox classes
+// $flexbox-classes:           true; // enable output of flexbox classes
 // $flexbox-helpers:           "flex-wrapper" "flex-box" "vertical-center";
 
 
@@ -247,7 +248,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 // $type-tags:                 true;
 // $type-elements:             "h1" "h2" "h3" "h4" "h5" "h6" "p"
 //                             "ul" "ol" "dl"
-//                             "q" "quote" "blockquote" "cite"
+//                             "q" "blockquote" "cite"
 //                             "small" "big"
 //                             "b" "strong"
 //                             "em"
@@ -258,7 +259,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 // $type-classes:              false;
 // $type-classnames:           "h1" "h2" "h3" "h4" "h5" "h6" "p"
 //                             "ul" "ol" "dl"
-//                             "q" "quote" "blockquote" "cite"
+//                             "q" "blockquote" "cite"
 //                             "small" "big" "large"
 //                             "b" "bold" "strong"
 //                             "em" "italic"
@@ -267,12 +268,16 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 //                             "code" "pre"
 //                             "invalid" "valid"
 //                             "unstyled";
+// $quote-color:               $font-color;
+// $quote-background:          $border-color;
+// $quote-font:                "source-sans-pro";
 // $styled-lists:              true;
 // $multi-column-classes:      true;
 // $multi-column-names:        "one-column" "two-column" "three-column" "four-column" "five-column";
 // $ui-states:                 "info"  "alert" "warning" "error" "success" "question";
 // $ui-icons:                  "\f05a" "\f06a" "\f071"   "\f057" "\f058"   "\f059";
 // $ui-states-colors:          $info-color $alert-color $warning-color $error-color $success-color $question-color;
+// $ui-states-color-classes:   true;
 // $font-family:               Helvetica, Arial, Geneva, sans-serif;
 // $font-size:                 14px;
 // $line-height:               1.5;
@@ -313,7 +318,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 //                             "center";
 // $typography-classes:        true;
 // $typography-helpers:        "align-top" "align-right" "align-bottom" "align-left" "align-center" "justify"
-//                             "truncate";
+//                             "truncate" "unstyled";
 // $border-classes:            true;
 // $border-helpers:            "bordered" "border-right" "border-left" "border-top" "border-bottom";
 // $radius-classes:            true;
@@ -334,7 +339,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc", javascript);
 //                             "h1" "h2" "h3" "h4" "h5" "h6" "p"
 //                             "ol" "ul" "li" "dl" "dt" "dd"
 //                             "em" "small" "big" "strong" "b" "u" "i" "sub" "sup" "del" "strike"
-//                             "q" "quote" "blockquote" "cite"
+//                             "q" "blockquote" "cite"
 //                             "time" "address"
 //                             "code" "pre"
 //                             "a" "img" "center" "hr"

data/app/assets/stylesheets/groundworkcss/_settings-rails4.scss

@@ -1,6 +1,6 @@
 // =============================================
 //              Custom Settings
-//          Last Updated:2013-9-12
+//          Last Updated:2013-10-3
 // =============================================
 
 
@@ -9,12 +9,13 @@
 // =============================================
 
 // file paths
-$root_path:           "./";      // path to HTML document root (relative from $css_path)
-$images_path:         asset-path("images/");  // path to images (relative from $root_path)
-$fonts_path:          "groundworkcss/";  // path to fonts (relative from $root_path)
-$boxsizing_path:      asset-path("groundworkcss/libs/boxsizing.htc");  // path to box sizing polyfill (change to absolute path from HTML document root)
-$PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE CSS3 polyfill (change to absolute path from HTML document root)
+$root_path:           "./";
+$images_path:         asset-path("images/");
+$fonts_path:          "groundworkcss/";
+$boxsizing_path:      asset-path("groundworkcss/libs/boxsizing.htc");
+$PIE_path:            asset-path("groundworkcss/libs/PIE.htc");
 
+// $oldIE:                     false; // enable polyfills for legacy IE
 
 // =============================================
 //                  Web Fonts
@@ -43,8 +44,8 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE C
 //                 Color Palette
 // =============================================
 
-// $white:               #ffffff;
-// $black:               #111111;
+// $white:                     #ffffff;
+// $black:                     #111111;
 
 // document
 // $background-color:          #ffffff;
@@ -196,7 +197,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE C
 // =============================================
 
 // flexible box layout
-// $flexbox-classes:           true; enable output of flexbox classes
+// $flexbox-classes:           true; // enable output of flexbox classes
 // $flexbox-helpers:           "flex-wrapper" "flex-box" "vertical-center";
 
 
@@ -247,7 +248,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE C
 // $type-tags:                 true;
 // $type-elements:             "h1" "h2" "h3" "h4" "h5" "h6" "p"
 //                             "ul" "ol" "dl"
-//                             "q" "quote" "blockquote" "cite"
+//                             "q" "blockquote" "cite"
 //                             "small" "big"
 //                             "b" "strong"
 //                             "em"
@@ -258,7 +259,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE C
 // $type-classes:              false;
 // $type-classnames:           "h1" "h2" "h3" "h4" "h5" "h6" "p"
 //                             "ul" "ol" "dl"
-//                             "q" "quote" "blockquote" "cite"
+//                             "q" "blockquote" "cite"
 //                             "small" "big" "large"
 //                             "b" "bold" "strong"
 //                             "em" "italic"
@@ -267,12 +268,16 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE C
 //                             "code" "pre"
 //                             "invalid" "valid"
 //                             "unstyled";
+// $quote-color:               $font-color;
+// $quote-background:          $border-color;
+// $quote-font:                "source-sans-pro";
 // $styled-lists:              true;
 // $multi-column-classes:      true;
 // $multi-column-names:        "one-column" "two-column" "three-column" "four-column" "five-column";
 // $ui-states:                 "info"  "alert" "warning" "error" "success" "question";
 // $ui-icons:                  "\f05a" "\f06a" "\f071"   "\f057" "\f058"   "\f059";
 // $ui-states-colors:          $info-color $alert-color $warning-color $error-color $success-color $question-color;
+// $ui-states-color-classes:   true;
 // $font-family:               Helvetica, Arial, Geneva, sans-serif;
 // $font-size:                 14px;
 // $line-height:               1.5;
@@ -313,7 +318,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE C
 //                             "center";
 // $typography-classes:        true;
 // $typography-helpers:        "align-top" "align-right" "align-bottom" "align-left" "align-center" "justify"
-//                             "truncate";
+//                             "truncate" "unstyled";
 // $border-classes:            true;
 // $border-helpers:            "bordered" "border-right" "border-left" "border-top" "border-bottom";
 // $radius-classes:            true;
@@ -334,7 +339,7 @@ $PIE_path:            asset-path("groundworkcss/libs/PIE.htc");  // path to IE C
 //                             "h1" "h2" "h3" "h4" "h5" "h6" "p"
 //                             "ol" "ul" "li" "dl" "dt" "dd"
 //                             "em" "small" "big" "strong" "b" "u" "i" "sub" "sup" "del" "strike"
-//                             "q" "quote" "blockquote" "cite"
+//                             "q" "blockquote" "cite"
 //                             "time" "address"
 //                             "code" "pre"
 //                             "a" "img" "center" "hr"

data/app/assets/stylesheets/groundworkcss/_settings.scss

@@ -173,7 +173,7 @@
 // $container-width:           1200px;
 // $gutter:                    10px;
 // $responsive:                true;
-
+// $inline-conditional-helpers: false;
 
 // =============================================
 //                  Breakpoints

data/app/assets/stylesheets/groundworkcss/core/_mixins-core.scss

@@ -13,7 +13,7 @@ $oldIE: false !default;
 
 @mixin helper_reset($properties: padding margin, $spacers: padded pad-top pad-right pad-bottom pad-left gapped gap-top gap-right gap-bottom gap-left) {
   @for $i from 1 through length($spacers) {
-    &.#{nth($spacers, $i)}, &.#{nth($spacers, $i)}.double, &.#{nth($spacers, $i)}.triple {
+    &.#{nth($spacers, $i)}, &.half-#{nth($spacers, $i)}, &.double-#{nth($spacers, $i)}, &.triple-#{nth($spacers, $i)} {
       @for $i from 1 through length($properties) {
         #{nth($properties, $i)}: 0 !important;
       }

data/app/assets/stylesheets/groundworkcss/responsive/_desktop.scss

@@ -7,13 +7,21 @@ $responsive: true !default;
 $navigation-classes: true !default;
 $multi-column-classes:      true !default;
 $multi-column-names:        "one-column" "two-column" "three-column" "four-column" "five-column" !default;
+$inline-conditional-helpers: false !default;
 
 
 @mixin desktop {
   @if $responsive {
     @media #{$desktop} {
       // conditional helpers
+      .desktop-only { display: block !important; }
+      .ipad-only { display: none !important; }
+      .small-tablet-only { display: none !important; }
+      .mobile-only { display: none !important; }
       .hide-on-desktop { display: none !important; }
+      @if $inline-conditional-helpers {
+        span.desktop-only { display: inline !important; }
+      }
       // spacer overrides
       .zero-desktop { @include helper_reset(); }
       .no-padding-desktop, .no-pad-desktop { @include helper_reset(padding, $spacers: padded pad-top pad-right pad-bottom pad-left); }

data/app/assets/stylesheets/groundworkcss/responsive/_helpers-responsive.scss

@@ -4,12 +4,16 @@
 // =============================================
 
 $responsive: true !default;
+$inline-conditional-helpers: false !default;
 
 
 @if $responsive {
   // desktop helpers
   .desktop-only { display: block; }
-  .hide-on-desktop {}
+  @if $inline-conditional-helpers {
+    span.desktop-only { display: inline; }
+  }
+  .hide-on-desktop { display: none; }
   // ipad helpers
   .ipad-only { display: none !important; }
   .hide-on-ipad {}

data/app/assets/stylesheets/groundworkcss/responsive/_ipad.scss

@@ -7,16 +7,21 @@ $responsive: true !default;
 $navigation-classes: true !default;
 $multi-column-classes:      true !default;
 $multi-column-names:        "one-column" "two-column" "three-column" "four-column" "five-column" !default;
+$inline-conditional-helpers: false !default;
 
 
 @mixin ipad {
   @if $responsive {
     @media #{$ipad} {
       // conditional helpers
+      .desktop-only { display: none !important; }
       .ipad-only { display: block !important; }
-      span.ipad-only { display: inline !important; }
+      .small-tablet-only { display: none !important; }
+      .mobile-only { display: none !important; }
       .hide-on-ipad { display: none !important; }
-      .desktop-only { display: none !important; }
+      @if $inline-conditional-helpers {
+        span.ipad-only { display: inline !important; }
+      }
       // spacer overrides
       .zero-ipad { @include helper_reset(); }
       .no-padding-ipad, .no-pad-ipad { @include helper_reset(padding, $spacers: padded pad-top pad-right pad-bottom pad-left); }

data/app/assets/stylesheets/groundworkcss/responsive/_mobile.scss

@@ -7,6 +7,7 @@ $responsive: true !default;
 $navigation-classes: true !default;
 $multi-column-classes:      true !default;
 $multi-column-names:        "one-column" "two-column" "three-column" "four-column" "five-column" !default;
+$inline-conditional-helpers: false !default;
 
 
 @mixin mobile {
@@ -15,14 +16,15 @@ $multi-column-names:        "one-column" "two-column" "three-column" "four-colum
       // responsive grid
       @include grid-responsive(false);
       // conditional helpers
-      .mobile-only { display: block !important; }
-      span.mobile-only { display: inline !important; }
-      .hide-on-small-tablet { display: block !important; }
-      span.hide-on-small-tablet { display: inline !important; }
+      .desktop-only { display: none !important; }
+      .ipad-only { display: none !important; }
       .small-tablet-only { display: none !important; }
-      span.small-tablet-only { display: none !important; }
+      .mobile-only { display: block !important; }
       .hide-on-mobile { display: none !important; }
-      .desktop-only { display: none !important; }
+      .hide-on-small-tablet { display: block !important; }
+      @if $inline-conditional-helpers {
+        span.mobile-only { display: inline !important; }
+      }
       // spacer overrides
       .zero-mobile { @include helper_reset(); }
       .no-padding-mobile, .no-pad-mobile { @include helper_reset(padding, $spacers: padded pad-top pad-right pad-bottom pad-left); }

data/app/assets/stylesheets/groundworkcss/responsive/_small-tablet.scss

@@ -7,6 +7,7 @@ $responsive: true !default;
 $navigation-classes: true !default;
 $multi-column-classes:      true !default;
 $multi-column-names:        "one-column" "two-column" "three-column" "four-column" "five-column" !default;
+$inline-conditional-helpers: false !default;
 
 
 @mixin small-tablet {
@@ -15,10 +16,14 @@ $multi-column-names:        "one-column" "two-column" "three-column" "four-colum
       // responsive grid
       @include grid-responsive();
       // conditional helpers
+      .desktop-only { display: none !important; }
+      .ipad-only { display: none !important; }
       .small-tablet-only { display: block !important; }
-      span.small-tablet-only { display: inline !important; }
+      .mobile-only { display: none !important; }
       .hide-on-small-tablet { display: none !important; }
-      .desktop-only { display: none !important; }
+      @if $inline-conditional-helpers {
+        span.small-tablet-only { display: inline !important; }
+      }
       // spacer overrides
       .zero-small-tablet { @include helper_reset(); }
       .no-padding-small-tablet, .no-pad-small-tablet { @include helper_reset(padding, $spacers: padded pad-top pad-right pad-bottom pad-left); }

data/app/assets/stylesheets/groundworkcss/type/_typography.scss

@@ -44,6 +44,7 @@ $question-color:            #9855b4 !default;
 $ui-states:                 "info"  "alert" "warning" "error" "success" "question" !default;
 $ui-icons:                  "\f05a" "\f06a" "\f071"   "\f057" "\f058"   "\f059" !default;
 $ui-states-colors:          $info-color $alert-color $warning-color $error-color $success-color $question-color !default;
+$ui-states-backgrounds:     $info-background $alert-background $warning-background $error-background $success-background $question-background !default;
 $ui-states-color-classes:   true !default;
 $font-size:                 14px !default;
 $line-height:               1.5 !default;
@@ -560,8 +561,8 @@ $placeholderText-fallback:  true !default;
       @extend %#{nth($ui-states, $i)};
     }
     .#{nth($ui-states, $i)}-bg {
-      background: nth($ui-states-colors, $i);
-      color: $white;
+      background: nth($ui-states-backgrounds, $i);
+      color: nth($ui-states-colors, $i);
     }
   }
 }

data/app/assets/stylesheets/groundworkcss/ui/_forms.scss

@@ -28,6 +28,8 @@ $question-color:      #9855b4 !default;
 $question-text:       #ffffff !default;
 $question-background: #f0e6f4 !default;
 $question-border:     #f1dbfa !default;
+// shared defaults
+$aria-selectors:      true !default;
 
 
 %fieldset {
@@ -131,7 +133,6 @@ $question-border:     #f1dbfa !default;
   @include rounded(0 $default-radius $default-radius 0);
 }
 
-// prefix/suffix classes
 .prefix {
   @extend %prefix;
 }
@@ -148,6 +149,16 @@ $question-border:     #f1dbfa !default;
     @extend %error-block-prefix;
   }
 }
+input, select, textarea {
+  &.invalid, &.error {
+    @extend %error-block;
+  }
+  @if $aria-selectors {
+    &[aria-invalid="true"] {
+      @extend %error-block;
+    }
+  }
+}
 .success, .valid {
   input, select, textarea {
     @extend %success-block;
@@ -156,6 +167,16 @@ $question-border:     #f1dbfa !default;
     @extend %success-block-prefix;
   }
 }
+input, select, textarea {
+  &.valid, &.success {
+    @extend %success-block;
+  }
+  @if $aria-selectors {
+    &[aria-invalid="false"] {
+      @extend %success-block;
+    }
+  }
+}
 
 @if $form-tags {
   @for $i from 1 through length($form-elements) {

data/lib/groundworkcss/generators/docs_generator.rb

@@ -22,28 +22,29 @@ module Groundworkcss
 
         run generator_command
 
-        #routes_file = "config/routes.rb"
-        #insert_into_file routes_file, "\n  if Rails.env.development?\n", :before => "  get \"groundworkdocs/animations\"\n"
-        #insert_into_file routes_file, "\n  end\n\n", :after => "  get \"groundworkdocs/typography\"\n"
-        #content = ''
-        #File.open(routes_file, "r") do |file|
-          #file.each_line do |line|
-            #if line.include? "groundworkdocs/"
-              #content << '    ' + line.lstrip
-            #else
-              #content << line
-            #end
-          #end
-        #end
-        #File.open(routes_file, "w") do |file|
-          #file.write(content)
-        #end
-
         insert_into_file "app/controllers/groundworkdocs_controller.rb", "layout 'groundworkdocs'\n\n", :after => "class GroundworkdocsController < ApplicationController\n"
 
+        if Rails::VERSION::MAJOR >= 4
+          rails_settings = [
+                            '$root_path:      "./";',
+                            '$images_path:    asset-path("images/");',
+                            '$fonts_path:     "groundworkcss/";',
+                            '$boxsizing_path: asset-path("groundworkcss/libs/boxsizing.htc");',
+                            '$PIE_path:       asset-path("groundworkcss/libs/PIE.htc");'
+                           ].join("\n")
+        else
+          rails_settings = [
+                            '$root_path:      "/assets/";',
+                            '$images_path:    asset-path("", image);',
+                            '$fonts_path:     "groundworkcss/";',
+                            '$boxsizing_path: asset-path("groundworkcss/libs/boxsizing.htc", javascript);',
+                            '$PIE_path:       asset-path("groundworkcss/libs/PIE.htc", javascript);'
+                           ].join("\n")
+        end
+
         css_file = "app/assets/stylesheets/groundworkdocs.css.scss"
         File.open(css_file, "w") do |file|
-          file.write("// GroundworkCSS 2 Documentation\n\n@import 'groundwork_settings';\n@import 'groundworkcss/groundwork';\n@import 'groundworkcss/demo/jquery.snippet';\n@import 'groundworkcss/demo/groundworkdocs';\n")
+          file.write("// GroundworkCSS 2 Documentation\n\n#{rails_settings}\n@import 'groundworkcss/groundwork';\n@import 'groundworkcss/demo/jquery.snippet';\n@import 'groundworkcss/demo/groundworkdocs';\n")
         end
 
         js_file = "app/assets/javascripts/groundworkdocs.js.coffee"

data/lib/groundworkcss/version.rb

@@ -1,3 +1,3 @@
 module Groundworkcss
-  VERSION = "2.2.1"
+  VERSION = "2.3.1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: groundworkcss
 version: !ruby/object:Gem::Version
-  version: 2.2.1
+  version: 2.3.1
   prerelease: 
 platform: ruby
 authors:
@@ -10,7 +10,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-09-29 00:00:00.000000000 Z
+date: 2013-10-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: colorize
@@ -323,14 +323,7 @@ files:
 - app/views/groundworkdocs/tabs.html.erb
 - app/views/groundworkdocs/typography.html.erb
 - app/views/layouts/groundworkdocs.html.erb
-- groundworkcss-0.4.3.gem
-- groundworkcss-0.4.4.gem
-- groundworkcss-2.0.0.gem
-- groundworkcss-2.0.1.gem
-- groundworkcss-2.0.2.gem
-- groundworkcss-2.0.4.gem
-- groundworkcss-2.0.7.gem
-- groundworkcss-2.2.1.gem
+- groundworkcss-2.3.1.gem
 - groundworkcss.gemspec
 - lib/groundworkcss.rb
 - lib/groundworkcss/engine.rb