typey 1.0.0.alpha.3 → 1.0.0.alpha.4

data/stylesheets/typey/_font-size.scss

@@ -32,14 +32,13 @@
 }
 
 // Define font-size (with fallback).
-// This is only necessary to use if you want to provide fallbacks when you are
-// using rem as $base-unit.
 //
 // @param string $size
 //   A size from the $font-size map.
-// @param number $context
-//   (optional) Only used if em is the $base-unit. The value of the parent 
-//   font-size if differs from $base-font-size. Must be the same unit as used in the map.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
 @mixin font-size($size, $context: $base-font-size) {
   $map-size: map-get($font-size, $size);
   @if $base-unit == rem {

data/stylesheets/typey/_helpers.scss

@@ -16,7 +16,7 @@
 //
 // @param number $number
 //   The number (with unit) to convert. Allowed units: px, pt
-// @param number $context
+// @param number|string $context
 //   (optional) Only used if em is the $base-unit. The value of the elements/parents 
 //   font-size if it differs from $base-font-size. Specified as a t-shirt size or
 //   value in the same unit as the $font-size map.

data/stylesheets/typey/_line-height.scss

@@ -1,5 +1,6 @@
-// Generate a value to be used as line-height (or margin, padding, etc) from 
-// either: a) a multiple of $base-line-height or b) a static px or pt value.
+// Generate a value to be used as line-height from either: 
+//   a) a multiple of $base-line-height
+//   b) a static px or pt value
 //
 // Example usage with multiple:
 //   line-height: line-height(2);
@@ -8,8 +9,8 @@
 //
 // @param number $x
 //   Multiple of line height to be used or px/pt value to be converted.
-// @param number $context
-//   (optional) Only used if em is the $base-unit. The value of the elements 
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
 //   font-size if it differs from $base-font-size. Specified as a t-shirt size or
 //   value in the same unit as the $font-size map.
 //
@@ -46,8 +47,8 @@
 //
 // @param number $x
 //   Multiple of line height to be used or px/pt value to be converted.
-// @param number $context
-//   (optional) Only used if em is the $base-unit. The value of the elements 
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
 //   font-size if it differs from $base-font-size. Specified as a t-shirt size or
 //   value in the same unit as the $font-size map.
 @mixin line-height($x, $context: $base-font-size) {

data/stylesheets/typey/_margin.scss

@@ -0,0 +1,143 @@
+// Generate a value to be used as margin from either: 
+//   a) a multiple of $base-line-height
+//   b) a static px or pt value
+//
+// Example usage with multiple:
+//   margin: margin(2);
+// Example usage with static value:
+//   margin: margin(18px);
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+//
+// @return number
+//   The caculated height in $base-unit.
+@function margin($x, $context: $base-font-size) {
+  @return line-height($x, $context);
+}
+
+// Define margin (with fallback).
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number|list $x
+//   Multiple of line height to be used or px/pt value to be converted.
+//   Uses the same parameters as the CSS margin property: 
+//   i.e. top right bottom left, 1 0 2 0.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin margin($list, $context: $base-font-size) {
+  $px-list: ();
+  $converted-list: ();
+  @each $x in $list {
+    @if $base-unit == rem {
+      @if type-of($x) == 'number' and unitless($x) {
+        $margin: $x * $base-line-height;
+        $px-list: join($px-list, $margin, $separator: space);
+      }
+      @if type-of($x) == 'number' and not unitless($x) {  
+        $px-list: join($px-list, $x, $separator: space);
+      }    
+    }
+    $margin: line-height($x, $context);
+    $converted-list: join($converted-list, $margin, $separator: space);
+  }
+  @if $base-unit == rem {
+    margin: $px-list;
+  }
+  margin: $converted-list;
+}
+
+// Define margin-top (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin margin-top($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      margin-top: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      margin-top: $x;
+    }
+  }
+  margin-top: line-height($x, $context);
+}
+
+// Define margin-bottom (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin margin-bottom($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      margin-bottom: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      margin-bottom: $x;
+    }
+  }
+  margin-bottom: line-height($x, $context);
+}
+
+// Define margin-left (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin margin-left($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      margin-left: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      margin-left: $x;
+    }
+  }
+  margin-left: line-height($x, $context);
+}
+
+// Define margin-right (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin margin-right($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      margin-right: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      margin-right: $x;
+    }
+  }
+  margin-right: line-height($x, $context);
+}

data/stylesheets/typey/_padding.scss

@@ -0,0 +1,143 @@
+// Generate a value to be used as padding from either: 
+//   a) a multiple of $base-line-height
+//   b) a static px or pt value
+//
+// Example usage with multiple:
+//   padding: padding(2);
+// Example usage with static value:
+//   padding: padding(18px);
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+//
+// @return number
+//   The calcuated height in $base-unit.
+@function padding($x, $context: $base-font-size) {
+  @return line-height($x, $context);
+}
+
+// Define padding (with fallback).
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number|list $x
+//   Multiple of line height to be used or px/pt value to be converted.
+//   Uses the same parameters as the CSS padding property: 
+//   i.e. top right bottom left, 1 0 2 0.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin padding($list, $context: $base-font-size) {
+  $px-list: ();
+  $converted-list: ();
+  @each $x in $list {
+    @if $base-unit == rem {
+      @if type-of($x) == 'number' and unitless($x) {
+        $padding: $x * $base-line-height;
+        $px-list: join($px-list, $padding, $separator: space);
+      }
+      @if type-of($x) == 'number' and not unitless($x) {  
+        $px-list: join($px-list, $x, $separator: space);
+      }    
+    }
+    $padding: line-height($x, $context);
+    $converted-list: join($converted-list, $padding, $separator: space);
+  }
+  @if $base-unit == rem {
+    padding: $px-list;
+  }
+  padding: $converted-list;
+}
+
+// Define padding-top (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin padding-top($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      padding-top: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      padding-top: $x;
+    }
+  }
+  padding-top: line-height($x, $context);
+}
+
+// Define padding-bottom (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin padding-bottom($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      padding-bottom: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      padding-bottom: $x;
+    }
+  }
+  padding-bottom: line-height($x, $context);
+}
+
+// Define padding-left (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin padding-left($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      padding-left: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      padding-left: $x;
+    }
+  }
+  padding-left: line-height($x, $context);
+}
+
+// Define padding-right (with fallback). 
+// This is only necessary to use if you want to provide fallbacks when you are
+// using rem as $base-unit.
+//
+// @param number $x
+//   Multiple of line height to be used or px/pt value to be converted.
+// @param number|string $context
+//   (optional) Only used if em is the $base-unit. The value of the elements/parents 
+//   font-size if it differs from $base-font-size. Specified as a t-shirt size or
+//   value in the same unit as the $font-size map.
+@mixin padding-right($x, $context: $base-font-size) {
+  @if $base-unit == rem {
+    @if type-of($x) == 'number' and unitless($x) {
+      padding-right: $x * $base-line-height;
+    }
+    @if type-of($x) == 'number' and not unitless($x) {  
+      padding-right: $x;
+    }
+  }
+  padding-right: line-height($x, $context);
+}

data/typey.gemspec

@@ -9,7 +9,7 @@ Gem::Specification.new do |spec|
   spec.homepage     = 'http://github.com/jptaranto/typey'
   spec.rubyforge_project =
 
-  spec.version      = '1.0.0.alpha.3'
+  spec.version      = '1.0.0.alpha.4'
   spec.date         = '2015-04-22'
   spec.licenses     = ['GPL-2']
 

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: typey
 version: !ruby/object:Gem::Version
-  version: 1.0.0.alpha.3
+  version: 1.0.0.alpha.4
 platform: ruby
 authors:
 - Jack Taranto
@@ -32,12 +32,15 @@ extra_rdoc_files: []
 files:
 - lib/typey.rb
 - stylesheets/_typey.scss
+- stylesheets/config.codekit
 - stylesheets/typey/_defaults.scss
 - stylesheets/typey/_font-size.scss
 - stylesheets/typey/_font-stacks.scss
 - stylesheets/typey/_font-weight.scss
 - stylesheets/typey/_helpers.scss
 - stylesheets/typey/_line-height.scss
+- stylesheets/typey/_margin.scss
+- stylesheets/typey/_padding.scss
 - LICENSE.txt
 - README.md
 - typey.gemspec
@@ -60,7 +63,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: 1.3.1
 requirements: []
-rubyforge_project: 1.0.0.alpha.3
+rubyforge_project: 1.0.0.alpha.4
 rubygems_version: 2.0.14
 signing_key: 
 specification_version: 4