neat 1.7.0.pre → 1.7.0.rc

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. checksums.yaml +4 -4
  2. data/.gitignore +5 -13
  3. data/README.md +133 -106
  4. data/app/assets/stylesheets/_neat.scss +3 -3
  5. data/app/assets/stylesheets/functions/_new-breakpoint.scss +33 -3
  6. data/app/assets/stylesheets/functions/_private.scss +16 -22
  7. data/app/assets/stylesheets/grid/{_direction.scss → _direction-context.scss} +7 -8
  8. data/app/assets/stylesheets/grid/{_display.scss → _display-context.scss} +4 -5
  9. data/app/assets/stylesheets/grid/_fill-parent.scss +16 -0
  10. data/app/assets/stylesheets/grid/_media.scss +66 -11
  11. data/app/assets/stylesheets/grid/_omega.scss +34 -3
  12. data/app/assets/stylesheets/grid/_outer-container.scss +20 -21
  13. data/app/assets/stylesheets/grid/_pad.scss +16 -0
  14. data/app/assets/stylesheets/grid/_private.scss +2 -10
  15. data/app/assets/stylesheets/grid/_row.scss +29 -0
  16. data/app/assets/stylesheets/grid/_shift.scss +34 -0
  17. data/app/assets/stylesheets/grid/_span-columns.scss +49 -1
  18. data/app/assets/stylesheets/grid/_to-deprecate.scss +36 -0
  19. data/app/assets/stylesheets/grid/_visual-grid.scss +1 -1
  20. data/app/assets/stylesheets/settings/_disable-warnings.scss +0 -1
  21. data/app/assets/stylesheets/settings/_grid.scss +53 -5
  22. data/app/assets/stylesheets/settings/_visual-grid.scss +26 -2
  23. data/bower.json +3 -1
  24. data/lib/neat/version.rb +1 -1
  25. data/sache.json +5 -0
  26. data/spec/neat/direction_spec.rb +2 -2
  27. data/spec/neat/display_spec.rb +2 -2
  28. data/test/{direction.scss → direction-context.scss} +2 -2
  29. data/test/{display.scss → display-context.scss} +3 -3
  30. metadata +9 -8
@@ -56,16 +56,52 @@
56
56
  @include omega($nth $display, $direction);
57
57
  }
58
58
 
59
+ /**
60
+ * Resets the active display property to `block`. Particularly useful when changing the display property in a single row.
61
+ *
62
+ * @example scss - Usage
63
+ * .element {
64
+ * @include row(table);
65
+ * // Context changed to table display
66
+ * }
67
+ *
68
+ * @include reset-display;
69
+ * // Context is reset to block display
70
+ */
59
71
  @mixin reset-display {
60
72
  $container-display-table: false !global;
61
73
  @include -neat-warn("Resetting $display will be deprecated in future versions in favor of the display(){...} mixin.");
62
74
  }
63
75
 
76
+ /**
77
+ * Resets the active layout direction to the default value set in `$default-layout-direction`. Particularly useful when changing the layout direction in a single row.
78
+ *
79
+ * @example scss - Usage
80
+ * .element {
81
+ * @include row($direction: RTL);
82
+ * // Context changed to right-to-left
83
+ * }
84
+ *
85
+ * @include reset-layout-direction;
86
+ * // Context is reset to left-to-right
87
+ */
64
88
  @mixin reset-layout-direction {
65
89
  $layout-direction: $default-layout-direction !global;
66
90
  @include -neat-warn("Resetting $direction will be deprecated in future versions in favor of the direction(){...} mixin.");
67
91
  }
68
92
 
93
+ /**
94
+ * Resets both the active layout direction and the active display property.
95
+ *
96
+ * @example scss - Usage
97
+ * .element {
98
+ * @include row(table, RTL);
99
+ * // Context changed to table table and right-to-left
100
+ * }
101
+ *
102
+ * @include reset-all;
103
+ * // Context is reset to block display and left-to-right
104
+ */
69
105
  @mixin reset-all {
70
106
  @include reset-display;
71
107
  @include reset-layout-direction;
@@ -30,7 +30,7 @@
30
30
  }
31
31
 
32
32
  @each $breakpoint in $visual-grid-breakpoints {
33
- @if $breakpoint != nil {
33
+ @if $breakpoint {
34
34
  @include media($breakpoint) {
35
35
  @include grid-column-gradient(gradient-stops($grid-columns));
36
36
  }
@@ -3,7 +3,6 @@
3
3
  *
4
4
  * @type Bool
5
5
  */
6
-
7
6
  $disable-warnings: false !default;
8
7
 
9
8
  @mixin -neat-warn($message) {
@@ -1,7 +1,55 @@
1
- $column: golden-ratio(1em, 3) !default; // Column width
2
- $gutter: golden-ratio(1em, 1) !default; // Gutter between each two columns
3
- $grid-columns: 12 !default; // Total number of columns in the grid
4
- $max-width: em(1088) !default; // Max-width of the outer container
5
- $border-box-sizing: true !default; // Makes all elements have a border-box layout
1
+ /**
2
+ * Sets the relative width of a single grid column. The unit used should be the same one used to define `$gutter`. To learn more about golden-ratio() see [Bourbon docs](http://bourbon.io/docs/#golden-ratio). Set with a `!global` flag.
3
+ *
4
+ * @type Number (Unit)
5
+ */
6
+ $column: golden-ratio(1em, 3) !default;
7
+
8
+ /**
9
+ * Sets the relative width of a single grid gutter. The unit used should be the same one used to define `$column`. To learn more about golden-ratio() see [Bourbon docs](http://bourbon.io/docs/#golden-ratio). Set with the `!global` flag.
10
+ *
11
+ * @type Number (Unit)
12
+ */
13
+ $gutter: golden-ratio(1em, 1) !default;
14
+
15
+ /**
16
+ * Sets the total number of columns in the grid. Its value can be overridden inside a media query using the `media()` mixin. Set with the `!global` flag.
17
+ *
18
+ * @type Number (Unitless)
19
+ */
20
+ $grid-columns: 12 !default;
21
+
22
+ /**
23
+ * Sets the max-width property of the element that includes `outer-container()`. To learn more about `em()` see [Bourbon docs](http://bourbon.io/docs/#px-to-em). Set with the `!global` flag.
24
+ *
25
+ * @type Number (Unit)
26
+ */
27
+ $max-width: em(1088) !default;
28
+
29
+ /**
30
+ * When set to true, it sets the box-sizing property of all elements to `border-box`. Set with a `!global` flag.
31
+ *
32
+ * @type Bool
33
+ *
34
+ * @example css - CSS Output
35
+ * * {
36
+ * -webkit-box-sizing: border-box;
37
+ * -moz-box-sizing: border-box;
38
+ * box-sizing: border-box;
39
+ * }
40
+ */
41
+ $border-box-sizing: true !default;
42
+
43
+ /**
44
+ * Sets the default [media feature](http://www.w3.org/TR/css3-mediaqueries/#media) that `media()` and `new-breakpoint()` revert to when only a breakpoint value is passed. Set with a `!global` flag.
45
+ *
46
+ * @type String
47
+ */
6
48
  $default-feature: min-width; // Default @media feature for the breakpoint() mixin
49
+
50
+ /**
51
+ * Sets the default layout direction of the grid. Can be `LTR` or `RTL`. Set with a `!global` flag.
52
+ *
53
+ * @type String
54
+ */
7
55
  $default-layout-direction: LTR !default;
@@ -1,5 +1,29 @@
1
- $visual-grid: false !default; // Display the base grid
1
+ /**
2
+ * Displays the visual grid when set to true. The overlaid grid may be few pixels off depending on the browser's rendering engine and pixel rounding algorithm. Set with the `!global` flag.
3
+ *
4
+ * @type Bool
5
+ */
6
+ $visual-grid: false !default;
7
+
8
+ /**
9
+ * Sets the visual grid color. Set with `!global` flag.
10
+ *
11
+ * @type Color
12
+ */
2
13
  $visual-grid-color: #EEE !default;
3
- $visual-grid-index: back !default; // Show grid behind content (back) or overlay it over the content (front)
14
+
15
+ /**
16
+ * Sets the `z-index` property of the visual grid. Can be `back` (behind content) or `front` (in front of content). Set with `!global` flag.
17
+ *
18
+ * @type String
19
+ */
20
+ $visual-grid-index: back !default;
21
+
22
+ /**
23
+ * Sets the opacity property of the visual grid. Set with `!global` flag.
24
+ *
25
+ * @type Number (unitless)
26
+ */
4
27
  $visual-grid-opacity: 0.4 !default;
28
+
5
29
  $visual-grid-breakpoints: () !default;
data/bower.json CHANGED
@@ -12,7 +12,9 @@
12
12
  "Rakefile",
13
13
  "neat.gemspec",
14
14
  "CONTRIBUTING.md",
15
- "NEWS.md"
15
+ "NEWS.md",
16
+ "test",
17
+ "spec"
16
18
  ],
17
19
  "dependencies": {
18
20
  "bourbon": ">=4.0"
data/lib/neat/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Neat
2
- VERSION = '1.7.0.pre'
2
+ VERSION = '1.7.0.rc'
3
3
  end
data/sache.json ADDED
@@ -0,0 +1,5 @@
1
+ {
2
+ "name": "Neat",
3
+ "description": "A lightweight, semantic grid framework built on top of Bourbon",
4
+ "tags": ["neat", "grid", "layout", "columns", "semantic", "media-queries", "media", "queries", "bourbon"]
5
+ }
@@ -1,8 +1,8 @@
1
1
  require 'spec_helper'
2
2
 
3
- describe "@include direction() {...}" do
3
+ describe "@include direction-context() {...}" do
4
4
  before(:all) do
5
- ParserSupport.parse_file("direction")
5
+ ParserSupport.parse_file("direction-context")
6
6
  end
7
7
 
8
8
  context "with no argument" do
@@ -1,8 +1,8 @@
1
1
  require 'spec_helper'
2
2
 
3
- describe "@include display() {...}" do
3
+ describe "@include display-context() {...}" do
4
4
  before(:all) do
5
- ParserSupport.parse_file("display")
5
+ ParserSupport.parse_file("display-context")
6
6
  end
7
7
 
8
8
  context "with argument (table)" do
@@ -1,12 +1,12 @@
1
1
  @import 'setup';
2
2
 
3
- @include direction() {
3
+ @include direction-context() {
4
4
  .default-block {
5
5
  @include span-columns(6);
6
6
  }
7
7
  }
8
8
 
9
- @include direction(right-to-left) {
9
+ @include direction-context(right-to-left) {
10
10
  .right-to-left-block {
11
11
  @include span-columns(6);
12
12
  }
@@ -1,13 +1,13 @@
1
1
  @import 'setup';
2
2
 
3
- @include display(table) {
3
+ @include display-context(table) {
4
4
  .display-table-block {
5
5
  @include span-columns(6);
6
6
  }
7
7
  }
8
8
 
9
- @include display(table) {
10
- @include display(block) {
9
+ @include display-context(table) {
10
+ @include display-context(block) {
11
11
  .display-nested-block {
12
12
  @include span-columns(6);
13
13
  }
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.7.0.pre
4
+ version: 1.7.0.rc
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-08-01 00:00:00.000000000 Z
13
+ date: 2014-10-03 00:00:00.000000000 Z
14
14
  dependencies:
15
15
  - !ruby/object:Gem::Dependency
16
16
  name: sass
@@ -161,8 +161,8 @@ files:
161
161
  - app/assets/stylesheets/functions/_new-breakpoint.scss
162
162
  - app/assets/stylesheets/functions/_private.scss
163
163
  - app/assets/stylesheets/grid/_box-sizing.scss
164
- - app/assets/stylesheets/grid/_direction.scss
165
- - app/assets/stylesheets/grid/_display.scss
164
+ - app/assets/stylesheets/grid/_direction-context.scss
165
+ - app/assets/stylesheets/grid/_display-context.scss
166
166
  - app/assets/stylesheets/grid/_fill-parent.scss
167
167
  - app/assets/stylesheets/grid/_media.scss
168
168
  - app/assets/stylesheets/grid/_omega.scss
@@ -185,6 +185,7 @@ files:
185
185
  - lib/neat/version.rb
186
186
  - lib/tasks/install.rake
187
187
  - neat.gemspec
188
+ - sache.json
188
189
  - spec/neat/columns_spec.rb
189
190
  - spec/neat/container_spec.rb
190
191
  - spec/neat/default_spec.rb
@@ -205,8 +206,8 @@ files:
205
206
  - spec/support/sass_support.rb
206
207
  - test/_setup.scss
207
208
  - test/default.scss
208
- - test/direction.scss
209
- - test/display.scss
209
+ - test/direction-context.scss
210
+ - test/display-context.scss
210
211
  - test/media.scss
211
212
  - test/new-breakpoint.scss
212
213
  - test/omega.scss
@@ -260,8 +261,8 @@ test_files:
260
261
  - spec/support/sass_support.rb
261
262
  - test/_setup.scss
262
263
  - test/default.scss
263
- - test/direction.scss
264
- - test/display.scss
264
+ - test/direction-context.scss
265
+ - test/display-context.scss
265
266
  - test/media.scss
266
267
  - test/new-breakpoint.scss
267
268
  - test/omega.scss