gridle 1.0.9.7 → 1.0.9.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: f10fc0b150ab3c64be7e0097cce080371660a7e9
-  data.tar.gz: bc9ae8b1c2c60516515139c6f399d403a0a7288d
+  metadata.gz: faec1a968eba7f2d396f243ef3ab3a07956e8933
+  data.tar.gz: fa78e2667852d67d71bb64fa785885a5f583d90b
 SHA512:
-  metadata.gz: 70657a3825f54ba8ebb85aea0f55379863fe82599b4b3f9ed83dc9fc9d8e0217c9dd675cab8144a2e0e2c27d2f55410f30a4e76c0580b4e662a1465cfd3dc3a5
-  data.tar.gz: 56eaa5dea9ca3d596a02688b088daa773c53e471b859c92991a22cc7e782380e03d2588231a61897b0175f279cb799b3d42bb71c07edcf3159d402df3bce21f0
+  metadata.gz: 1932d9238a563afb9017e724018360aa5660efa8189e3292912f5ca9552d8e0ab7d784c9475ca53f806c94ff4ae3df06bab637405e53d547ec735075a23c86cc
+  data.tar.gz: c57c67cee58a57920e5d5df3b681b5d0008ad1cf0b2303838352f769464dcabdaf110f645760adb84d3438926fe5d3f828c49ecdb2598f18d6adcba16fe44326

data/lib/gridle.rb

@@ -17,8 +17,8 @@ Compass::Frameworks.register('gridle', :path => extension_path)
 #    a prerelease version
 #  Date is in the form of YYYY-MM-DD
 module Extension
-  VERSION = "1.0.9.7"
-  DATE = "2013-11-20"
+  VERSION = "1.0.9.8"
+  DATE = "2013-11-26"
 end
 
 # This is where any custom SassScript should be placed. The functions will be  

data/stylesheets/gridle/_gridle.scss

@@ -29,9 +29,9 @@
 // |------------------------------------------------------
 // |------------------------------------------------------
 // @created 	25.03.13
-// @updated 	20.11.13
+// @updated 	26.11.13
 // @author 		Olivier Bossel <olivier.bossel@gmail.com>
-// @version 	1.0.9.7
+// @version 	1.0.9.8
 // |------------------------------------------------------
 // |------------------------------------------------------
 
@@ -396,10 +396,11 @@ $_gridle-state-15-classes 			: true !default;
 // @param 	String 	$state 	The state name
 // @return 	String 			The query
 @function _get_media_query_for_state(
-	$state
+	$state-or-min-width : null,
+	$max-width : null
 ) {
 	// get the index of state :
-	$idx : _gridle_get_media_query_index_by_name($state);
+	$idx : _gridle_get_media_query_index_by_name($state-or-min-width);
 
 	// if there's an idx, the state requested is a registered one :
 	@if $idx {
@@ -419,26 +420,37 @@ $_gridle-state-15-classes 			: true !default;
 
 				// write media query :
 				@if $min-width and $max-width {
-					@return "@media screen and (min-width: #{$min-width}) and (max-width: #{$max-width})";
+					@return "screen and (min-width: #{$min-width}) and (max-width: #{$max-width})";
 				} @else if $min-width == null and $max-width {
-					@return "@media screen and (max-width: #{$max-width})";
+					@return "screen and (max-width: #{$max-width})";
 				} @else if $min-width and $max-width == null {
-					@return "@media screen and (min-width: #{$min-width})";
+					@return "screen and (min-width: #{$min-width})";
 				} @else {
 					@return null;
 				}
 			}
 		}
-	} @else if $state == 'print' or $state == print {
+	} @else if $state-or-min-width == 'print' or $state-or-min-width == print {
 		@return "only print";
-	} @else if $state == 'tv' or $state == tv {
+	} @else if $state-or-min-width == 'tv' or $state-or-min-width == tv {
 		@return "only tv";
-	} @else if $state == 'portrait' or $state == portrait {
+	} @else if $state-or-min-width == 'portrait' or $state-or-min-width == portrait {
 		@return "only screen and (orientation: portrait)";
-	} @else if $state == 'landscape' or $state == landscape {
+	} @else if $state-or-min-width == 'landscape' or $state-or-min-width == landscape {
 		@return "only screen and (orientation: landscape)";
-	} @else if $state == 'retina' or $state == retina {
+	} @else if $state-or-min-width == 'retina' or $state-or-min-width == retina {
 		@return "only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx)";
+	} @else {
+		// check for min and max width :
+		@if $state-or-min-width and $max-width {
+			@return "screen and (min-width: #{$state-or-min-width}) and (max-width: #{$max-width})";
+		} @else if $state-or-min-width and $max-width == null {
+			@return "screen and (min-width: #{$state-or-min-width})";
+		} @else if $state-or-min-width == null and $max-width {
+			@return "screen and (max-width: #{$max-width})";
+		} @else {
+			@return null;
+		}
 	}
 }
 
@@ -789,83 +801,33 @@ $_gridle-state-15-classes 			: true !default;
 	$max-width : null,
 	$has-parent : true
 ) {
-	// get the index of state :
-	$idx : _gridle_get_media_query_index_by_name($state-or-min-width);
-	
-	// check if is a state :
-	@if type-of($state-or-min-width) == string and $gridle-html-states-classes {
-		// html class :
-		@if $has-parent {
-			html#{_gridle_prefixed_class("#{$state-or-min-width}")} & { @content; }
-		} @else {
-			html#{_gridle_prefixed_class("#{$state-or-min-width}")} { @content; }
-		}
-	}
 
-	// if an idx exist, mean that it's a registered state :
-	@if $idx {
-		// get vars :
-		$name : _gridle_get_media_query_vars($idx,"name");
-		$min-width : _gridle_get_media_query_vars($idx,"min-width");
-		$max-width : _gridle_get_media_query_vars($idx,"max-width");
-		$classes : _gridle_get_media_query_vars($idx,"classes");
-		$query : _gridle_get_media_query_vars($idx,"query");
+	// query list :
+	$query : ();
 
-		// check if exist :
-		@if $name {
-			// check if query exist :
-			@if $query {
-				@media #{$query} {
-					@content;
-				}
+	// loop on each states :
+	@each $_state-or-min-width in $state-or-min-width {
+
+		// check if is a state :
+		@if type-of($_state-or-min-width) == string and $gridle-html-states-classes {
+			// html class :
+			@if $has-parent {
+				html#{_gridle_prefixed_class("#{$_state-or-min-width}")} & { @content; }
 			} @else {
-				// write media query :
-				@if $min-width and $max-width {
-					@media screen and (min-width: $min-width) and (max-width: $max-width) { @content; }
-				} @else if $min-width == null and $max-width {
-					@media screen and (max-width: $max-width) { @content; }
-				} @else if $min-width and $max-width == null {
-					@media screen and (min-width: $min-width) { @content; }
-				} @else {
-					@content;
-				}
+				html#{_gridle_prefixed_class("#{$_state-or-min-width}")} { @content; }
 			}
 		}
-	} @else if $state-or-min-width == 'print' or $state-or-min-width == print {
-		@media only print {
-			@content;
-		}
-	} @else if $state-or-min-width == 'tv' or $state-or-min-width == tv {
-		@media only tv {
-			@content;
-		}
-	} @else if $state-or-min-width == 'portrait' or $state-or-min-width == portrait {
-		@media only screen and (orientation: portrait) {
-			@content;
-		}
-	} @else if $state-or-min-width == 'landscape' or $state-or-min-width == landscape {
-		@media only screen and (orientation: landscape) {
-			@content;
-		}
-	} @else if $state-or-min-width == 'retina' or $state-or-min-width == retina {
-		@media only screen and (-webkit-min-device-pixel-ratio: 2),
-			   only screen and (   min--moz-device-pixel-ratio: 2),
-			   only screen and (     -o-min-device-pixel-ratio: 2/1),
-			   only screen and (        min-device-pixel-ratio: 2),
-			   only screen and (                min-resolution: 192dpi),
-			   only screen and (                min-resolution: 2dppx)
-		{
-			@content;
+
+		// get the media query :
+		$q : _get_media_query_for_state($_state-or-min-width, $max-width);
+		@if $q {
+			$query : append($query, unquote("#{$q}"), comma);
 		}
-	} @else {
-		// check for min and max width :
-		@if $state-or-min-width and $max-width {
-			@media screen and (min-width: $state-or-min-width) and (max-width: $max-width) { @content; }
-		} @else if $state-or-min-width and $max-width == null {
-			@media screen and (min-width: $state-or-min-width) { @content; }
-		} @else if $state-or-min-width == null and $max-width {
-			@media screen and (max-width: $max-width) { @content; }
-		} @else {
+	}
+
+	// check and print media query :
+	@if length($query) {
+		@media #{$query} {
 			@content;
 		}
 	}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: gridle
 version: !ruby/object:Gem::Version
-  version: 1.0.9.7
+  version: 1.0.9.8
 platform: ruby
 authors:
 - Olivier Bossel
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-11-20 00:00:00.000000000 Z
+date: 2013-11-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass