neat 1.7.0 → 4.0.0

data/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "bourbon-neat",
+  "version": "4.0.0",
+  "description": "A lightweight, semantic grid framework",
+  "keywords": [
+    "columns",
+    "grid",
+    "layout",
+    "media",
+    "media-queries",
+    "neat",
+    "queries",
+    "sass",
+    "scss",
+    "semantic",
+    "eyeglass-module"
+  ],
+  "homepage": "http://neat.bourbon.io",
+  "bugs": {
+    "url": "https://github.com/thoughtbot/neat/issues"
+  },
+  "license": "MIT",
+  "author": {
+    "name": "thoughtbot",
+    "url": "http://thoughtbot.com"
+  },
+  "main": "index.js",
+  "style": "core/_neat.scss",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/thoughtbot/neat.git"
+  },
+  "scripts": {
+    "contrib": "gulp",
+    "test": "bundle exec rake"
+  },
+  "devDependencies": {
+    "browser-sync": "^2.24.6",
+    "gulp": "^4.0.0",
+    "gulp-sass": "^4.0.1"
+  },
+  "eyeglass": {
+    "name": "neat",
+    "needs": "*",
+    "exports": "eyeglass-exports.js"
+  }
+}

data/spec/fixtures/_setup.scss

@@ -0,0 +1 @@
+@import "core/neat";

data/spec/fixtures/functions/neat-column-default.scss

@@ -0,0 +1,22 @@
+@import "setup";
+
+$eighteen-grid: (
+  columns: 18,
+  gutter: 33px,
+);
+
+.neat-column-default-grid {
+  content: _neat-column-default($neat-grid, null);
+}
+
+.neat-column-default-grid-custom-col {
+  content: _neat-column-default($neat-grid, 10);
+}
+
+.neat-column-custom-grid {
+  content: _neat-column-default($eighteen-grid, null);
+}
+
+.neat-column-custom-grid-custom-col {
+  content: _neat-column-default($eighteen-grid, 10);
+}

data/spec/fixtures/functions/neat-column-width.scss

@@ -0,0 +1,30 @@
+@import "setup";
+
+$six-grid: (
+  columns: 6,
+  gutter: 10px
+);
+
+.neat-column-width-1-of-12 {
+  width: calc(#{_neat-column-width($neat-grid, 1)});
+}
+
+.neat-column-width-6-of-12 {
+  width: calc(#{_neat-column-width($neat-grid, 6)});
+}
+
+.neat-column-width-12-of-12 {
+  width: calc(#{_neat-column-width($neat-grid, 12)});
+}
+
+.neat-column-width-1-of-6 {
+  width: calc(#{_neat-column-width($six-grid, 1)});
+}
+
+.neat-column-width-2-of-6 {
+  width: calc(#{_neat-column-width($six-grid, 2)});
+}
+
+.neat-column-width-6-of-6 {
+  width: calc(#{_neat-column-width($six-grid, 6)});
+}

data/spec/fixtures/functions/neat-float-direction.scss

@@ -0,0 +1,17 @@
+@import "setup";
+
+$ltr-grid: (
+  direction: ltr,
+);
+
+$rtl-grid: (
+  direction: rtl,
+);
+
+.neat-float-direction-ltr {
+  content: _neat-float-direction($ltr-grid);
+}
+
+.neat-float-direction-rtl {
+  content: _neat-float-direction($rtl-grid);
+}

data/spec/fixtures/functions/neat-opposite-direction.scss

@@ -0,0 +1,17 @@
+@import "setup";
+
+$ltr-grid: (
+  direction: ltr,
+);
+
+$rtl-grid: (
+  direction: rtl,
+);
+
+.neat-opposite-direction-ltr {
+  content: _neat-opposite-direction($ltr-grid);
+}
+
+.neat-opposite-direction-rtl {
+  content: _neat-opposite-direction($rtl-grid);
+}

data/spec/fixtures/functions/neat-parse-media.scss

@@ -0,0 +1,9 @@
+@import "setup";
+
+.neat-parse-media-number {
+  content: _neat-parse-media(100px);
+}
+
+.neat-parse-media-string {
+  content: _neat-parse-media("only screen and (max-width: 25rem)");
+}

data/spec/fixtures/functions/retrieve-neat-settings.scss

@@ -0,0 +1,22 @@
+@import "setup";
+
+$eighteen-grid: (
+  columns: 18,
+  gutter: 33px
+);
+
+.neat-settings-default-columns {
+  content: _retrieve-neat-setting($neat-grid, columns);
+}
+
+.neat-settings-default-gutter {
+  content: _retrieve-neat-setting($neat-grid, gutter);
+}
+
+.neat-settings-eighteen-columns {
+  content: _retrieve-neat-setting($eighteen-grid, columns);
+}
+
+.neat-settings-eighteen-gutter {
+  content: _retrieve-neat-setting($eighteen-grid, gutter);
+}

data/spec/fixtures/mixins/grid-collapse.scss

@@ -0,0 +1,14 @@
+@import "setup";
+
+$custom-grid: (
+  columns: 6,
+  gutter: 4rem,
+);
+
+.grid-collapse-default {
+  @include grid-collapse;
+}
+
+.grid-collapse-custom {
+  @include grid-collapse($custom-grid);
+}

data/spec/fixtures/mixins/grid-column.scss

@@ -0,0 +1,57 @@
+@import "setup";
+
+$six-grid: (
+  columns: 6,
+  gutter: 1em,
+);
+
+$seventeen-grid: (
+  columns: 17,
+  gutter: 10px,
+);
+
+.grid-column-1-of-default {
+  @include grid-column(1);
+}
+
+.grid-column-6-of-default {
+  @include grid-column(6);
+}
+
+.grid-column-12-of-default {
+  @include grid-column(12);
+}
+
+.grid-column-3-of-5-shorthand {
+  @include grid-column(3 of 5);
+}
+
+.grid-column-1-of-6 {
+  @include grid-column(1, $six-grid);
+}
+
+.grid-column-4-of-6 {
+  @include grid-column(4, $six-grid);
+}
+
+.grid-column-6-of-6 {
+  @include grid-column(6, $six-grid);
+}
+
+.grid-column-3-of-5-shorthand-six-grid {
+  @include grid-column(3 of 5, $six-grid);
+}
+
+.grid-column-5-of-17 {
+  @include grid-column(1, $seventeen-grid);
+}
+
+.grid-column-11-of-17 {
+  @include grid-column(6, $seventeen-grid);
+}
+
+.grid-column-13-of-17 {
+  @include grid-column(12, $seventeen-grid);
+}
+
+

data/spec/fixtures/mixins/grid-container.scss

@@ -0,0 +1,5 @@
+@import "setup";
+
+.grid-container {
+  @include grid-container;
+}

data/spec/fixtures/mixins/grid-media.scss

@@ -0,0 +1,45 @@
+@import "setup";
+
+$medium-screen: 1000px;
+
+$custom-neat-grid: (
+  columns: 12,
+  gutter: 50px,
+  media: $medium-screen,
+);
+
+$specific-neat-grid: (
+  columns: 12,
+  gutter: 80px,
+  media: "only screen and (min-width: 1000px) and (max-width: 1100px)",
+);
+
+$print-neat-grid: (
+  columns: 10,
+  gutter: 20px,
+  media: print,
+);
+
+.grid-column-media-custom-neat-grid {
+  @include grid-media($custom-neat-grid) {
+    @include grid-column(3);
+  }
+}
+
+.grid-column-media-specific-neat-grid {
+  @include grid-media($specific-neat-grid) {
+    @include grid-column(6);
+  }
+}
+
+.grid-column-media-print-neat-grid {
+  @include grid-media($print-neat-grid) {
+    @include grid-column(8);
+  }
+}
+
+.grid-column-media-combined-grid {
+  @include grid-media($custom-neat-grid, $specific-neat-grid, $print-neat-grid) {
+    @include grid-column(3);
+  }
+}

data/spec/fixtures/mixins/grid-push.scss

@@ -0,0 +1,38 @@
+@import "setup";
+
+$six-grid: (
+  columns: 6,
+  gutter: 2rem,
+);
+
+.grid-push-default {
+  @include grid-push;
+}
+
+.grid-push-1-default {
+  @include grid-push(1);
+}
+
+.grid-push-6-default {
+  @include grid-push(6);
+}
+
+.grid-push-neg-6-default {
+  @include grid-push(-6);
+}
+
+.grid-push-0-six {
+  @include grid-push(false, $six-grid);
+}
+
+.grid-push-1-six {
+  @include grid-push(1, $six-grid);
+}
+
+.grid-push-3-six {
+  @include grid-push(3, $six-grid);
+}
+
+.grid-push-neg-3-six {
+  @include grid-push(-3, $six-grid);
+}

data/spec/fixtures/mixins/grid-shift.scss

@@ -0,0 +1,38 @@
+@import "setup";
+
+$six-grid: (
+  columns: 6,
+  gutter: 2rem,
+);
+
+.grid-shift-default {
+  @include grid-shift;
+}
+
+.grid-shift-1-default {
+  @include grid-shift(1);
+}
+
+.grid-shift-6-default {
+  @include grid-shift(6);
+}
+
+.grid-shift-neg-6-default {
+  @include grid-shift(-6);
+}
+
+.grid-shift-0-six {
+  @include grid-shift(false, $six-grid);
+}
+
+.grid-shift-1-six {
+  @include grid-shift(1, $six-grid);
+}
+
+.grid-shift-3-six {
+  @include grid-shift(3, $six-grid);
+}
+
+.grid-shift-neg-3-six {
+  @include grid-shift(-3, $six-grid);
+}

data/spec/neat/functions/neat_column_default_spec.rb

@@ -0,0 +1,35 @@
+require "spec_helper"
+
+describe "neat-column-default" do
+  before(:all) do
+    ParserSupport.parse_file("functions/neat-column-default")
+  end
+
+  context "called with default grid" do
+    it "gets default columns" do
+      rule = "content: 12"
+
+      expect(".neat-column-default-grid").to have_rule(rule)
+    end
+
+    it "gets custom columns" do
+      rule = "content: 10"
+
+      expect(".neat-column-default-grid-custom-col").to have_rule(rule)
+    end
+  end
+
+  context "called with custom grid" do
+    it "gets default columns" do
+      rule = "content: 18"
+
+      expect(".neat-column-custom-grid").to have_rule(rule)
+    end
+
+    it "gets custom columns" do
+      rule = "content: 10"
+
+      expect(".neat-column-custom-grid-custom-col").to have_rule(rule)
+    end
+  end
+end

data/spec/neat/functions/neat_column_width_spec.rb

@@ -0,0 +1,47 @@
+require "spec_helper"
+
+describe "neat-column-width" do
+  before(:all) do
+    ParserSupport.parse_file("functions/neat-column-width")
+  end
+
+  context "called with a default twelve column grid" do
+    it "applies one column" do
+      rule = "width: calc(8.33333% - 21.66667px)"
+
+      expect(".neat-column-width-1-of-12").to have_rule(rule)
+    end
+
+    it "applies six columns" do
+      rule = "width: calc(50% - 30px)"
+
+      expect(".neat-column-width-6-of-12").to have_rule(rule)
+    end
+
+    it "applies twelve columns" do
+      rule = "width: calc(100% - 40px)"
+
+      expect(".neat-column-width-12-of-12").to have_rule(rule)
+    end
+  end
+
+  context "called with a custom 6 column grid" do
+    it "applies one column" do
+      rule = "width: calc(16.66667% - 11.66667px)"
+
+      expect(".neat-column-width-1-of-6").to have_rule(rule)
+    end
+
+    it "applies six columns" do
+      rule = "width: calc(33.33333% - 13.33333px)"
+
+      expect(".neat-column-width-2-of-6").to have_rule(rule)
+    end
+
+    it "applies twelve columns" do
+      rule = "width: calc(100% - 20px)"
+
+      expect(".neat-column-width-6-of-6").to have_rule(rule)
+    end
+  end
+end

data/spec/neat/functions/neat_float_direction_spec.rb

@@ -0,0 +1,23 @@
+require "spec_helper"
+
+describe "neat-float-direction" do
+  before(:all) do
+    ParserSupport.parse_file("functions/neat-float-direction")
+  end
+
+  context "called with ltr" do
+    it "returns left" do
+      rule = "content: left"
+
+      expect(".neat-float-direction-ltr").to have_rule(rule)
+    end
+  end
+
+  context "called with rtl" do
+    it "returns right" do
+      rule = "content: right"
+
+      expect(".neat-float-direction-rtl").to have_rule(rule)
+    end
+  end
+end

data/spec/neat/functions/neat_opposite_direction_spec.rb

@@ -0,0 +1,23 @@
+require "spec_helper"
+
+describe "neat-opposite-direction" do
+  before(:all) do
+    ParserSupport.parse_file("functions/neat-opposite-direction")
+  end
+
+  context "called with ltr" do
+    it "returns right" do
+      rule = "content: right"
+
+      expect(".neat-opposite-direction-ltr").to have_rule(rule)
+    end
+  end
+
+  context "called with rtl" do
+    it "returns left" do
+      rule = "content: left"
+
+      expect(".neat-opposite-direction-rtl").to have_rule(rule)
+    end
+  end
+end

data/spec/neat/functions/neat_parse_media_spec.rb

@@ -0,0 +1,23 @@
+require "spec_helper"
+
+describe "neat-parse-media" do
+  before(:all) do
+    ParserSupport.parse_file("functions/neat-parse-media")
+  end
+
+  context "called with number" do
+    it "gets min-width wraped number" do
+      rule = 'content: "only screen and (min-width: 100px)"'
+
+      expect(".neat-parse-media-number").to have_rule(rule)
+    end
+  end
+
+  context "called with string" do
+    it "gets the string" do
+      rule = 'content: "only screen and (max-width: 25rem)"'
+
+      expect(".neat-parse-media-string").to have_rule(rule)
+    end
+  end
+end

data/spec/neat/functions/retrieve_neat_settings_spec.rb

@@ -0,0 +1,35 @@
+require "spec_helper"
+
+describe "retrieve-neat-settings" do
+  before(:all) do
+    ParserSupport.parse_file("functions/retrieve-neat-settings")
+  end
+
+  context "called with default settings" do
+    it "gets default columns" do
+      rule = "content: 12"
+
+      expect(".neat-settings-default-columns").to have_rule(rule)
+    end
+
+    it "gets default gutter" do
+      rule = "content: 20px"
+
+      expect(".neat-settings-default-gutter").to have_rule(rule)
+    end
+  end
+
+  context "called with custom settings" do
+    it "gets default columns" do
+      rule = "content: 18"
+
+      expect(".neat-settings-eighteen-columns").to have_rule(rule)
+    end
+
+    it "gets default gutter" do
+      rule = "content: 33px"
+
+      expect(".neat-settings-eighteen-gutter").to have_rule(rule)
+    end
+  end
+end

data/spec/neat/mixins/grid_collapse_spec.rb

@@ -0,0 +1,26 @@
+require "spec_helper"
+
+describe "grid-collapse" do
+  before(:all) do
+    ParserSupport.parse_file("mixins/grid-collapse")
+  end
+
+  context "called with default settings" do
+    it "adds margin for just the gutter with no specified column" do
+      ruleset = "margin-left: -20px; " +
+        "margin-right: -20px; " +
+        "width: calc(100% + 40px);"
+      expect(".grid-collapse-default").to have_ruleset(ruleset)
+    end
+  end
+
+  context "called with custom settings" do
+    it "adds margin for just the gutter with no specified column" do
+      ruleset = "margin-left: -4rem; " +
+        "margin-right: -4rem; " +
+        "width: calc(100% + 8rem);"
+
+      expect(".grid-collapse-custom").to have_ruleset(ruleset)
+    end
+  end
+end