quantity-queries 0.3 → 0.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 27af58380f1095ba6712bdee07903c8cbfa16e8a
-  data.tar.gz: 093e7c311fb519136ba5de27313d981d78048498
+  metadata.gz: 0560b5c09bd33a74008faa3e727e10f8675f18bd
+  data.tar.gz: 16fbfb76b7cefd8635062884a9fc742b9c3c2368
 SHA512:
-  metadata.gz: 64ce70879377bc8ffcebee73fb86654d6e1e60bfc9cef825e7c15ffa83af9f693289dc8796dbb0920ce42815705982ead37ea1de14ed36ac02820549c2163230
-  data.tar.gz: 3c2e04017c8979fd4e0a22224756d06a5494e4593b210e6c45cac1500560311733434e496cc05f227a86e88a619a9c0229dee52820964cc890ac0337a9571407
+  metadata.gz: 2b358e16029c320a4f0f40dc0df22bd8b2884536b4fb938731fc468615e04b977dd7baf36d66dd5c4b4779da04845458089af2945b3098f8a91642361bf160f2
+  data.tar.gz: 4f6f5f7e13fe362efa764d099a0a770e9e3fdd98bf0ab19d0e46122ffc64116040768c5896d7b78deb4c34581073c038313a94654559014d4e94c95a6a90c030

data/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 0.4.0
+
+* Added exactly() mixin
+
+## 0.3.0
+
+* Added more checks
+
+## 0.2.0
+
+* Small fixes
+
 ## 0.1.0
 
 * Initial release

data/README.md

@@ -1,6 +1,8 @@
 # Quantity Queries mixins
 
-Simple quantity queries mixins for Sass. Use quantity as a condition. Learn more about quantity queries in this [A List Apart article](http://alistapart.com/article/quantity-queries-for-css).
+Simple quantity queries mixins for Sass. Use quantity as a condition to style your items. Learn more about quantity queries in this [A List Apart article](http://alistapart.com/article/quantity-queries-for-css). See the mixins in action in this [CodePen Demo](http://codepen.io/danielguillan/pen/GgBOxm)
+
+[![Build Status](https://travis-ci.org/danielguillan/quantity-queries.svg?branch=master)](https://travis-ci.org/danielguillan/quantity-queries)
 
 ## Install
 
@@ -27,25 +29,32 @@ Import it into your main stylesheet:
 
 	@import 'quantity-queries';
 
-### at-least
+### at-least()
 
-Target the items inside elements that contain N items or more:
+Target the items inside elements that contain `$count` items or more:
 
 	@include at-least($count) { ... }
 
 
-### at-most
+### at-most()
+
+Target the items inside elements that contain `$count` items or less:
+
+	@include at-most($count) { ... }
+
+
+### between()
 
-Target the items inside elements that contain N items or less:
+Target the items inside elements that contain a range between `$first` and `$last` items:
 
-	@include nope($count) { ... }
+	@include between($first, $last) { ... }
 
 
-### between
+### exactly()
 
-Target the items inside elements that contain between X and Y items:
+Target the items inside elements that contain exactly `$count` items:
 
-	@include between($at-least, $at-most) { ... }
+	@include exactly($count) { ... }
 
 ### Example
 
@@ -68,22 +77,28 @@ ul > li {
 	@include between(5, 8) {
 		background-color: green;
 	}
+
+	// Add a shadow to `li` items when there are exactly 8 items
+	@include exactly(8) {
+		box-shadow: 0 1px 3px #000;
+	}
 }
 ```
 
 ### Custom selector
 
-The quantity query mixins assume you want to use the current simple selector for
-all your items by default. `li` in the previous example. If you need a diffrent
-selector or want it to be selector agnostic (a.k.a. the universal selector: `*`)
-you just need to pass it in the mixin:
+The quantity query mixins assume you want to use the current last simple selector for all the items by default (`li` in the above example). If you need a different selector or want the quantity query to be selector agnostic pass the desired selector to the mixin.
 
 ```scss
 
 	nav div {
-		@include at-leat(4, '*') { ... }; // selector agnostic
+		@include at-least(4, '*') { ... }; // selector agnostic (universal selector)
 		@include between(4, 8, 'span') { ... }; // use span instead of div
 	}
 ```
 
-### Demo on [CodePen](http://codepen.io/danielguillan/pen/GgBOxm)
+## Demo on [CodePen](http://codepen.io/danielguillan/pen/GgBOxm)
+
+## [LESS version](https://github.com/adjohnson916/quantity-queries.less)
+(by [@adjohnson916](https://github.com/adjohnson916))
+

data/lib/quantity-queries.rb

@@ -3,6 +3,6 @@ extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
 Compass::Frameworks.register('quantity-queries', :path => extension_path)
 
 module QuantityQueries
-  VERSION = "0.3"
-  DATE = "2015-03-04"
+  VERSION = "0.4"
+  DATE = "2015-03-09"
 end

data/stylesheets/_quantity-queries.scss

@@ -7,6 +7,7 @@
 // 3. At least
 // 4. At most
 // 5. Between
+// 6. Exactly
 
 
 // -----------------------------------------------------------------------------
@@ -76,7 +77,7 @@
     $selector-append: ':nth-last-child(n+#{$count})';
 
     @if type-of($count) != 'number' or not unitless($count) or $count < 1 {
-        @error '`#{$count}` is not a valid number for `at-leat`';
+        @error '`#{$count}` is not a valid number for `at-least`';
     }
 
     @if $selector != null and (type-of($selector) != 'string' or length($selector) > 1) {
@@ -118,10 +119,10 @@
         @error '`#{$selector}` is not a valid selector for `at-most`';
     }
 
-    $at-least-selector: _build-quantity-selector($selector-append, $selector);
+    $at-most-selector: _build-quantity-selector($selector-append, $selector);
 
 
-    @at-root #{$at-least-selector} {
+    @at-root #{$at-most-selector} {
         @content;
     }
 }
@@ -148,11 +149,11 @@
     $selector-append: ':nth-last-child(n+#{$first}):nth-last-child(-n+#{$last}):first-child';
 
     @if type-of($first) != 'number' or not unitless($first) or $first < 1 {
-        @error '`#{$first}` is not a valid number for `at-leat`';
+        @error '`#{$first}` is not a valid number for `between`';
     }
 
     @if type-of($last) != 'number' or not unitless($last) or $last < 1 {
-        @error '`#{$last}` is not a valid number for `at-leat`';
+        @error '`#{$last}` is not a valid number for `between`';
     }
 
     @if $first > $last {
@@ -163,10 +164,45 @@
         @error '`#{$selector}` is not a valid selector for `between`';
     }
 
-    $at-least-selector: _build-quantity-selector($selector-append, $selector);
+    $between-selector: _build-quantity-selector($selector-append, $selector);
 
 
-    @at-root #{$at-least-selector} {
+    @at-root #{$between-selector} {
+        @content;
+    }
+}
+
+
+// -----------------------------------------------------------------------------
+// 6. Exactly
+// -----------------------------------------------------------------------------
+
+/// Query when total items is exactly N items
+/// @param  {number} $count - Quantity to match (equal)
+/// @example scss - Make the items color red when there are exactly 4 items
+///   ul li {
+///     @include exactly(4) { color: red; }
+///   }
+/// @example scss - Make the items color blue when there are exactly 6 items and use '*' (element agnostic) as the item selector
+///   ul li {
+///     @include exactly(6, '*') { color: blue; }
+///   }
+
+@mixin exactly($count, $selector: null) {
+    $selector-append: ':nth-last-child(#{$count}):first-child';
+
+    @if type-of($count) != 'number' or not unitless($count) or $count < 1 {
+        @error '`#{$count}` is not a valid number for `exactly`';
+    }
+
+    @if $selector != null and (type-of($selector) != 'string' or length($selector) > 1) {
+        @error '`#{$selector}` is not a valid selector for `exactly`';
+    }
+
+    $exactly-selector: _build-quantity-selector($selector-append, $selector);
+
+
+    @at-root #{$exactly-selector} {
         @content;
     }
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: quantity-queries
 version: !ruby/object:Gem::Version
-  version: '0.3'
+  version: '0.4'
 platform: ruby
 authors:
 - Daniel Guillan
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2015-03-04 00:00:00.000000000 Z
+date: 2015-03-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -30,14 +30,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 1.0.0
+        version: '1.0'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 1.0.0
+        version: '1.0'
 description: Simple item quantity queries mixins for Sass
 email:
 - daniel.guillan@gmail.com