ezy 0.1.0 → 0.1.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: c356c1caf87fa968c18eba1c4debaa02fb79fbf6
+  data.tar.gz: 959c46bdca6bb477dbd11d1a1b5e305ef4bfb1a8
+SHA512:
+  metadata.gz: 707af3feea4008b898da3f1eb310f0d0bccaa55f0274d11c24ace8111bd3afca55fa8abe5e782a4e1ccd69f3b09d98b38f14e2551ebae86237082156502ca24c
+  data.tar.gz: ca508a57002f5b0aa204ebb5f5d4a4074086cfcd724fea664b77741ab89207114ecce8f8f8f5a7eee939bc5941fc941e5cd1ebac3f0037bf3a09a1d41841f57e

data/README.md

@@ -3,6 +3,9 @@ Ezy: The developer's toolbox for responsive websites
 
 My attempt to create a collection of simple-to-use grid helpers and other tools with SCSS and Ruby
 
+> NOTE: Ezy is now in beta, with only sprites out-of-the-box.
+> Stand by for release of the grid.
+
 Installing Ezy
 --------------
 
@@ -16,11 +19,7 @@ Installing Ezy
 
 #### 3) Import the part you need in your SCSS
 
-Import all features:
-
-`@import "ezy";`
-
-Import sprites only:
+Import sprites: (only option ATM)
 
 `@import "ezy/sprites";`
 

data/ezy.gemspec

@@ -2,7 +2,7 @@
 
 Gem::Specification.new do |s|
   # Release Specific Information
-  s.version = "0.1.0"
+  s.version = "0.1.1"
   s.date = "2013-11-13"
 
   # Gem Details
@@ -19,7 +19,9 @@ Gem::Specification.new do |s|
   s.files += %w(ezy.gemspec)
   s.files += %w(VERSION)
   s.files += Dir.glob("lib/**/*.*")
-  s.files += Dir.glob("sass/**/*.*")
+  # s.files += Dir.glob("sass/**/*.*")
+  s.files += Dir.glob("sass/_ezy.scss")
+  s.files += Dir.glob("sass/ezy/_sprites.scss")
   s.files += Dir.glob("templates/**/*.*")
   s.files += Dir.glob("test/config.rb")
   s.files += Dir.glob("test/css/**/*.*")
@@ -31,4 +33,4 @@ Gem::Specification.new do |s|
   s.rubygems_version = %q{1.3.6}
   s.add_dependency(%q<compass>, [">= 0.12.2"])
   s.add_dependency(%q<sass>, [">= 3.2.0"])
-end
+end

metadata

@@ -1,72 +1,55 @@
---- !ruby/object:Gem::Specification 
+--- !ruby/object:Gem::Specification
 name: ezy
-version: !ruby/object:Gem::Version 
-  hash: 27
-  prerelease: 
-  segments: 
-  - 0
-  - 1
-  - 0
-  version: 0.1.0
+version: !ruby/object:Gem::Version
+  version: 0.1.1
 platform: ruby
-authors: 
+authors:
 - Frej Raahede Nielsen
 autorequire: 
 bindir: bin
 cert_chain: []
-
-date: 2013-11-13 00:00:00 Z
-dependencies: 
-- !ruby/object:Gem::Dependency 
+date: 2013-11-13 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
   name: compass
-  prerelease: false
-  requirement: &id001 !ruby/object:Gem::Requirement 
-    none: false
-    requirements: 
-    - - ">="
-      - !ruby/object:Gem::Version 
-        hash: 43
-        segments: 
-        - 0
-        - 12
-        - 2
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
         version: 0.12.2
   type: :runtime
-  version_requirements: *id001
-- !ruby/object:Gem::Dependency 
-  name: sass
   prerelease: false
-  requirement: &id002 !ruby/object:Gem::Requirement 
-    none: false
-    requirements: 
-    - - ">="
-      - !ruby/object:Gem::Version 
-        hash: 15
-        segments: 
-        - 3
-        - 2
-        - 0
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 0.12.2
+- !ruby/object:Gem::Dependency
+  name: sass
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
         version: 3.2.0
   type: :runtime
-  version_requirements: *id002
-description: A collection of SCSS tools for creating responsive websites. Includes a simple but powerful grid framework, media query helpers and sprite helpers.
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+description: A collection of SCSS tools for creating responsive websites. Includes
+  a simple but powerful grid framework, media query helpers and sprite helpers.
 email: frejraahede@gmail.com
 executables: []
-
 extensions: []
-
 extra_rdoc_files: []
-
-files: 
+files:
 - README.md
 - ezy.gemspec
 - VERSION
 - lib/ezy.rb
 - sass/_ezy.scss
-- sass/ezy/_clearfix.scss
-- sass/ezy/_functions.scss
-- sass/ezy/_grid.scss
-- sass/ezy/_media.scss
 - sass/ezy/_sprites.scss
 - templates/project/_settings.scss
 - templates/project/index.html
@@ -143,37 +126,27 @@ files:
 - test/img/test-spacing@2x/classic.png
 - test/img/test-spacing@2x/indy.png
 homepage: http://github.com/raahede/
-licenses: 
+licenses:
 - MIT
+metadata: {}
 post_install_message: 
 rdoc_options: []
-
-require_paths: 
+require_paths:
 - lib
-required_ruby_version: !ruby/object:Gem::Requirement 
-  none: false
-  requirements: 
-  - - ">="
-    - !ruby/object:Gem::Version 
-      hash: 3
-      segments: 
-      - 0
-      version: "0"
-required_rubygems_version: !ruby/object:Gem::Requirement 
-  none: false
-  requirements: 
-  - - ">="
-    - !ruby/object:Gem::Version 
-      hash: 3
-      segments: 
-      - 0
-      version: "0"
+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: 1.8.25
+rubygems_version: 2.1.10
 signing_key: 
-specification_version: 3
+specification_version: 4
 summary: The developer's toolbox for responsive websites
 test_files: []
-

data/sass/ezy/_clearfix.scss

@@ -1,25 +0,0 @@
-/* -------------------------------------------------------------------- *
- *  Micro Clearfix 
- *  http://nicolasgallagher.com/micro-clearfix-hack/
- */
-
-%clearfix:before,
-%clearfix:after {
-  content: " ";
-  display: table;
-}
-
-%clearfix:after {
-  clear: both;
-}
-
-
-%clearfix {
-  /**
-   * For IE 6/7 only
-   * Include this rule to trigger hasLayout and contain floats.
-   */
-  *zoom: 1;
-}
-
-/* -------------------------------------------------------------------- */

data/sass/ezy/_functions.scss

@@ -1,11 +0,0 @@
-
-// ---------------------------------------------------------------------------
-// @function percentage-round
-// 
-// Similar to the SASS percentage() function, but rounds down to 2 decimals
-// $columns :   Fraction to convert to percentage
-// @return  :   Percentage value rounded down to 2 decimals
-
-@function percentage-round( $value ) {
-    @return floor( percentage( $value ) * 100 ) / 100;
-}

data/sass/ezy/_grid.scss

@@ -1,279 +0,0 @@
-// ---------------------------------------------------------------------------
-// Importing dependencies
-
-@import "functions";
-@import "clearfix";
-
-// ---------------------------------------------------------------------------
-// Mandatory grid settings
-// Defaults: can be overridden
-
-$column-width:            4em       !default;
-$gutter-width:            1em       !default;
-$default-gutter-property: "margin"  !default;
-$total-columns:           12        !default;
-$is-fluid:                true      !default;
-
-// ---------------------------------------------------------------------------
-// Variables used in grid context
-
-$grid-init: false;
-$context-warn: "You must set $context if $is-fluid is set to true.";
-$init-gutter-property: $default-gutter-property;
-
-// ---------------------------------------------------------------------------
-// @function layout-width
-// 
-// Returns width based on given number of culumns
-// $columns :   Number of columns to calculate width from
-// @return  :   Width in the same unit as $column-width and $gutter-width
-
-@function layout-width( $columns ) {
-  @if comparable( $column-width, $gutter-width ) {
-    @return $columns * ( $column-width + $gutter-width ) - $gutter-width;
-  } @else {
-    @warn "$column-width and $gutter-width must have the same unit set. #{ unit($column-width) }'s and #{ unit($gutter-width) }'s are not comparable.";
-  }
-}
-
-// ---------------------------------------------------------------------------
-// @function context-width
-// 
-// Returns width based on given number of culumns, plus an extra gutter
-// Used for % calculations in the grid
-// $columns :   Number of columns to calculate width from
-// @return  :   Width in the same unit as $column-width and $gutter-width
-
-@function context-width( $columns ) {
-  @return layout-width( $columns ) + $gutter-width;
-}
-
-// ---------------------------------------------------------------------------
-// @function span-column-width
-// 
-// Same as layout-width( $columns ), but renamed for better context awareness
-
-@function span-column-width( $columns ) {
-  @return layout-width( $columns );
-}
-
-// ---------------------------------------------------------------------------
-// @function gutter
-// 
-// Returns gutter in the same unit as $gutter-width if grid is static
-// Returns gutter as a percentage of the context if grid is fluid
-// $context :   Number of columns in the current context. 
-//          :   If set to false, the returned value is as in static grid 
-// @return  :   Width as $gutter-width or as a percentage of the context
-
-@function gutter(
-  $context: false
-  ) {
-  @if $is-fluid and $context {
-    @return ( percentage-round( ( $gutter-width / 2 ) / context-width( $context ) ) );
-  } @else if $is-fluid {
-    @warn $context-warn;
-  } @else {
-    @return $gutter-width / 2; 
-  }
-}
-
-// ---------------------------------------------------------------------------
-// @mixin gutters
-// 
-// Sets gutters using the gutter( $context ) function
-// $context           :   Number of columns in the current context. 
-//                    :   Only mandatory if grid is fluid 
-// $gutter-property   :   Set to "margin" or "padding"
-
-@mixin gutters( 
-  $context: false,
-  $property: false
-  ) {
-  @if (not $property) {
-    $property: $default-gutter-property;
-  }
-  @if $property == "margin" or $property == "padding" {
-    float: left;
-    #{ $property }: {
-      left: gutter( $context );
-      right: gutter( $context );
-    }
-  } @else {
-    @warn "$gutter-property must be set to either 'margin' or 'padding'";
-  }
-}
-
-// ---------------------------------------------------------------------------
-// Grid master placeholder selector
-// Adds cleafix and centers page in browser
-
-%ezy-master {
-  @extend %clearfix;
-  margin: {
-    left: auto;
-    right: auto;
-  }
-}
-
-// ---------------------------------------------------------------------------
-// @mixin master
-// 
-// Sets width on page. If the grid is fluid, it's set as a max-width
-// Extends the grid master placeholder selector
-// $context           :   Number of columns in the current context. 
-
-@mixin master(
-  $context
-  ) {
-  @if $is-fluid {
-    max-width: layout-width( $context );
-  } @else {
-    width: layout-width( $context );
-  }
-  @extend %ezy-master;
-}
-
-// ---------------------------------------------------------------------------
-// Grid container placeholder selector
-// Adds cleafix
-
-%ezy-container {
-  @extend %clearfix;
-}
-
-// ---------------------------------------------------------------------------
-// @mixin container
-// 
-// Sets width on page. If the grid is fluid, it's set as a max-width
-// Extends the grid master placeholder selector
-// $context           :   Number of columns in the current context
-//                    :   Only mandatory if grid is fluid
-// $at-breakpoint     :   Set to true if mixin is called within a media query
-//                    :   Avoids SASS compillation errors from extending within
-//                    :   a media query
-
-@mixin container(
-  $context: false,
-  $at-breakpoint: false
-  ) {
-  $pullout: -( $gutter-width )/2;
-  @if $is-fluid and $context {
-    $pullout: -( percentage-round( $gutter-width / layout-width( $context ) ) )/2;
-  } @else if $is-fluid {
-    @warn $context-warn;
-  }
-  margin: {
-    left: $pullout;
-    right: $pullout;
-  }
-  @if (not $at-breakpoint) {
-    @extend %ezy-container;
-  }
-}
-
-// ---------------------------------------------------------------------------
-// @mixin grid-init
-// 
-// Prints out placeholder selectors used with columns. Helps reduce the CSS output.
-// 
-// Should be called after setting grid variables:
-// ----------------
-// $column-width
-// $gutter-width
-// $gutter-property
-// $total-columns
-// ----------------
-
-@mixin grid-init() {
-  $grid-init: true;
-  $init-gutter-property: $default-gutter-property;
-  @if $is-fluid {
-    @for $i from 1 through $total-columns {
-      %ezy-column-#{ $i } {
-        @include gutters( $i );
-      }
-    }
-  } @else {
-    %ezy-column {
-      @include gutters;
-    }
-  }
-}
-
-// ---------------------------------------------------------------------------
-// @mixin span-columns
-// 
-// Sets width and gutter on columns
-// Uses @extend for gutters outside media queries if grid-init() has been called
-// $columns           :   Number of columns to span
-// $context           :   Number of columns in the current context
-//                    :   Only mandatory if grid is fluid
-// $at-breakpoint     :   Set to true if mixin is called within a media query
-//                    :   Avoids SASS compillation errors from extending within
-//                    :   a media query
-// $gutter-property   :   Overrides the global $gutter-property
-
-@mixin span-columns(
-  $columns,
-  $context: false,
-  $at-breakpoint: false,
-  $gutter-property: false
-  ) {
-  $width: span-column-width( $columns );
-  @if $is-fluid and $context {
-  /* Spanning #{ $columns } of #{ $context } columns */
-    $context-width: context-width( $context );
-    $pct-width: percentage-round( $width / $context-width );
-    width: $pct-width;
-  } @else {
-  /* Spanning #{ $columns } columns */
-    width: $width;
-  }
-
-  @if $gutter-property and $gutter-property != $default-gutter-property {
-
-    @if $is-fluid and $context {
-      @include gutters( $context, $gutter-property );
-
-    } @else if ( not $is-fluid ) {
-      @include gutters( $property: $gutter-property );
-
-    } @else if $is-fluid and ( not $context ) {
-      @warn $context-warn;
-    }
-
-  } @else if $is-fluid and $context {
-
-    @if $at-breakpoint or $init-gutter-property != $default-gutter-property {
-      @include gutters( $context );
-
-    } @else if ( $total-columns < $context ) {
-      @include gutters( $context );
-      @warn "Please check if $total-columns is set. $total-columns should be the highest number of columns occuring in your layout. This error will not break your layout, but will increase the CSS output.";
-
-    } @else if ( not $grid-init ) {
-      @include gutters( $context );
-      @warn "Include grid-init() after setting $total-columns for cleaner CSS output.";
-      
-    } @else {
-      @extend %ezy-column-#{ $context };
-    }
-
-
-  } @else if $is-fluid { // $context not set
-
-    @warn $context-warn;
-
-  } @else if $grid-init and $init-gutter-property == $default-gutter-property { // Grid is static
-      @extend %ezy-column;
-
-  } @else {
-    @include gutters( $context );
-
-    @if (not $grid-init) { 
-      @warn "Include grid-init() after setting $gutter-width for cleaner CSS output."; 
-    }
-  }
-}
-

data/sass/ezy/_media.scss

@@ -1,48 +0,0 @@
-
-$legacy-selector: ".no-media-queries" !default;
-
-@function set-breakpoint(
-  $min: false,
-  $max: false,
-  $custom: false,
-  $legacy-support: false
-  ) {
-
-  @if (not $min) and (not $max) and (not $custom) {
-    @warn "Either $min, $max, or $custom must be defined for set-breakpoint to work.";
-  }
-
-  @if $min and $max {
-    // Both $min and $max
-    @return "(min-width: #{ $min }) and (max-width: #{ $max })", $legacy-support;
-  } @else {
-    @if $min and (not $max) {
-      // Min only:
-      @return "(min-width: #{ $min })", $legacy-support;
-    }
-    @if $max and (not $min) {
-      // Max only:
-      @return "(max-width: #{ $max })", $legacy-support;
-    } @else {
-      // Custom:
-      @return $custom, $legacy-support;
-    }
-  }
-}
-
-@mixin at-breakpoint( 
-  $breakpoint,
-  $legacy-support: false
-  ) {
-  @media #{ nth( $breakpoint, 1 ) } {
-    @content;
-  }
-  @if $legacy-support or nth( $breakpoint, 2 ) {
-    #{ $legacy-selector } & {
-      /* Fallback for browsers not supporting media queries */
-      @content;
-    }
-  }
-}
-
-