quantity-queries 0.2 → 0.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +6 -5
- data/lib/quantity-queries.rb +1 -1
- data/stylesheets/_quantity-queries.scss +14 -7
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 27af58380f1095ba6712bdee07903c8cbfa16e8a
|
4
|
+
data.tar.gz: 093e7c311fb519136ba5de27313d981d78048498
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 64ce70879377bc8ffcebee73fb86654d6e1e60bfc9cef825e7c15ffa83af9f693289dc8796dbb0920ce42815705982ead37ea1de14ed36ac02820549c2163230
|
7
|
+
data.tar.gz: 3c2e04017c8979fd4e0a22224756d06a5494e4593b210e6c45cac1500560311733434e496cc05f227a86e88a619a9c0229dee52820964cc890ac0337a9571407
|
data/README.md
CHANGED
@@ -1,8 +1,6 @@
|
|
1
1
|
# Quantity Queries mixins
|
2
2
|
|
3
|
-
Simple quantity queries mixins for Sass. Use quantity as a condition. Learn more about quantity queries in this [http://alistapart.com/article/quantity-queries-for-css
|
4
|
-
|
5
|
-
[![Build Status](https://travis-ci.org/danielguillan/quantity-queries.svg?branch=master)](https://travis-ci.org/danielguillan/quantity-queries)
|
3
|
+
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).
|
6
4
|
|
7
5
|
## Install
|
8
6
|
|
@@ -83,6 +81,9 @@ you just need to pass it in the mixin:
|
|
83
81
|
```scss
|
84
82
|
|
85
83
|
nav div {
|
86
|
-
@include at-leat(4, '*'); // selector agnostic
|
87
|
-
@include between(4, 8, 'span'); // use span instead of div
|
84
|
+
@include at-leat(4, '*') { ... }; // selector agnostic
|
85
|
+
@include between(4, 8, 'span') { ... }; // use span instead of div
|
88
86
|
}
|
87
|
+
```
|
88
|
+
|
89
|
+
### Demo on [CodePen](http://codepen.io/danielguillan/pen/GgBOxm)
|
data/lib/quantity-queries.rb
CHANGED
@@ -18,8 +18,7 @@
|
|
18
18
|
/// @param {list | string} $selector - A single selector
|
19
19
|
/// @return {string} - The last simple selector in $selector
|
20
20
|
/// @example scss
|
21
|
-
/// $result: _last-simple-selector(ul > li); //
|
22
|
-
/// @todo: check that $selector is a valid list with a single selector
|
21
|
+
/// $result: _last-simple-selector(ul > li); // li
|
23
22
|
|
24
23
|
@function _last-simple-selector($selector) {
|
25
24
|
$parsed: selector-parse($selector);
|
@@ -39,9 +38,9 @@
|
|
39
38
|
|
40
39
|
/// Builds the selector for the quantity query
|
41
40
|
/// @access private
|
42
|
-
/// @param {string} $selector-append - The selector to
|
43
|
-
/// @param {string} $last-selector - The
|
44
|
-
/// @return {list} - The
|
41
|
+
/// @param {string} $selector-append - The selector to be appended
|
42
|
+
/// @param {string} $last-selector - The item's selector
|
43
|
+
/// @return {list} - The final quantity query selector
|
45
44
|
|
46
45
|
@function _build-quantity-selector($selector-append, $last-selector) {
|
47
46
|
$quantity-selector: ();
|
@@ -76,7 +75,7 @@
|
|
76
75
|
@mixin at-least($count, $selector: null) {
|
77
76
|
$selector-append: ':nth-last-child(n+#{$count})';
|
78
77
|
|
79
|
-
@if type-of($count) != 'number' {
|
78
|
+
@if type-of($count) != 'number' or not unitless($count) or $count < 1 {
|
80
79
|
@error '`#{$count}` is not a valid number for `at-leat`';
|
81
80
|
}
|
82
81
|
|
@@ -111,7 +110,7 @@
|
|
111
110
|
@mixin at-most($count, $selector: null) {
|
112
111
|
$selector-append: ':nth-last-child(-n+#{$count}):first-child';
|
113
112
|
|
114
|
-
@if type-of($count) != 'number' {
|
113
|
+
@if type-of($count) != 'number' or not unitless($count) or $count < 1 {
|
115
114
|
@error '`#{$count}` is not a valid number for `at-most`.';
|
116
115
|
}
|
117
116
|
|
@@ -148,6 +147,14 @@
|
|
148
147
|
@mixin between($first, $last, $selector: null) {
|
149
148
|
$selector-append: ':nth-last-child(n+#{$first}):nth-last-child(-n+#{$last}):first-child';
|
150
149
|
|
150
|
+
@if type-of($first) != 'number' or not unitless($first) or $first < 1 {
|
151
|
+
@error '`#{$first}` is not a valid number for `at-leat`';
|
152
|
+
}
|
153
|
+
|
154
|
+
@if type-of($last) != 'number' or not unitless($last) or $last < 1 {
|
155
|
+
@error '`#{$last}` is not a valid number for `at-leat`';
|
156
|
+
}
|
157
|
+
|
151
158
|
@if $first > $last {
|
152
159
|
@error '#{$first} can´t be larger that #{$last} for `between`';
|
153
160
|
}
|