stipe 0.0.5.7.6 → 0.0.5.7.7

checksums.yaml

@@ -0,0 +1,15 @@
+---
+!binary "U0hBMQ==":
+  metadata.gz: !binary |-
+    YzZiZDU5YjkyZWM5NTM2NDdkYjVkYTRlODM2MjdmNjA1NWZhOGNmNQ==
+  data.tar.gz: !binary |-
+    MDg0ZTdkYzg2ZjBkYTJhYjNmNTU0YjY3MTgwMmIwZjc0OGNiYTk0Ng==
+!binary "U0hBNTEy":
+  metadata.gz: !binary |-
+    Zjg3MDlhNTM2ZTEyNmEwYjU0ZjM1Y2QzZGY5N2FiYTQ0NzZjOTI4ZGNmMzRk
+    ZGI3ODEyMzlmNDI3ZGZmYTgxZmU3N2RiMTViZDE0MDE5YzFmZWU0YWRlMTQx
+    YjA4MzU1ZTBmYjI2YTEyZDFhMGFjYTU0ZDg1ZjdhZDQ1ZjY4YjQ=
+  data.tar.gz: !binary |-
+    YzliNGIwYzEwMDlhNmQ4YTEwNjkwYzcxYzE1ODQ2ZTEwYTU3MjcyZjk1MWJh
+    ZDUyYWM2MzJmYmI5YTAzMGEzYmQ4YmIxYTcwYzI5ZjRiOThhNDE2MjAwZmJm
+    YzQzZGRkMGZhOTE1MDYzMjU3MDYxNTIzMTUwODk4N2Q0ZDczZmY=

data/readme.md

@@ -1,12 +1,12 @@
 #Stipe Compass Extension
-Stipe is the life blood of the Toadstool style guide framework. Consisting of a series of mixins, extends and defaults that give Toadstool that 'instant on' experience. 
+Stipe is the life blood of the Toadstool style guide framework. Consisting of a series of mixins, extends and defaults that give Toadstool that 'instant on' experience.
 
 [Stipe](https://rubygems.org/gems/stipe)
 
 ##To install
 `gem install stipe`
 
-##To use 
+##To use
 To use the Stipe gem, using Bundler `gem 'stipe'`
 
 Stipe is a Compass Extension, so Compass is a dependency. You will need to include `require 'stipe'` in your config.rb file.
@@ -17,6 +17,10 @@ Stipe is a Compass Extension, so Compass is a dependency. You will need to inclu
 * BUG FIX
   * nth-child buttons: need to remove the left margin for mobile breakpoint
 
+###0.0.5.7.6
+* Update grid - move box-sizing from grid scope to global attribute
+* Deprecate Stipe's grid solution in favor of using Compass
+
 ###0.0.5.7.6
 * Restore `-ms-linear-gradient(...)` in `linear_gradient_w3c()` mixin. Because Jed has no idea what he's doing.
 
@@ -35,18 +39,18 @@ Stipe is a Compass Extension, so Compass is a dependency. You will need to inclu
 ###0.0.5.7.1
 * Added `!optional` flag to Toadstool generated extended placeholder selectors to address backwards compatibility.
 * If Sass still pukes on not finding the placeholders to extend, either the name was updated or simple add `!optional` to the end of the extend declaration.
-	* For the most part this would be restricted to `_buttons.scss` and `_forms.scss` 
+	* For the most part this would be restricted to `_buttons.scss` and `_forms.scss`
 
 ###0.0.5.7
 * Over-hauled color palette CSS
 * Updated forms extends to include `stipe_` in the name to increase visibility of where code is coming from in Toadstool
-* Added UI for `contenteditable` new functionality 
+* Added UI for `contenteditable` new functionality
 * Old button lib is dead
 * All new buttons is alive
 * Updates to `/stipe/stylesheets/stipe/toadstool/ui_patterns/_color_grid.scss`
 	* Added new `extend_color_loop` mixin
 	* Dynamically looping through list of OOCSS names to create color block classes
-*  New `extend_color_loop` mixin 
+*  New `extend_color_loop` mixin
 	* Added to `/stipe/stylesheets/stipe/toadstool/ui_patterns/_color_grid.scss`
 	* All extends generated in memory from lists of objects
 

data/stylesheets/stipe/_grid.scss

@@ -27,6 +27,7 @@
 
 // setting default units of measurement for Toadstool grid solution
 // -----------------------------------------------------------------
+$box-sizing:          global !default;
 $grid_type:           12 !default;             // sets default column grid
 $grid_context:        12 !default;             // sets default context of grid width for percentage calculations
 $grid_uom:            percent !default;        // use either ``em`` or ``percent``
@@ -57,4 +58,4 @@ $grid_960:            960 / 100% !default;     // grid math for percentages
 @import "grid/mixins";
 
 // The extends that make it awesome
-@import "grid/extends";
+@import "grid/extends";

data/stylesheets/stipe/gradients/mixins/_area_51.scss

@@ -1,54 +1,24 @@
-// Toadstool core v0.0.0.1
-// This document is not to be edited as it will be versioned
-// -----------------------------------------------------------------
+// Code is depricated!
+// ALERT!!!!!!!!!!!
+// In future releases of Stipe, all references to this document will be deleted and all gradient support moved over to Compass
 
+// ----------------------------------------------------------------------
 
-
-// example class using all mixins to support all browsers
-//.gradient_box {
-//	@include linear_gradient_legacy_safari (#{color-stop(0%,$alpha_color), color-stop(100%,$bravo_color)});
-//	@include linear_gradient_w3c ($alpha_color, #{$alpha_color 0%,$bravo_color 100%});
-//	@include linear_gradient_legacy_ie ($alpha_color, $bravo_color);
-//
-//}
-
-
-// requires that color values are written using #{} interpolation syntax
-// example .....
-// @include linear_gradient_w3c ($alpha_color, #{$alpha_color 0%,$bravo_color 100%}); 
-// ---------------------------------------------------------------------------------------
 @mixin linear_gradient_w3c ($default_color, $color_values, $prefixes: $prefix_defaults) {
 	background: $default_color; // default fallback
 	background: -webkit-linear-gradient(top, $color_values);
 	background: -moz-linear-gradient(top, $color_values);
 	background: -ms-linear-gradient(top, $color_values);
 	background: -o-linear-gradient(top, $color_values);
-	background: linear-gradient(top, $color_values);
 }
 
-
-
-
-
-// requires that color values are written using #{} interpolation syntax
-// example .....
-// @include linear_gradient_legacy_safari (#{color-stop(0%,$alpha_color), color-stop(100%,$bravo_color)}); 
-// ---------------------------------------------------------------------------------------
 @mixin linear_gradient_legacy_safari ($color_values) {
 	background: -webkit-gradient(linear, left top, left bottom, #{$color_values});
 }
 
-
-
-
-// this is pretty old skool here, think you can figure it out
-// -----------------------------------------------------------
 @mixin linear_gradient_legacy_ie ($start_color, $end_color) {
 	// IE6 & 7 //
     filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr='#{ie_hex_str($start_color)}', endColorstr='#{ie_hex_str($end_color)}');
 	// IE8 & 9 //
 	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie_hex_str($start_color)}', endColorstr='#{ie_hex_str($end_color)}')";
 }
-
-
-// -------------------------------------------------------------------------------------------

data/stylesheets/stipe/grid/lib/_grid_placement.scss

@@ -1,16 +1,14 @@
 // supporting mixin for @mixin the_grid
 // 'grid_placement' sets display, float and margin for the block
 @mixin grid_placement($grid_align, $grid_uom, $grid_child, $grid_context_width, $margin) {
-	
-	@include box_sizing;
-	
+
 	@if $grid_align == center {
 		margin: 0 auto;
 	}
 	@else if $grid_align == left {
 		margin: 0;
 	}
-	
+
 	@else {
 		@if $grid_child == alpha {
 			@if $grid_uom == em {
@@ -26,7 +24,7 @@
 				@include grid_margin($grid_child, $margin_calc);
 			}
 		}
-		
+
 		@else if $grid_child == omega {
 			@if $grid_uom == em {
 				$margin_calc: #{$margin / $em}em;
@@ -41,7 +39,7 @@
 				@include grid_margin($grid_child, $margin_calc);
 			}
 		}
-		
+
 		@else if $grid_child == none {
 			@if $grid_uom == em {
 				$margin_calc: #{$margin / $em}em;
@@ -56,11 +54,11 @@
 				@include grid_margin($grid_child, $margin_calc);
 			}
 		}
-		
+
 		@else if $grid_child == alphaomega {
 			margin-left: 0;
 			margin-right: 0;
 		}
 
-	}	
+	}
 }

data/stylesheets/stipe/grid/lib/_the_grid.scss

@@ -2,25 +2,25 @@
 // default setting for grid is ``em`` this is specified in ``_config.scss``
 
 @mixin the_grid($col_count, $col_width, $grid_uom, $grid_padding_l, $grid_padding_r, $grid_padding_tb, $grid_border, $grid_child, $col_gutter, $grid_align, $grid_context, $border_color, $border_place) {
-  
+
   //determines full col width with gutters
-  $col_gutter_width: ($col_count - 1) * $col_gutter + ($col_count * $col_width); 
-  
+  $col_gutter_width: ($col_count - 1) * $col_gutter + ($col_count * $col_width);
+
   // determines width of contextual grid block for calculating percentages
-  $grid_context_width: $grid_context * 80;  
-  
+  $grid_context_width: $grid_context * 80;
+
   $grid_padding_lr: $grid_padding_l + $grid_padding_r;
-  
+
   @include grid_placement($grid_align, $grid_uom, $grid_child, $grid_context_width, $margin: $col_gutter / 2);
-  
+
   // fallback for unsupported browsers
   $grid_width_fallback: $col_gutter_width - (($grid_padding_l + $grid_padding_r) + ($grid_border * 2));
-  
-  
-  
+
+
+
   @if $grid_uom == em {
     @if $grid_border > 0 {
-      
+
       @if $border_place != '' {
         border-#{$border_place}-width: #{$grid_border}px;
       }
@@ -30,7 +30,7 @@
       border-color: $border_color;
       border-style: $standard_border_style;
     }
-    
+
     @if $grid_padding_lr > 0 {
       padding: {
         left: em($grid_padding_l);
@@ -45,8 +45,8 @@
     }
     $grid_width: em($col_gutter_width);
     width: $grid_width;
-    
-    
+
+
     @if $grid_width_fallback < $col_gutter_width {
       @if $border_place != '' {
         $grid_width_fallback: $grid_width_fallback + $grid_border;
@@ -60,11 +60,11 @@
         }
       }
     }
-  } 
+  }
 
   @else if $grid_uom == percent {
     @if $grid_border > 0 {
-      
+
       @if $border_place != '' {
         border-#{$border_place}-width: #{$grid_border}px;
       }
@@ -74,7 +74,7 @@
       border-color: $border_color;
       border-style: $standard_border_style;
     }
-    
+
     $grid_width: $col_gutter_width / $grid_context_width * 100%;
     @if $grid_padding_lr > 0 {
       padding: {
@@ -89,7 +89,7 @@
       }
     }
     width: $grid_width;
-    
+
      @if $grid_width_fallback < $col_gutter_width {
       @if $border_place != '' {
         $grid_width_fallback: $grid_width_fallback + $grid_border;
@@ -104,43 +104,4 @@
       }
     }
   }
-  
-  // keeping this around just in case, but I really hate this concept of support.  
-  // much better managed with the percentage grid system taking into account context
-  // this was a bad idea anyway. 
-  
-  // @else if $grid_uom == combo {
-  //  @if $grid_border > 0 {
-  //    
-  //    @if $border_place != '' {
-  //      border-#{$border_place}-width: #{$grid_border}px;
-  //    }
-  //    @else {
-  //      border-width: #{$grid_border}px;
-  //    }
-  //    border-color: $border_color;
-  //    border-style: $standard_border_style;
-  //  }
-  //  
-  //  $grid_width: $col_gutter_width / $grid_context_width * 100%;
-  //  @if $grid_padding_lr > 0 {
-  //    padding: {
-  //      left: em($grid_padding_l);
-  //      right: em($grid_padding_r);
-  //    }
-  //  }
-  //  @if $grid_padding_tb > 0 {
-  //    padding: {
-  //      top: em($grid_padding_tb);
-  //      bottom: em($grid_padding_tb);
-  //    }
-  //  }
-  //  width: $grid_width;
-  //  
-  //  @if $grid_width_fallback < $col_gutter_width {
-  //    .no-boxsizing & {
-  //      width: $grid_width_fallback / $grid_context_width * 100%;
-  //     }
-  //  }
-  // }
 }

data/stylesheets/stipe/resets/_toadstool.scss

@@ -4,6 +4,7 @@
 
 
 @import "../color/default_color_palette";
+@import "../stipe/mixins";
 
 
 // *-------------------------------------------------------------------------------
@@ -11,13 +12,13 @@
 // *	HTML5 Reset :: style.css
 // *	----------------------------------------------------------
 // *	We have learned much from/been inspired by/taken code where offered from:
-// *	
+// *
 // *	Eric Meyer					:: http://ericmeyer.com
 // *	HTML5 Doctor				:: http://html5doctor.com
 // *	and the HTML5 Boilerplate	:: http://html5boilerplate.com
-// *	
+// *
 // *	Mods by Dale Sande			:: toadstool awesome
-// *	
+// *
 // *-------------------------------------------------------------------------------
 
 
@@ -28,13 +29,15 @@ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pr
 	margin: 0;
 	padding: 0;
 	border: 0;
-	//outline: 0;
 	vertical-align: baseline;
 	background: transparent;
 }
 
+* {
+  @include box-sizing;
+}
+
 body {
-	//line-height: 1;
 	font-size: 100%;
 	-webkit-font-smoothing: antialiased;
 }
@@ -44,7 +47,7 @@ article, aside, figure, footer, header, hgroup, nav, section {
 }
 
 // * Responsive images and other embedded objects
-// * Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers. 
+// * Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers.
 // * There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue.
 
 img, object, embed {
@@ -57,7 +60,7 @@ img {
 	border-width: 0;
 }
 
-// * we use a lot of ULs that aren't bulleted. 
+// * we use a lot of ULs that aren't bulleted.
 // * don't forget to restore the bullets within content.
 
 ol,ul {
@@ -201,7 +204,7 @@ mark {
 	font-style: italic;
 	font-weight: bold;
 }
-	
+
 ::selection {
 	background: $selection_color;
 	color: $selection_text_color;
@@ -210,4 +213,4 @@ mark {
 ::-moz-selection {
 	background: $selection_color;
 	color: $selection_text_color;
-}
+}

data/stylesheets/stipe/toadstool/_buttons.scss

@@ -1,11 +1,13 @@
 [class*="toadstool"] {
 	.nav_toggle {
-		@include linear_gradient_w3c ($alpha_gray, #{$delta_gray 0%, $alpha_gray 100%});
-		&:hover {
-			@include linear_gradient_w3c ($alpha_gray, #{$alpha_gray 0%, $delta_gray 100%});
-			border-color: $alpha_gray;
-			box-shadow: 0 0 0;
-		}
+    background-color: $alpha_gray; // Old browsers
+    @include background-image(linear-gradient(top,  $delta_gray 0%, $alpha_gray 100%));
+    &:hover {
+      background-color: $alpha_gray; // Old browsers
+      @include background-image(linear-gradient(top,  $alpha_gray 0%, $delta_gray 100%));
+      border-color: $alpha_gray;
+      box-shadow: 0 0 0;
+    }
 		text-shadow: 0 0 0;
 		box-shadow: 0 0 0;
 		border-color: $alpha_gray;
@@ -19,11 +21,11 @@
 			font-weight: normal;
 			span {
 				&:after {
-					content: "\f00b"; 
+					content: "\f00b";
 					font-family: $icon_font_alpha;
 					font-size: 2em;
 				}
 			}
 		}
 	}
-}
+}

data/stylesheets/stipe/toadstool/_config.scss

@@ -6,19 +6,19 @@
 ///// Typography configuration /////
 // -----------------------------------------------------------------------------
 // $font_size: 12 !default;
-// 
+//
 $heading_1: 32 !default;
 $heading_2: 24 !default;
 // $heading_3: 28 !default;
 // $heading_4: 18 !default;
 // $heading_5: 18 !default;
 // $heading_6: 18 !default;
-// 
+//
 // $line: $font_size * 1.5 !default;
-// 
+//
 // $small_point_size: 10 !default;
 // $large_point_size: 14 !default;
-// 
+//
 // $primary_font_family: #{"Helvetica Neue", Arial, sans-serif} !default;
 // $secondary_font_family: #{"Helvetica Neue", Arial, sans-serif} !default;
 $heading_font_family: #{'Lato', sans-serif} !default;
@@ -79,7 +79,7 @@ $heading_font_family: #{'Lato', sans-serif} !default;
 // $grid_child:                 none !default;           // sets parent child relationship between grid blocks
 // $grid_align:                 default !default;        // by default grids float left. Optional argument is ``center``
 // $col_base:                   10 !default;             // equal to 10px in the standard 960.gs
-// $col_gutter:                 $col_base * 2 !default;  // sets default grid gutter width                            
+// $col_gutter:                 $col_base * 2 !default;  // sets default grid gutter width
 // $grid_960:                   960 / 100% !default;     // grid math for percentages
 
 
@@ -133,15 +133,15 @@ $heading_font_family: #{'Lato', sans-serif} !default;
 // $input_disabled_bkg:            lighten($input_disabled, 75%) !default;
 // $input_disabled_border:         lighten($input_disabled, 50%) !default;
 // $input_disabled_text:           lighten($input_disabled, 50%) !default;
-//                                 
+//
 // $form_field_background_color:   $white !default;
 // $form_field_focus_color:        $white !default;
 // $form_field_fail_bkg:           $white !default;
-//                                 
+//
 // $form_field_border:             $charlie_gray !default;
 // $form_field_border_fail:        $alpha_color !default;
 // $form_field_focus_border_color: $charlie_gray !default;
-//                                 
+//
 // $form_field_text:               $primary_text !default;
 // $error_text:                    $alpha_color !default;
 // $form_field_fail:               $alpha_color !default;
@@ -206,10 +206,10 @@ $iblur:                                3 !default;                // inset blur
 // $tablet:                    "screen and (max-width: 64em)" !default;
 // $tablet_portrait:           "screen and (max-width: 50em) and (orientation: portrait)" !default;
 // $tablet_landscape:          "screen and (max-width: 50em) and (orientation: landscape)" !default;
-// 
+//
 // $mobile:                    "screen and (max-width: 30em)" !default;
 // $mobile_portrait:	          "screen and (max-width: 30em) and (orientation : portrait)" !default;
-// $mobile_landscape:	        "screen and (max-width: 30em) and (orientation : landscape)" !default; 
+// $mobile_landscape:	        "screen and (max-width: 30em) and (orientation : landscape)" !default;
 
 
 // Compass function for creating grid background

data/stylesheets/stipe/toadstool/_design.scss

@@ -1,26 +1,24 @@
-
-
 .styleguide_main_content {
 	@include full_width_block(12);
-	
+
 	.styleguide_article, .element_example {
 		@include grid(12.25, alphaomega, $grid_align: center, $grid_uom: em);
-		
+
 		@media #{$tablet_portrait} {
 		 @include grid(12.25, alphaomega, $grid_align: center);
 		}
-		
+
 		@media #{$mobile} {
 		 @include grid(12.25, alphaomega, $grid_align: center);
 		}
-		
+
 		.toadstool_header, .toadstool_subheader {
 			@include grid(12);
 			@media #{$mobile} {
 			 @include grid(4, $grid_context: 4);
 			}
 		}
-		
+
 		section {
 			clear: both;
 			&:nth-of-type(1n+2) {
@@ -52,4 +50,4 @@
 code {
 	padding: em(2) em(5);
 	background: $charlie_color_hotel;
-}
+}

data/stylesheets/stipe/toadstool/_ui_manifest.scss

@@ -11,18 +11,20 @@
 
 // Following sequence will load the necessary Stipe libraries
 // ------------------------------------------------------------------------------
+@import "compass/css3";
+
 @import "stipe/media";
-@import "stipe/stipe";                   
+@import "stipe/stipe";
 @import "stipe/media";
-@import "stipe/typography";             
-@import "stipe/grid";      
-@import "stipe/forms";               
-@import "stipe/color";                   
-@import "stipe/gradients"; 
-               
+@import "stipe/typography";
+@import "stipe/grid";
+@import "stipe/forms";
+@import "stipe/color";
+@import "stipe/gradients";
+
 
 
-// This where you start building your own styles. 
+// This where you start building your own styles.
 // ------------------------------------------------------------------------------
 @import "typography";
 @import "design";
@@ -30,4 +32,4 @@
 @import "buttons";
 @import "grids";
 @import "ui_patterns";
-@import "modules";
+@import "modules";

data/stylesheets/stipe/toadstool/modules/_main_nav.scss

@@ -5,7 +5,8 @@
     font-weight: bold;
     @media #{$mobile} {
       @include flexbox(100%, auto, $orient: vertical);
-      @include linear_gradient_w3c ($bravo_gray, #{$bravo_gray 30%,$delta_gray 100%});
+      background-color: $bravo_gray; // Old browsers
+      @include background-image(linear-gradient(top,  $bravo_gray 30%, $delta_gray 100%));
     }
   }
   li {
@@ -26,7 +27,7 @@
   }
   a {
     color: $white;
-    @include linear_gradient_w3c ($bravo_gray, #{$bravo_gray 50%,$delta_gray 100%}); 
+    @include linear_gradient_w3c ($bravo_gray, #{$bravo_gray 50%,$delta_gray 100%});
     .no-flexbox & {
       padding: 0 em(10);
     }
@@ -46,4 +47,4 @@
       }
     }
   }
-}
+}

metadata

@@ -1,8 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: stipe
 version: !ruby/object:Gem::Version
-  version: 0.0.5.7.6
-  prerelease: 
+  version: 0.0.5.7.7
 platform: ruby
 authors:
 - Dale Sande
@@ -15,7 +14,6 @@ dependencies:
 - !ruby/object:Gem::Dependency
   name: compass
   requirement: !ruby/object:Gem::Requirement
-    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
@@ -23,7 +21,6 @@ dependencies:
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
-    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
@@ -31,7 +28,6 @@ dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
   requirement: !ruby/object:Gem::Requirement
-    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
@@ -39,7 +35,6 @@ dependencies:
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
-    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
@@ -124,26 +119,25 @@ files:
 - stylesheets/stipe/typography/web_fonts/readme.md
 homepage: https://github.com/Anotheruiguy/stipe
 licenses: []
+metadata: {}
 post_install_message: 
 rdoc_options: []
 require_paths:
 - lib
 required_ruby_version: !ruby/object:Gem::Requirement
-  none: false
   requirements:
   - - ! '>='
     - !ruby/object:Gem::Version
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
-  none: false
   requirements:
   - - ! '>='
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 1.8.23
+rubygems_version: 2.0.3
 signing_key: 
-specification_version: 3
+specification_version: 4
 summary: Core styles for Toadstool
 test_files: []