neat-omega 3.0.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: be6ff121c061dfa8a558e8586a88b5b089f193f5
+  data.tar.gz: a6648614821c99e143ca5d3977a4ea323383f14a
+SHA512:
+  metadata.gz: 07b1a39b1e1a87ad22322f0da431e2b2192a4cbe4ba50ca07604238b0624de50f335fe4de066988d108b62bef641ddaeff9ac31e248b472d454c51a5885897a9
+  data.tar.gz: 6a6c2f05168645cb4434d5f8f541cacaf799515e49741d3126bb93d5d85469c1bbdd9e894c7ec62a5633046d483ae17a9a89ae4930a67f317da28b9f037f8c33

data/.gitignore

@@ -0,0 +1,32 @@
+# Numerous always-ignore extensions
+*.diff
+*.err
+*.orig
+*.log
+*.rej
+*.swo
+*.swp
+*.vi
+*~
+
+# OS or Editor folders
+.DS_Store
+.cache
+.idea
+.sass-cache
+.project
+.settings
+.tmproj
+nbproject
+Thumbs.db
+config.rb
+*.scssc
+*.sassc
+*.map
+
+# Folders to ignore
+.hg
+.svn
+.CVS
+cgi-bin
+node_modules

data/README.md

@@ -0,0 +1,183 @@
+# Neat-Omega Family for Bourbon Neat (2.x.x)
+The Omega family is a group of mixins that accomplish several supplemental goals within the Bourbon-Neat framework.
+
+Originally created to address: https://github.com/thoughtbot/neat/issues/543
+
+# Install
+## with NPM
+
+- `npm install --save neat-omega`
+- add `@import neat-omega` after your `@import neat` statement in your scss.
+- add `node-modules/neat-omega/core` to your sass import paths.
+
+## with Bower
+- `bower install neat-omega`
+- add `@import neat-omega` after your `@import neat` statement in your scss.
+- add `bower_components/neat-omega/core` to your sass import paths.
+
+# Documentation
+
+## alpha
+`@include alpha($selector: self, $grid: $neat-grid)`
+- Clears the float on the specified selector. Generally this is the first item in a new row.
+
+<strong>example SCSS</strong>
+```SCSS
+.element:nth-child(3n+1) {
+  @include alpha;
+}
+```
+<strong>example CSS</strong>
+```CSS
+.element:nth-child(3n+1) {
+  clear: left;
+}
+```
+---
+<strong>example SCSS</strong>
+```SCSS
+.last-element {
+  @include alpha('&:last-child');
+}
+```
+<strong>example CSS</strong>
+```CSS
+.last-element:last-child {
+  clear: left;
+}
+```
+---
+<strong>example SCSS</strong>
+```SCSS
+@include alpha('.custom:nth-child(3n+2)');
+```
+<strong>example CSS</strong>
+```CSS
+.custom:nth-child(3n+2) {
+  clear: left;
+}
+```
+
+## nth-alpha
+`@include nth-alpha($selector, $grid: $neat-grid)`
+- Clears the float on the specified `nth-of-type` selector. This is mostly for convenience, since you can achieve the same result with `alpha`
+
+<strong>example SCSS</strong>
+```SCSS
+.nth-element {
+  @include nth-alpha(4n+1);
+}
+```
+<strong>example CSS</strong>
+```CSS
+.nth-element:nth-of-type(4n+1) {
+  clear: left;
+}
+```
+
+## omega
+`@include omega($selector: self, $grid: $neat-grid)`
+- Adds a margin-right to the specified selector. Generally this is only needed for centered flex layouts.
+
+<strong>example SCSS</strong>
+```SCSS
+@include omega('.element:nth-of-type(3n+2)');
+```
+
+<strong>example CSS</strong>
+```CSS
+.element:nth-of-type(3n+2) {
+  margin-right: 20px;
+}
+```
+---
+<strong>example SCSS</strong>
+```SCSS
+element {
+  @include omega('&:nth-of-type(3n+1)');
+}
+```
+<strong>example CSS</strong>
+```CSS
+.element:nth-of-type(3n+1) {
+  margin-right: 20px;
+}
+```
+---
+<strong>example SCSS</strong>
+```SCSS
+.element {
+  @include flex-omega;
+}
+```
+<strong>example CSS</strong>
+```CSS
+.element {
+  margin-right: 20px;
+}
+```
+
+## omega-flex
+`@include omega-flex($selector: null, $grid: $neat-grid)`
+- Adds a margin right to the specified object, or if auto, to the last child of the grid.
+<strong>example SCSS</strong>
+```SCSS
+@include flex-omega('.element:nth-of-type(3n+2)');
+```
+<strong>example CSS</strong>
+```CSS
+@example css - CSS Output
+.element:nth-of-type(3n+2) {
+  margin-right: 20px;
+}
+```
+---
+<strong>example SCSS</strong>
+```SCSS
+.element {
+  @include flex-omega('&:nth-of-type(3n+1)');
+}
+```
+<strong>example CSS</strong>
+```CSS
+@example css - CSS Output
+.element:nth-of-type(3n+1) {
+  margin-right: 20px;
+}
+```
+---
+<strong>example SCSS</strong>
+```SCSS
+.element {
+  @include flex-omega(auto);
+}
+```
+<strong>example CSS</strong>
+```CSS
+@example css - CSS Output
+.element:last-child {
+  margin-right: 20px;
+}
+```
+## nth-omega
+`@include nth-omega($selector, $grid: $neat-grid)`
+- Adds a margin right to the specified `nth-of-type` object, and clears the `nth+1` object. Note that composite arguments such as `2n+1` are not supported by this mixin.
+
+<strong>example SCSS</strong>
+```SCSS
+.nth-element {
+  @include nth-omega(4n);
+}
+```
+<strong>example CSS</strong>
+```CSS
+.nth-element:nth-child(4n) {
+  margin-right: 20px;
+}
+.nth-element:nth-child(4n+1) {
+  clear: left;
+}
+.nth-element:last-child {
+  margin-right: 20px;
+}
+```

data/bower.json

@@ -0,0 +1,33 @@
+{
+  "name": "neat-omega",
+  "description": "A family of omega mixins for Neat 2.0",
+  "version": "3.0.0",
+  "main": "neat-omega.scss",
+  "authors": [
+    "Kevin Garcia"
+  ],
+  "license": "MIT",
+  "keywords": [
+    "columns",
+    "grid",
+    "layout",
+    "media",
+    "media-queries",
+    "neat",
+    "omega",
+    "sass",
+    "scss",
+    "semantic"
+  ],
+  "homepage": "https://github.com/kgcreative/neat-omega",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "dependencies": {
+    "neat": "^2"
+  }
+}

data/core/_alpha.scss

@@ -0,0 +1,51 @@
+@charset "UTF-8";
+/// Clears the float on the specified element. Note that in Neat 2.x, 
+/// this is likely the only mixin you need to properly clear floated layouts.
+///
+/// @group Features
+///
+/// @name alpha
+///
+/// @argument {self | string} [self] $element
+///   The alpha mixin automatically adds a clear to the specified `$element`. 
+///
+/// @argument {map} $grid [$neat-grid]
+///   The grid to be used to generate the margins.
+///   By default, the global `$neat-grid` will be used.
+///
+/// @example scss
+///
+///   .element:nth-child(3n+1) {
+///     @include alpha;
+///   }
+///
+///   .last-element {
+///     @include alpha('&:last-child');
+///   }
+///
+///   @include alpha('.custom:nth-child(3n+2)');
+///
+/// @example css - CSS Output
+///
+///   .element:nth-child(3n+1) {
+///     clear: left;
+///   }
+///
+///  .last-element:last-child {
+///     clear: left;
+///   }
+///
+///  .custom:nth-child(3n+2) {
+///     clear: left;
+///   }
+///
+
+@mixin alpha($selector: self, $grid: $neat-grid) {
+  @if $selector == self {
+    clear: _neat-float-direction($grid);
+  } @else {
+    #{$selector} {
+      clear: _neat-float-direction($grid);
+    }
+  }
+}

data/core/_neat-omega.scss

@@ -0,0 +1,7 @@
+@charset "UTF-8";
+
+@import '_alpha';
+@import '_nth-alpha';
+@import '_omega';
+@import '_nth-omega';
+@import '_omega-flex';

data/core/_nth-alpha.scss

@@ -0,0 +1,36 @@
+@charset "UTF-8";
+/// Creates a margin right on the nth object in the row and the last 
+/// object in the container which causes a centered flexbox to self correct.
+///
+/// It also brings back the neat 1.8 behavior of clearing the *n + 1 block element,
+/// which addresses a secondary edge case where short elements don't
+/// clear the full row in floated 'box' layouts.
+///
+/// @group Features
+///
+/// @name nth-alpha
+///
+/// @argument {number (`nth-child`}
+///   When passed an `nth-child` argument with `block` display, 
+///   the alpha mixin automatically clears that element. It can accept complex selectors.
+///
+/// @argument {map} $grid [$neat-grid]
+///   The grid to be used to generate the margins.
+///   By default, the global `$neat-grid` will be used.
+///
+///   .nth-element {
+///     @include nth-alpha(4n+1);
+///   }
+///
+/// @example css - CSS Output
+///
+///   .nth-element:nth-of-type(4n+1) {
+///     clear: left;
+///   }
+///
+
+@mixin nth-alpha($selector, $grid: $neat-grid) {
+  &:nth-of-type(#{$selector}) {
+    clear: _neat-float-direction($grid);
+  }
+}

data/core/_nth-omega.scss

@@ -0,0 +1,53 @@
+@charset "UTF-8";
+/// Creates a margin right on the nth object in the row and the last 
+/// object in the container which causes a centered flexbox to self correct.
+///
+/// It also brings back the neat 1.8 behavior of clearing the *n + 1 block element,
+/// which addresses a secondary edge case where short elements don't
+/// clear the full row in floated 'box' layouts.
+///
+/// @group Features
+///
+/// @name nth-omega
+///
+/// @argument {number (`nth-child`}
+///   When passed an `nth-child` argument of type `*n` with `block` display, 
+///   the omega mixin automatically adds a clear to the `*n+1` th element. 
+///   Note that composite arguments such as `2n+1` do not support this feature.
+///
+/// @argument {map} $grid [$neat-grid]
+///   The grid to be used to generate the margins.
+///   By default, the global `$neat-grid` will be used.
+///
+///   .nth-element {
+///     @include nth-omega(4n);
+///   }
+///
+/// @example css - CSS Output
+///
+///   .nth-element:nth-child(4n) {
+///     margin-right: 20px;
+///   }
+///
+///   .nth-element:nth-child(4n+1) {
+///     clear: left;
+///   }
+///
+///  .nth-element:last-child {
+///     margin-right: 20px;
+///   }
+///
+
+@mixin nth-omega($selector, $grid: $neat-grid) {
+  $_grid-gutter: _retrieve-neat-setting($grid, gutter);
+  
+  &:nth-of-type(#{$selector}) {
+    margin-#{_neat-opposite-direction($grid)}: $_grid-gutter;
+  }
+  &:nth-of-type(#{$selector}+1) {
+    clear: _neat-float-direction($grid);
+  }
+  &:last-child {
+    margin-#{_neat-opposite-direction($grid)}: $_grid-gutter;
+  }
+}

data/core/_omega-flex.scss

@@ -0,0 +1,60 @@
+@charset "UTF-8";
+/// Creates an opposite direction margin on the current object of a grid.
+/// This is primarily used to self-correct alignment in a centered flex grid.
+///
+/// @group Features
+///
+/// @name Omega flex
+///
+/// @argument { null | 'string' | auto} [auto] $selector 
+///   If null, the omega-flex mixin creates a margin-right on the current object.
+///   If passed a string, the omega-flex misin creates a margin-right on the specified selector.
+///   If auto, the omega-flex mixin creates a margin-right on the last object in the container.
+///
+/// @argument {map} $grid [$neat-grid]
+///   The grid to be used to generate the margins.
+///   By default, the global `$neat-grid` will be used.
+///
+/// @example scss - Usage
+///   @include flex-omega('.element:nth-of-type(3n+2)');
+///
+/// @example css - CSS Output
+///   .element:nth-of-type(3n+2) {
+///     margin-right: 20px;
+///   }
+///
+/// @example scss - Usage
+///  .element {
+///     @include flex-omega('&:nth-of-type(3n+1)');
+///  }
+///
+/// @example css - CSS Output
+///   .element:nth-of-type(3n+1) {
+///     margin-right: 20px;
+///   }
+///
+/// @example scss - Usage
+///   .element {
+///     @include flex-omega(auto);
+///   }
+///
+/// @example css - CSS Output
+///   .element:last-child {
+///     margin-right: 20px;
+///   }
+
+@mixin omega-flex($selector: null, $grid: $neat-grid) {
+  $_grid-gutter: _retrieve-neat-setting($grid, gutter);
+
+  @if ($selector == null) or ($selector == self)  {
+    margin-#{_neat-opposite-direction($grid)}: $_grid-gutter;
+  } @else if ($selector == auto) or ($selector == last) {
+    &:last-child {
+      margin-#{_neat-opposite-direction($grid)}: $_grid-gutter;
+    }
+  } @else {
+    #{$selector} {
+      margin-#{_neat-opposite-direction($grid)}: $_grid-gutter;
+    }
+  }
+}

data/core/_omega.scss

@@ -0,0 +1,54 @@
+@charset "UTF-8";
+/// Creates an opposite direction margin on the specified selector.
+/// This is primarily used to self-correct the alignment of a centered flex-grid.
+///
+/// @group Features
+///
+/// @name Omega
+///
+/// @argument { string } $selector 
+///   The omega-flex mixin creates a margin-right on the specified selector.
+///
+/// @argument {map} $grid [$neat-grid]
+///   The grid to be used to generate the margins.
+///   By default, the global `$neat-grid` will be used.
+///
+/// @example scss - Usage
+///   @include omega('.element:nth-of-type(3n+2)');
+///
+/// @example css - CSS Output
+///   .element:nth-of-type(3n+2) {
+///     margin-right: 20px;
+///   }
+///
+/// @example scss - Usage
+///  .element {
+///     @include omega('&:nth-of-type(3n+1)');
+///  }
+///
+/// @example css - CSS Output
+///   .element:nth-of-type(3n+1) {
+///     margin-right: 20px;
+///   }
+///
+/// @example scss - Usage
+///   .element {
+///     @include flex-omega;
+///   }
+///
+/// @example css - CSS Output
+///   .element {
+///     margin-right: 20px;
+///   }
+
+@mixin omega($selector: self, $grid: $neat-grid) {
+  $_grid-gutter: _retrieve-neat-setting($grid, gutter);
+
+  @if ($selector == self) or ($selector == null)  {
+    margin-#{_neat-opposite-direction($grid)}: $_grid-gutter;
+  } @else {
+    #{$selector} {
+      margin-#{_neat-opposite-direction($grid)}: $_grid-gutter;
+    }
+  }
+}

data/lib/neat-omega.rb

@@ -0,0 +1,6 @@
+
+neat_omega_path = File.expand_path("../../core", __FILE__)
+ENV["SASS_PATH"] = [
+  ENV["SASS_PATH"],
+  neat_omega_path,
+].compact.join(File::PATH_SEPARATOR)

data/license.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright © 2017 [Kevin Garcia](github.com/kgcreative)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the “Software”), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

data/neat-omega.gemspec

@@ -0,0 +1,16 @@
+Gem::Specification.new do |s|
+  s.add_runtime_dependency "sass", "~> 3.4"
+  s.authors = [
+    "Kevin Garcia"
+  ]
+  s.email         = "kevin@kgcreative.com"
+  s.executables   = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
+  s.files         = `git ls-files`.split("\n")
+  s.homepage      = "https://github.com/kgcreative/neat-omega"
+  s.license       = "MIT"
+  s.name          = "neat-omega"
+  s.platform      = Gem::Platform::RUBY
+  s.require_paths = ["lib"]
+  s.summary       = "An omega mixin family for Neat 2.x"
+  s.version       = "3.0.0"
+end

data/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "neat-omega",
+  "version": "3.0.0",
+  "description": "A family of omega mixins for Neat 2.0",
+  "keywords": [
+    "columns",
+    "grid",
+    "layout",
+    "media",
+    "media-queries",
+    "neat",
+    "omega",
+    "sass",
+    "scss",
+    "semantic"
+  ],
+  "homepage": "https://github.com/kgcreative/neat-omega",
+  "bugs": {
+    "url": "git+https://github.com/kgcreative/neat-omega/issues"
+  },
+  "license": "MIT",
+  "author": {
+    "name": "Kevin Garcia",
+    "url": "https://github.com/kgcreative/"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/kgcreative/neat-omega.git"
+  },
+  "dependencies": {
+    "bourbon-neat": "^2"
+  }
+}

metadata

@@ -0,0 +1,70 @@
+--- !ruby/object:Gem::Specification
+name: neat-omega
+version: !ruby/object:Gem::Version
+  version: 3.0.0
+platform: ruby
+authors:
+- Kevin Garcia
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2017-04-30 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: sass
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3.4'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3.4'
+description: 
+email: kevin@kgcreative.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".gitignore"
+- README.md
+- bower.json
+- core/_alpha.scss
+- core/_neat-omega.scss
+- core/_nth-alpha.scss
+- core/_nth-omega.scss
+- core/_omega-flex.scss
+- core/_omega.scss
+- lib/neat-omega.rb
+- license.md
+- neat-omega.gemspec
+- package.json
+homepage: https://github.com/kgcreative/neat-omega
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.6.11
+signing_key: 
+specification_version: 4
+summary: An omega mixin family for Neat 2.x
+test_files: []