longitude 0.1.1 → 0.1.2

data/README.md

@@ -150,6 +150,17 @@ pixel perfectness when the largest breakpoint is used.
 Return true or false depending on if the current breakpoint is the extra
 breakpoint mentioned above.
 
+### steps(...)
+
+Steps through a list of values for each breakpoint. If there are fewer
+steps then breakpoints, the last step will be used for padding. Example that will change color for every step and all larger breakpoints will be green: 
+
+```scss
+section {
+  color: steps(red blue green);
+}
+```
+
 Compatibility mode (dealing with Internet Explorer)
 ---------------------------------------------------
 

data/lib/longitude/version.rb

@@ -1,3 +1,3 @@
 module Longitude
-  VERSION = "0.1.1"
+  VERSION = "0.1.2"
 end

data/spec/integration/steps_spec.rb

@@ -0,0 +1,33 @@
+require 'spec_helper'
+
+describe 'Steps' do
+  describe 'with all columns' do
+    before :each do
+      @css = render """
+      @include longitude(2 4) {
+        p { width: steps(10px 20px 30px); }
+      }
+      """
+    end
+
+    it 'sets width according to the given steps' do
+      @css.should include("width: 10px;")
+      @css.should include("width: 20px;")
+      @css.should include("width: 30px;")
+    end
+  end
+
+  describe 'with to few columns' do
+    before :each do
+      @css = render """
+      @include longitude(2 4 6) {
+        p { width: steps(10px 20px); }
+      }
+      """
+    end
+
+    it 'sets the last value as the default if it is missing' do
+      @css.should match(/@media \(min-width: 481px\).* width: 20px;/m)
+    end
+  end
+end

data/stylesheets/longitude.scss

@@ -3,6 +3,7 @@ $longitude-column-width: 60px !default;
 $longitude-compatibility-mode: false !default;
 
 $longitude-column-count: 0;
+$longitude-column-index: 0;
 $longitude-base-width: 100%;
 
 @function absolute-width($columns) {
@@ -50,10 +51,15 @@ $longitude-base-width: 100%;
   @return $longitude-base-width == 100%;
 }
 
+@function steps($list){
+  @return nth($list, min($longitude-column-index, length($list)));
+}
+
 @mixin longitude($breakpoints) {
   $prev-column-count: 0;
   $max-width: 0;
   @each $column-count in $breakpoints {
+    $longitude-column-index: $longitude-column-index + 1;
     $longitude-column-count: $column-count;
     @if $longitude-compatibility-mode == false {
       $min-width: absolute-width($prev-column-count);
@@ -70,6 +76,7 @@ $longitude-base-width: 100%;
   }
   // Last step, use pixels
   $longitude-base-width: absolute-width(column-count());
+  $longitude-column-index: $longitude-column-index + 1;
   @if $longitude-compatibility-mode  {
     @content;
   } @else {

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: longitude
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.1.2
   prerelease: 
 platform: ruby
 authors:
@@ -9,11 +9,11 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2012-03-19 00:00:00.000000000 Z
+date: 2012-04-20 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rake
-  requirement: &70248153881960 !ruby/object:Gem::Requirement
+  requirement: &70286896851340 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ! '>='
@@ -21,10 +21,10 @@ dependencies:
         version: '0'
   type: :development
   prerelease: false
-  version_requirements: *70248153881960
+  version_requirements: *70286896851340
 - !ruby/object:Gem::Dependency
   name: rspec
-  requirement: &70248153880880 !ruby/object:Gem::Requirement
+  requirement: &70286896850900 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ! '>='
@@ -32,10 +32,10 @@ dependencies:
         version: '0'
   type: :development
   prerelease: false
-  version_requirements: *70248153880880
+  version_requirements: *70286896850900
 - !ruby/object:Gem::Dependency
   name: sass
-  requirement: &70248153879680 !ruby/object:Gem::Requirement
+  requirement: &70286896849980 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - =
@@ -43,7 +43,7 @@ dependencies:
         version: 3.2.0.alpha.94
   type: :runtime
   prerelease: false
-  version_requirements: *70248153879680
+  version_requirements: *70286896849980
 description: ! 'Lets you easily using SCSS create responsive, mobile first layouts
   with minimal footprint in an unobtrusive way!
 
@@ -71,6 +71,7 @@ files:
 - spec/integration/full_width_spec.rb
 - spec/integration/gutters_spec.rb
 - spec/integration/media_queries_spec.rb
+- spec/integration/steps_spec.rb
 - spec/spec_helper.rb
 - stylesheets/longitude.scss
 homepage: http://github.com/jede/longitude
@@ -104,4 +105,5 @@ test_files:
 - spec/integration/full_width_spec.rb
 - spec/integration/gutters_spec.rb
 - spec/integration/media_queries_spec.rb
+- spec/integration/steps_spec.rb
 - spec/spec_helper.rb