neat 1.6.0 → 1.7.0.pre
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/.travis.yml +2 -0
- data/README.md +75 -13
- data/app/assets/stylesheets/_neat-helpers.scss +1 -0
- data/app/assets/stylesheets/_neat.scss +7 -5
- data/app/assets/stylesheets/functions/_private.scss +7 -18
- data/app/assets/stylesheets/grid/_box-sizing.scss +11 -0
- data/app/assets/stylesheets/grid/_direction.scss +33 -0
- data/app/assets/stylesheets/grid/_display.scss +28 -0
- data/app/assets/stylesheets/grid/_omega.scss +3 -3
- data/app/assets/stylesheets/grid/_outer-container.scss +32 -2
- data/app/assets/stylesheets/grid/_row.scss +10 -2
- data/app/assets/stylesheets/grid/_span-columns.scss +1 -1
- data/app/assets/stylesheets/grid/_to-deprecate.scss +18 -3
- data/app/assets/stylesheets/grid/_visual-grid.scss +5 -6
- data/app/assets/stylesheets/settings/_disable-warnings.scss +13 -0
- data/bower.json +2 -2
- data/lib/neat/version.rb +1 -1
- data/neat.gemspec +1 -1
- data/spec/neat/container_spec.rb +6 -0
- data/spec/neat/default_spec.rb +15 -0
- data/spec/neat/direction_spec.rb +19 -0
- data/spec/neat/display_spec.rb +19 -0
- data/spec/neat/media_spec.rb +1 -1
- data/spec/support/matchers/be_contained_in.rb +1 -1
- data/spec/support/matchers/have_rule.rb +1 -1
- data/spec/support/matchers/have_value.rb +1 -1
- data/test/_setup.scss +1 -2
- data/test/default.scss +1 -0
- data/test/direction.scss +13 -0
- data/test/display.scss +15 -0
- data/test/outer-container.scss +5 -1
- metadata +24 -9
- data/app/assets/stylesheets/grid/_grid.scss +0 -5
- data/app/assets/stylesheets/grid/_reset.scss +0 -12
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 0e635b5420b471f2183b97fb89b6a5085bacd7da
|
4
|
+
data.tar.gz: 1d5b344bbab66a83e193c33fde8da949107cac33
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 2f86479acc7c2051ff5d3cc355f8eedc7fe63bb9e95284cd7ab5d8f279373100b1e5909f1eaca5b4023e4efb5a74a151216abe6d4065efbe776d52a9f8cf737b
|
7
|
+
data.tar.gz: aa5789266491eae3174386a3624272c712c1f7dc7d79215625632d594888b7ae496f7a290b1c2e4ef2af5c76eb96b84a68f33dcd34498e00d52f682faf6407f4
|
data/.travis.yml
ADDED
data/README.md
CHANGED
@@ -1,14 +1,20 @@
|
|
1
1
|
[![Bourbon Neat](http://neat.bourbon.io/images/logotype.svg)](http://thoughtbot.com/neat)
|
2
2
|
|
3
|
-
|
3
|
+
-
|
4
4
|
|
5
|
-
|
5
|
+
[![Gem Version](http://img.shields.io/gem/v/neat.svg?style=flat)](https://rubygems.org/gems/neat) [![Travis](http://img.shields.io/travis/thoughtbot/neat.svg?style=flat)](https://travis-ci.org/thoughtbot/neat)
|
6
|
+
[![Code Climate](http://img.shields.io/codeclimate/github/thoughtbot/neat.svg?style=flat)](https://codeclimate.com/github/thoughtbot/neat)
|
7
|
+
[![IRC](http://img.shields.io/badge/freenode-%23bourbon--neat-ae3dd2.svg?style=flat)](#)
|
8
|
+
[![Stack Overflow](http://img.shields.io/badge/stack%20overflow-neat-ae3dd2.svg?style=flat)](http://stackoverflow.com/questions/tagged/neat)
|
6
9
|
|
10
|
+
Neat is an open source fluid grid framework built on top of [Bourbon](http://bourbon.io) with the aim of being easy enough to use out of the box and flexible enough to customize down the road.
|
11
|
+
|
12
|
+
:warning: Neat **1.6.0** requires Sass **3.3.x**. If you are using **libsass** or **sass-rails** use **1.5.1**.
|
7
13
|
|
8
14
|
Requirements
|
9
15
|
===
|
10
|
-
- Sass 3.
|
11
|
-
- Bourbon
|
16
|
+
- Sass 3.3+
|
17
|
+
- Bourbon 3.1+
|
12
18
|
|
13
19
|
Install Instructions
|
14
20
|
===
|
@@ -33,8 +39,8 @@ neat install
|
|
33
39
|
In your main stylesheet:
|
34
40
|
|
35
41
|
```sass
|
36
|
-
@import
|
37
|
-
@import
|
42
|
+
@import 'bourbon/bourbon';
|
43
|
+
@import 'neat/neat';
|
38
44
|
```
|
39
45
|
|
40
46
|
To update Neat files, run:
|
@@ -69,8 +75,8 @@ bundle update sass
|
|
69
75
|
Within your `application.css.scss` file place the following:
|
70
76
|
|
71
77
|
```sass
|
72
|
-
@import
|
73
|
-
@import
|
78
|
+
@import 'bourbon';
|
79
|
+
@import 'neat';
|
74
80
|
```
|
75
81
|
|
76
82
|
Getting started
|
@@ -79,15 +85,15 @@ Getting started
|
|
79
85
|
First off, if you are planning to override the default grid settings (12 columns), it is recommended to create a `_grid-settings.scss` file for that purpose. Make sure to import it right *before* importing Neat:
|
80
86
|
|
81
87
|
```scss
|
82
|
-
@import
|
83
|
-
@import
|
84
|
-
@import
|
88
|
+
@import 'bourbon/bourbon'; // or 'bourbon' when in Rails
|
89
|
+
@import 'grid-settings';
|
90
|
+
@import 'neat/neat'; // or 'neat' when in Rails
|
85
91
|
```
|
86
92
|
|
87
93
|
In your newly created `_grid-settings.scss`, import `neat-helpers` if you are planning to use `new-breakpoint()`, then define your new variables:
|
88
94
|
|
89
95
|
```scss
|
90
|
-
@import
|
96
|
+
@import 'neat/neat-helpers'; // or 'neat-helpers' when in Rails
|
91
97
|
|
92
98
|
// Change the grid settings
|
93
99
|
$column: 90px;
|
@@ -123,8 +129,10 @@ If the element's parent isn't the top-most container, you need to add the number
|
|
123
129
|
```scss
|
124
130
|
div.container {
|
125
131
|
@include outer-container;
|
132
|
+
|
126
133
|
div.parent-element {
|
127
134
|
@include span-columns(8);
|
135
|
+
|
128
136
|
div.element {
|
129
137
|
@include span-columns(6 of 8);
|
130
138
|
}
|
@@ -168,15 +176,69 @@ Browser support
|
|
168
176
|
- IE 9+ (Visual grid is IE10 only)
|
169
177
|
- IE 8 with [selectivizr](http://selectivizr.com) (no `media()` support)
|
170
178
|
|
179
|
+
Frequently asked questions
|
180
|
+
==========================
|
181
|
+
|
182
|
+
##### How do I use `omega()` in a mobile-first workflow?
|
183
|
+
|
184
|
+
Using `omega()` with an `nth-child` pseudo selector in a mobile-first workflow
|
185
|
+
will cause the style to be applied to wider-viewport media queries as well. That
|
186
|
+
is the cascading nature of CSS.
|
187
|
+
|
188
|
+
One solution would be to provide an `omega-reset()` mixin that negates the
|
189
|
+
effect of `omega()` on that specific `nth-child` pseudo selector. While this is
|
190
|
+
often the most suggested solution, it is also a lazy hack that outputs ugly code
|
191
|
+
and can quickly get out of hand in complex layouts. As a general rule, having to
|
192
|
+
*undo* CSS styles is a sign of poor stylesheet architecture (More about
|
193
|
+
[CSS code smells](http://csswizardry.com/2012/11/code-smells-in-css/)).
|
194
|
+
|
195
|
+
The other, more elegant, solution is to use mutually exclusive media queries,
|
196
|
+
also referred to as [media-query
|
197
|
+
splitting](http://simurai.com/blog/2012/08/29/media-query-splitting/). This
|
198
|
+
would guarantee that `omega()` styles are only applied where desired.
|
199
|
+
|
200
|
+
```scss
|
201
|
+
$first-breakpoint-value: 400px;
|
202
|
+
$second-breakpoint-value: 700px;
|
203
|
+
$medium-viewport: new-breakpoint(min-width em($first-breakpoint-value) max-width
|
204
|
+
em($second-breakpoint-value));
|
205
|
+
$large-viewport: new-breakpoint(min-width em($second-breakpoint-value + 1));
|
206
|
+
|
207
|
+
.element {
|
208
|
+
@include media($medium-viewport) {
|
209
|
+
@include span-columns(6);
|
210
|
+
@include omega(2n);
|
211
|
+
}
|
212
|
+
|
213
|
+
@include media($large-viewport) {
|
214
|
+
@include span-columns(4);
|
215
|
+
@include omega(3n);
|
216
|
+
}
|
217
|
+
}
|
218
|
+
```
|
219
|
+
|
220
|
+
If, for some reason, you still think that `omega-reset` is the only way you want to go,
|
221
|
+
check out Josh Fry's
|
222
|
+
[omega-reset](http://joshfry.me/notes/omega-reset-for-bourbon-neat/).
|
223
|
+
|
224
|
+
##### Framework X has this feature that Neat seems to be missing. Can you add it?
|
225
|
+
|
226
|
+
Unless you [open a pull request](https://github.com/thoughtbot/neat/compare/), the answer is most likely going to be no. Neat is
|
227
|
+
lightweight and simple compared to other grid frameworks, and strives to
|
228
|
+
remain so. We have plans for adding new features in future versions of the
|
229
|
+
framework, but these will be most likely to support new ways of working with
|
230
|
+
layouts on the Web, not patches to existing ones.
|
231
|
+
|
171
232
|
Links
|
172
233
|
=====
|
173
234
|
|
174
235
|
- Read the [online documentation](http://neat.bourbon.io/docs/).
|
175
236
|
- Add the docset to [Dash](http://kapeli.com/dash) 1.8+ (Preferences **>** Downloads **>** + *Add Docset Feed* **>** `http://neat.bourbon.io/docset/Neat.xml`)
|
176
|
-
- Ask questions on [Stack Overflow](http://stackoverflow.com/questions/tagged/neat
|
237
|
+
- Ask questions on [Stack Overflow](http://stackoverflow.com/questions/tagged/neat). Don't forget to tag them `bourbon` and `neat`.
|
177
238
|
- Suggest features or file bugs in [Issues](https://github.com/thoughtbot/neat/issues).
|
178
239
|
- Read the [contribution guidelines](https://github.com/thoughtbot/neat/blob/master/CONTRIBUTING.md).
|
179
240
|
- Say hi to [@kaishin](https://twitter.com/kaishin) and [@kylefiedler](https://twitter.com/kylefiedler).
|
241
|
+
- Join `#bourbon-neat` on `irc.freenode.net`.
|
180
242
|
|
181
243
|
|
182
244
|
Credits & License
|
@@ -1,14 +1,14 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
1
|
+
/* Neat 1.7.0.pre
|
2
|
+
* http://neat.bourbon.io
|
3
|
+
* Copyright 2012–2014 thoughtbot, inc.
|
4
|
+
* MIT License */
|
4
5
|
|
5
6
|
// Helpers
|
6
7
|
@import "neat-helpers";
|
7
8
|
|
8
9
|
// Grid
|
9
10
|
@import "grid/private";
|
10
|
-
@import "grid/
|
11
|
-
@import "grid/grid";
|
11
|
+
@import "grid/box-sizing";
|
12
12
|
@import "grid/omega";
|
13
13
|
@import "grid/outer-container";
|
14
14
|
@import "grid/span-columns";
|
@@ -19,3 +19,5 @@
|
|
19
19
|
@import "grid/media";
|
20
20
|
@import "grid/to-deprecate";
|
21
21
|
@import "grid/visual-grid";
|
22
|
+
@import "grid/display";
|
23
|
+
@import "grid/direction";
|
@@ -1,30 +1,19 @@
|
|
1
1
|
// Checks if a number is even
|
2
2
|
@function is-even($int) {
|
3
|
-
@
|
4
|
-
@return true;
|
5
|
-
}
|
6
|
-
|
7
|
-
@return false;
|
3
|
+
@return $int % 2 == 0
|
8
4
|
}
|
9
5
|
|
10
6
|
// Checks if an element belongs to a list
|
11
7
|
@function belongs-to($tested-item, $list) {
|
12
|
-
@
|
13
|
-
@if $item == $tested-item {
|
14
|
-
@return true;
|
15
|
-
}
|
16
|
-
}
|
17
|
-
|
18
|
-
@return false;
|
8
|
+
@return index($list, $tested-item) != false;
|
19
9
|
}
|
20
10
|
|
21
11
|
// Contains display value
|
22
12
|
@function contains-display-value($query) {
|
23
|
-
@
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
@return false;
|
13
|
+
@return belongs-to(table, $query)
|
14
|
+
or belongs-to(block, $query)
|
15
|
+
or belongs-to(inline-block, $query)
|
16
|
+
or belongs-to(inline, $query);
|
28
17
|
}
|
29
18
|
|
30
19
|
// Parses the first argument of span-columns()
|
@@ -92,7 +81,7 @@
|
|
92
81
|
// Layout direction
|
93
82
|
@function get-direction($layout, $default) {
|
94
83
|
$direction: nil;
|
95
|
-
|
84
|
+
|
96
85
|
@if $layout == LTR or $layout == RTL {
|
97
86
|
$direction: direction-from-layout($layout);
|
98
87
|
} @else {
|
@@ -0,0 +1,33 @@
|
|
1
|
+
/**
|
2
|
+
* Changes the direction property used by other mixins called in the code block argument.
|
3
|
+
*
|
4
|
+
* @param {String} $direction (left-to-right) - Layout direction to be used within the block. Can be `left-to-right` or `right-to-left`.
|
5
|
+
*
|
6
|
+
* @example scss
|
7
|
+
* @include direction(right-to-left) {
|
8
|
+
* .right-to-left-block {
|
9
|
+
* @include span-columns(6);
|
10
|
+
* }
|
11
|
+
* }
|
12
|
+
*
|
13
|
+
* @example css
|
14
|
+
* // CSS
|
15
|
+
* .right-to-left-block {
|
16
|
+
* float: right;
|
17
|
+
* ...
|
18
|
+
* }
|
19
|
+
*/
|
20
|
+
|
21
|
+
@mixin direction($direction: left-to-right) {
|
22
|
+
$scope-direction: $layout-direction;
|
23
|
+
|
24
|
+
@if $direction == left-to-right {
|
25
|
+
$layout-direction: LTR !global;
|
26
|
+
} @else if $direction == right-to-left {
|
27
|
+
$layout-direction: RTL !global;
|
28
|
+
}
|
29
|
+
|
30
|
+
@content;
|
31
|
+
|
32
|
+
$layout-direction: $scope-direction !global;
|
33
|
+
}
|
@@ -0,0 +1,28 @@
|
|
1
|
+
/**
|
2
|
+
* Changes the display property used by other mixins called in the code block argument.
|
3
|
+
*
|
4
|
+
* @param {String} $display (block) - Display value to be used within the block. Can be `table` or `block`.
|
5
|
+
*
|
6
|
+
* @example scss
|
7
|
+
* @include display(table) {
|
8
|
+
* .display-table {
|
9
|
+
* @include span-columns(6);
|
10
|
+
* }
|
11
|
+
* }
|
12
|
+
*
|
13
|
+
* @example css
|
14
|
+
* // CSS
|
15
|
+
* .display-table {
|
16
|
+
* display: table-cell;
|
17
|
+
* ...
|
18
|
+
* }
|
19
|
+
*/
|
20
|
+
|
21
|
+
@mixin display($display: block) {
|
22
|
+
$scope-display: $container-display-table;
|
23
|
+
$container-display-table: if($display == table, true, false) !global;
|
24
|
+
|
25
|
+
@content;
|
26
|
+
|
27
|
+
$container-display-table: $scope-display !global;
|
28
|
+
}
|
@@ -4,13 +4,13 @@
|
|
4
4
|
$auto: if(belongs-to(auto, $query), true, false);
|
5
5
|
|
6
6
|
@if $direction != default {
|
7
|
-
@warn
|
7
|
+
@include -neat-warn("The omega mixin will no longer take a $direction argument. To change the layout direction, use the direction(){...} mixin.");
|
8
8
|
} @else {
|
9
9
|
$direction: get-direction($layout-direction, $default-layout-direction);
|
10
10
|
}
|
11
11
|
|
12
12
|
@if $table {
|
13
|
-
@warn
|
13
|
+
@include -neat-warn("The omega mixin no longer removes padding in table layouts.");
|
14
14
|
}
|
15
15
|
|
16
16
|
@if length($query) == 1 {
|
@@ -42,7 +42,7 @@
|
|
42
42
|
}
|
43
43
|
|
44
44
|
@else {
|
45
|
-
@warn
|
45
|
+
@include -neat-warn("Too many arguments passed to the omega() mixin.");
|
46
46
|
}
|
47
47
|
}
|
48
48
|
|
@@ -1,6 +1,36 @@
|
|
1
|
-
|
1
|
+
/**
|
2
|
+
* Makes an element a outer container by centring it in the viewport, clearing its floats, and setting its `max-width`.
|
3
|
+
*
|
4
|
+
* Although optional, using `outer-container` is recommended. The mixin can be called on more than one element per page, as long as they are not nested.
|
5
|
+
*
|
6
|
+
* @param {Number} $local-max-width ($max-width) - Max width to be applied to the element. Can be a percentage or a measure.
|
7
|
+
*
|
8
|
+
* @example scss
|
9
|
+
* .element {
|
10
|
+
* @include outer-container(100%);
|
11
|
+
* }
|
12
|
+
*
|
13
|
+
* @example css
|
14
|
+
* .element {
|
15
|
+
* *zoom: 1;
|
16
|
+
* max-width: 100%;
|
17
|
+
* margin-left: auto;
|
18
|
+
* margin-right: auto;
|
19
|
+
* }
|
20
|
+
*
|
21
|
+
* .element:before, .element:after {
|
22
|
+
* content: " ";
|
23
|
+
* display: table;
|
24
|
+
* }
|
25
|
+
*
|
26
|
+
* .element:after {
|
27
|
+
* clear: both;
|
28
|
+
* }
|
29
|
+
*/
|
30
|
+
|
31
|
+
@mixin outer-container($local-max-width: $max-width) {
|
2
32
|
@include clearfix;
|
3
|
-
max-width: $max-width;
|
33
|
+
max-width: $local-max-width;
|
4
34
|
margin: {
|
5
35
|
left: auto;
|
6
36
|
right: auto;
|
@@ -1,7 +1,14 @@
|
|
1
|
-
@mixin row($display:
|
2
|
-
@
|
1
|
+
@mixin row($display: default, $direction: $default-layout-direction) {
|
2
|
+
@if $direction != $default-layout-direction {
|
3
|
+
@include -neat-warn("The $direction argument will be deprecated in future versions in favor of the direction(){...} mixin.");
|
4
|
+
}
|
5
|
+
|
3
6
|
$layout-direction: $direction !global;
|
4
7
|
|
8
|
+
@if $display != default {
|
9
|
+
@include -neat-warn("The $display argument will be deprecated in future versions in favor of the display(){...} mixin.");
|
10
|
+
}
|
11
|
+
|
5
12
|
@if $display == table {
|
6
13
|
display: table;
|
7
14
|
@include fill-parent;
|
@@ -10,6 +17,7 @@
|
|
10
17
|
}
|
11
18
|
|
12
19
|
@else {
|
20
|
+
@include clearfix;
|
13
21
|
display: block;
|
14
22
|
$container-display-table: false !global;
|
15
23
|
}
|
@@ -21,7 +21,7 @@
|
|
21
21
|
}
|
22
22
|
|
23
23
|
@if $display == collapse {
|
24
|
-
@warn
|
24
|
+
@include -neat-warn("The 'collapse' argument will be deprecated. Use 'block-collapse' instead.");
|
25
25
|
}
|
26
26
|
|
27
27
|
@if $display == collapse or $display == block-collapse {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) {
|
2
|
-
@warn
|
2
|
+
@include -neat-warn("The breakpoint() mixin was renamed to media() in Neat 1.0. Please update your project with the new syntax before the next version bump.");
|
3
3
|
|
4
4
|
@if length($query) == 1 {
|
5
5
|
@media screen and ($default-feature: nth($query, 1)) {
|
@@ -47,11 +47,26 @@
|
|
47
47
|
}
|
48
48
|
|
49
49
|
@else {
|
50
|
-
@warn
|
50
|
+
@include -neat-warn("Wrong number of arguments for breakpoint(). Read the documentation for more details.");
|
51
51
|
}
|
52
52
|
}
|
53
53
|
|
54
54
|
@mixin nth-omega($nth, $display: block, $direction: default) {
|
55
|
-
@warn
|
55
|
+
@include -neat-warn("The nth-omega() mixin is deprecated. Please use omega() instead.");
|
56
56
|
@include omega($nth $display, $direction);
|
57
57
|
}
|
58
|
+
|
59
|
+
@mixin reset-display {
|
60
|
+
$container-display-table: false !global;
|
61
|
+
@include -neat-warn("Resetting $display will be deprecated in future versions in favor of the display(){...} mixin.");
|
62
|
+
}
|
63
|
+
|
64
|
+
@mixin reset-layout-direction {
|
65
|
+
$layout-direction: $default-layout-direction !global;
|
66
|
+
@include -neat-warn("Resetting $direction will be deprecated in future versions in favor of the direction(){...} mixin.");
|
67
|
+
}
|
68
|
+
|
69
|
+
@mixin reset-all {
|
70
|
+
@include reset-display;
|
71
|
+
@include reset-layout-direction;
|
72
|
+
}
|
@@ -1,10 +1,9 @@
|
|
1
1
|
@mixin grid-column-gradient($values...) {
|
2
|
-
background-image:
|
3
|
-
background-image:
|
4
|
-
background-image:
|
5
|
-
background-image:
|
6
|
-
background-image:
|
7
|
-
background-image: unquote("linear-gradient(left, #{$values})");
|
2
|
+
background-image: -webkit-linear-gradient(left, $values);
|
3
|
+
background-image: -moz-linear-gradient(left, $values);
|
4
|
+
background-image: -ms-linear-gradient(left, $values);
|
5
|
+
background-image: -o-linear-gradient(left, $values);
|
6
|
+
background-image: unquote("linear-gradient(to left, #{$values})");
|
8
7
|
}
|
9
8
|
|
10
9
|
@if $visual-grid == true or $visual-grid == yes {
|
@@ -0,0 +1,13 @@
|
|
1
|
+
/**
|
2
|
+
* Disable all deprecation warnings. Defaults to `false`. Set with a `!global` flag.
|
3
|
+
*
|
4
|
+
* @type Bool
|
5
|
+
*/
|
6
|
+
|
7
|
+
$disable-warnings: false !default;
|
8
|
+
|
9
|
+
@mixin -neat-warn($message) {
|
10
|
+
@if $disable-warnings == false {
|
11
|
+
@warn "#{$message}";
|
12
|
+
}
|
13
|
+
}
|
data/bower.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "neat",
|
3
|
-
"version": "1.
|
3
|
+
"version": "1.7.0.pre",
|
4
4
|
"homepage": "http://neat.bourbon.io/",
|
5
5
|
"main": "app/assets/stylesheets/_neat.scss",
|
6
6
|
"ignore": [
|
@@ -15,6 +15,6 @@
|
|
15
15
|
"NEWS.md"
|
16
16
|
],
|
17
17
|
"dependencies": {
|
18
|
-
"bourbon": ">=
|
18
|
+
"bourbon": ">=4.0"
|
19
19
|
}
|
20
20
|
}
|
data/lib/neat/version.rb
CHANGED
data/neat.gemspec
CHANGED
@@ -23,7 +23,7 @@ Neat is an open source grid framework built on top of Bourbon with the aim of be
|
|
23
23
|
s.require_paths = ['lib']
|
24
24
|
|
25
25
|
s.add_dependency('sass', '>= 3.3')
|
26
|
-
s.add_dependency('bourbon', '>=
|
26
|
+
s.add_dependency('bourbon', '>= 4.0')
|
27
27
|
|
28
28
|
s.add_development_dependency('aruba', '~> 0.5.0')
|
29
29
|
s.add_development_dependency('rake')
|
data/spec/neat/container_spec.rb
CHANGED
@@ -12,4 +12,10 @@ describe "@include outer-container()" do
|
|
12
12
|
it "sets max-width" do
|
13
13
|
expect('.container-default').to have_rule('max-width: 960px')
|
14
14
|
end
|
15
|
+
|
16
|
+
context "with max-width argument: 100%" do
|
17
|
+
it "sets max-width to 100%" do
|
18
|
+
expect('.container-custom-width').to have_rule('max-width: 100%')
|
19
|
+
end
|
20
|
+
end
|
15
21
|
end
|
@@ -0,0 +1,15 @@
|
|
1
|
+
require 'spec_helper'
|
2
|
+
|
3
|
+
describe "By default" do
|
4
|
+
before(:all) do
|
5
|
+
ParserSupport.parse_file("default")
|
6
|
+
end
|
7
|
+
|
8
|
+
it "sets sizing on the html element to 'border-box'" do
|
9
|
+
expect('html').to have_rule('box-sizing: border-box')
|
10
|
+
end
|
11
|
+
|
12
|
+
it "sets sizing on the global selector to 'inherit'" do
|
13
|
+
expect('*:after').to have_rule('box-sizing: inherit')
|
14
|
+
end
|
15
|
+
end
|
@@ -0,0 +1,19 @@
|
|
1
|
+
require 'spec_helper'
|
2
|
+
|
3
|
+
describe "@include direction() {...}" do
|
4
|
+
before(:all) do
|
5
|
+
ParserSupport.parse_file("direction")
|
6
|
+
end
|
7
|
+
|
8
|
+
context "with no argument" do
|
9
|
+
it "uses default direction setting" do
|
10
|
+
expect('.default-block').to have_rule('float: left')
|
11
|
+
end
|
12
|
+
end
|
13
|
+
|
14
|
+
context "whith argument (right-to-left)" do
|
15
|
+
it "changes direction setting inside the block" do
|
16
|
+
expect('.right-to-left-block').to have_rule('float: right')
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
@@ -0,0 +1,19 @@
|
|
1
|
+
require 'spec_helper'
|
2
|
+
|
3
|
+
describe "@include display() {...}" do
|
4
|
+
before(:all) do
|
5
|
+
ParserSupport.parse_file("display")
|
6
|
+
end
|
7
|
+
|
8
|
+
context "with argument (table)" do
|
9
|
+
it "changes display value to table" do
|
10
|
+
expect('.display-table-block').to have_rule('display: table-cell')
|
11
|
+
end
|
12
|
+
end
|
13
|
+
|
14
|
+
context "whith nested call and argument (block)" do
|
15
|
+
it "changes display value to block" do
|
16
|
+
expect('.display-nested-block').to have_rule('display: block')
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
data/spec/neat/media_spec.rb
CHANGED
data/test/_setup.scss
CHANGED
data/test/default.scss
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
@import 'setup';
|
data/test/direction.scss
ADDED
data/test/display.scss
ADDED
data/test/outer-container.scss
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: neat
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.
|
4
|
+
version: 1.7.0.pre
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Kyle Fiedler
|
@@ -10,7 +10,7 @@ authors:
|
|
10
10
|
autorequire:
|
11
11
|
bindir: bin
|
12
12
|
cert_chain: []
|
13
|
-
date: 2014-
|
13
|
+
date: 2014-08-01 00:00:00.000000000 Z
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: sass
|
@@ -32,14 +32,14 @@ dependencies:
|
|
32
32
|
requirements:
|
33
33
|
- - ">="
|
34
34
|
- !ruby/object:Gem::Version
|
35
|
-
version: '
|
35
|
+
version: '4.0'
|
36
36
|
type: :runtime
|
37
37
|
prerelease: false
|
38
38
|
version_requirements: !ruby/object:Gem::Requirement
|
39
39
|
requirements:
|
40
40
|
- - ">="
|
41
41
|
- !ruby/object:Gem::Version
|
42
|
-
version: '
|
42
|
+
version: '4.0'
|
43
43
|
- !ruby/object:Gem::Dependency
|
44
44
|
name: aruba
|
45
45
|
requirement: !ruby/object:Gem::Requirement
|
@@ -149,6 +149,7 @@ extra_rdoc_files: []
|
|
149
149
|
files:
|
150
150
|
- ".gitignore"
|
151
151
|
- ".rspec"
|
152
|
+
- ".travis.yml"
|
152
153
|
- CONTRIBUTING.md
|
153
154
|
- Gemfile
|
154
155
|
- LICENSE
|
@@ -159,19 +160,21 @@ files:
|
|
159
160
|
- app/assets/stylesheets/_neat.scss
|
160
161
|
- app/assets/stylesheets/functions/_new-breakpoint.scss
|
161
162
|
- app/assets/stylesheets/functions/_private.scss
|
163
|
+
- app/assets/stylesheets/grid/_box-sizing.scss
|
164
|
+
- app/assets/stylesheets/grid/_direction.scss
|
165
|
+
- app/assets/stylesheets/grid/_display.scss
|
162
166
|
- app/assets/stylesheets/grid/_fill-parent.scss
|
163
|
-
- app/assets/stylesheets/grid/_grid.scss
|
164
167
|
- app/assets/stylesheets/grid/_media.scss
|
165
168
|
- app/assets/stylesheets/grid/_omega.scss
|
166
169
|
- app/assets/stylesheets/grid/_outer-container.scss
|
167
170
|
- app/assets/stylesheets/grid/_pad.scss
|
168
171
|
- app/assets/stylesheets/grid/_private.scss
|
169
|
-
- app/assets/stylesheets/grid/_reset.scss
|
170
172
|
- app/assets/stylesheets/grid/_row.scss
|
171
173
|
- app/assets/stylesheets/grid/_shift.scss
|
172
174
|
- app/assets/stylesheets/grid/_span-columns.scss
|
173
175
|
- app/assets/stylesheets/grid/_to-deprecate.scss
|
174
176
|
- app/assets/stylesheets/grid/_visual-grid.scss
|
177
|
+
- app/assets/stylesheets/settings/_disable-warnings.scss
|
175
178
|
- app/assets/stylesheets/settings/_grid.scss
|
176
179
|
- app/assets/stylesheets/settings/_visual-grid.scss
|
177
180
|
- bin/neat
|
@@ -184,6 +187,9 @@ files:
|
|
184
187
|
- neat.gemspec
|
185
188
|
- spec/neat/columns_spec.rb
|
186
189
|
- spec/neat/container_spec.rb
|
190
|
+
- spec/neat/default_spec.rb
|
191
|
+
- spec/neat/direction_spec.rb
|
192
|
+
- spec/neat/display_spec.rb
|
187
193
|
- spec/neat/media_spec.rb
|
188
194
|
- spec/neat/new_breakpoint_spec.rb
|
189
195
|
- spec/neat/omega_spec.rb
|
@@ -198,6 +204,9 @@ files:
|
|
198
204
|
- spec/support/parser_support.rb
|
199
205
|
- spec/support/sass_support.rb
|
200
206
|
- test/_setup.scss
|
207
|
+
- test/default.scss
|
208
|
+
- test/direction.scss
|
209
|
+
- test/display.scss
|
201
210
|
- test/media.scss
|
202
211
|
- test/new-breakpoint.scss
|
203
212
|
- test/omega.scss
|
@@ -221,18 +230,21 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
221
230
|
version: '0'
|
222
231
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
223
232
|
requirements:
|
224
|
-
- - "
|
233
|
+
- - ">"
|
225
234
|
- !ruby/object:Gem::Version
|
226
|
-
version:
|
235
|
+
version: 1.3.1
|
227
236
|
requirements: []
|
228
237
|
rubyforge_project: neat
|
229
|
-
rubygems_version: 2.
|
238
|
+
rubygems_version: 2.2.2
|
230
239
|
signing_key:
|
231
240
|
specification_version: 4
|
232
241
|
summary: A fluid grid framework on top of Bourbon
|
233
242
|
test_files:
|
234
243
|
- spec/neat/columns_spec.rb
|
235
244
|
- spec/neat/container_spec.rb
|
245
|
+
- spec/neat/default_spec.rb
|
246
|
+
- spec/neat/direction_spec.rb
|
247
|
+
- spec/neat/display_spec.rb
|
236
248
|
- spec/neat/media_spec.rb
|
237
249
|
- spec/neat/new_breakpoint_spec.rb
|
238
250
|
- spec/neat/omega_spec.rb
|
@@ -247,6 +259,9 @@ test_files:
|
|
247
259
|
- spec/support/parser_support.rb
|
248
260
|
- spec/support/sass_support.rb
|
249
261
|
- test/_setup.scss
|
262
|
+
- test/default.scss
|
263
|
+
- test/direction.scss
|
264
|
+
- test/display.scss
|
250
265
|
- test/media.scss
|
251
266
|
- test/new-breakpoint.scss
|
252
267
|
- test/omega.scss
|