typey 1.0.0.beta.7 → 1.0.0.beta.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 085e5f970aa194b2550fc3b61bd25eae2bfecb73
-  data.tar.gz: 60062ba4fdad99e314274aae29764f6723b2a471
+  metadata.gz: 5cf8fab7e972467e5f8ebac592d89f934a1a764e
+  data.tar.gz: 6abd15dd136bfcc0bd600c4c98e3aea2c3447134
 SHA512:
-  metadata.gz: 77e006349cca554d66f6df6521647e880aabeb1de06e07c037c25a97bd8cf75761c6b2834d234bcbee4f0f74619a33536a31ae1f136aa1382b878100c989046b
-  data.tar.gz: 386985ec32299afac9ec212b527418f754311107f3e33694e48c8cd064b95a7df3be3a251287a47e139d920c93fd71b233aaf41a2ee721f04b33fd4bc97b05d3
+  metadata.gz: 038e6ac7bfc702ce2b62ad88cb062ab9e5346d81f99412c7c22a291e9256879299c59f43c725be516d68e0e691faa19cf51e449b6f1d5d74ec93cfb467bdf607
+  data.tar.gz: abf9060ea87ff824df68b52d80eb61f9d4f4377686ff6cc34abb7a52ca7152ad1bc7fde83254fb23778a01f2f6dabeea3c856c219c41ce5b4390bc2f896e17a7

data/README.md

@@ -21,7 +21,7 @@ Bower
 
 Vanilla Sass
 
-* Terminal: 'git clone git@github.com:jptaranto/typey.git
+* Terminal: `git clone git@github.com:jptaranto/typey.git`
 * SCSS: `@import '../link_to_component_dir/typey/stylesheets/typey'`
 
 ## Getting started
@@ -50,11 +50,11 @@ Just like in compass Vertical Rhythm we define our base font size and line heigh
 
 ```sass
 $base-font-size:    16px;
-$base-line-height:  20px;
+$base-line-height:  24px;
 ```
 
 Ok, so we have our base sizing, now we need to choose the approach that we are going
-to layout type with. We have two options available to us: rhythm and ratio. Rhythm
+to layout type with. We have two options available to us: `rhythm` and `ratio`. Rhythm
 allows us to specify line-heights as a multiple of $base-line-height, where as ratio
 allows us to specify line-heights as a multiple of our elements font-size. Rhythm is
 the default, but for beginners working with web typography the simplest approach
@@ -62,11 +62,7 @@ is to use ratio. Each example below will tell you which method it is for.
 
 ```sass
 $line-height-method: rhythm;
-```
-
-or
-
-```sass
+// or
 $line-height-method: ratio;
 ```
 
@@ -74,7 +70,7 @@ If you are using ratio, you should set your base ratio as so. Ignore this one
 if you are using rhythm.
 
 ```sass
-$base-line-height-ratio: 1.25
+$base-line-height-ratio: 1.5
 ```
 
 By default typey will create print friendly stylesheets by adding a print media
@@ -95,7 +91,7 @@ $font-size: (
   xl:   32px,
   l:    24px,
   m:    16px,
-  s:    14px,
+  s:    12px,
 );
 ```
 
@@ -203,7 +199,7 @@ li {
 ```
 
 All of typey's mixins accept a px value instead of a multiple/ratio or key from
-the font-size map.
+the $font-size map.
 
 ## Really quite tricky stuff (em as the $base-unit)
 

data/stylesheets/typey/_defaults.scss

@@ -11,7 +11,7 @@ $base-font-size:           16px !default;
 
 // The base line height will be used for most calculations involving height.
 // Allowed units: px
-$base-line-height:         20px !default;
+$base-line-height:         24px !default;
 
 // The method to calculate line-height. Allowed values: rhythm or ratio.
 // Rhytm uses a vertical rhythm approach where line-height is specified as
@@ -21,7 +21,7 @@ $base-line-height:         20px !default;
 $line-height-method:       rhythm !default;
 
 // The default ratio of line-height to font-size.
-$base-line-height-ratio:   1.25 !default;
+$base-line-height-ratio:   1.5 !default;
 
 // By default we will provide fallbacks when rem is the base unit.
 $rem-fallback:             true !default;

data/stylesheets/typey/functions/_em-calculators.scss

@@ -12,10 +12,10 @@
   $type: typey-validator($context, $allowed-types);
   @if $type == "font-size" {
     $context-map-size: map-get($font-size, $context);
-    @return typey-output-in-base-unit(($x / $context-map-size));
+    @return typey-output-in-unit(($x / $context-map-size), em);
   }
   @if $type == "px" {
-    @return typey-output-in-base-unit(($x / $context));
+    @return typey-output-in-unit(($x / $context), em);
   }
 }
 
@@ -33,9 +33,9 @@
   $type: typey-validator($context, $allowed-types);
   @if $type == "font-size" {
     $context-map-size: map-get($font-size, $context);
-    @return typey-output-in-base-unit(($x * $base-line-height) / $context-map-size);
+    @return typey-output-in-unit(($x * $base-line-height) / $context-map-size, em);
   }
   @if $type == "px" {
-    @return typey-output-in-base-unit(($x * $base-line-height) / $context);
+    @return typey-output-in-unit(($x * $base-line-height) / $context, em);
   }
 }

data/stylesheets/typey/functions/_helpers.scss

@@ -17,6 +17,27 @@
   }
 }
 
+// Output a number in a chosen unit.
+//
+// @param number $number
+//   The number (without unit) to output.
+// @param string $unit
+//   (optional) The unit to output, either em, px or rem.
+//
+// @return number
+//   The number with the base unit
+@function typey-output-in-unit($number, $unit: $base-unit) {
+  @if $unit == rem {
+    @return $number * 1rem;
+  }
+  @if $unit == px {
+    @return $number * 1px;
+  }
+  @if $unit == em {
+    @return $number * 1em;
+  }
+}
+
 // Remove the unit from a number.
 //
 // @param number $number

data/stylesheets/typey/mixins/_define-type-sizing.scss

@@ -22,13 +22,9 @@
       line-height: $line-height;
     }
     @else {
-      @if $base-unit == rem {
-        @if $rem-fallback == true {
-          line-height: $line-height;
-        }
-      }
       @if $base-unit == rem or $base-unit == em {
-        line-height: typey-output-in-base-unit($line-height / $size);
+        // In the html element, rem means relative to browser default font size; em means relative to html's font size.
+        line-height: calculate-em-px($line-height, $size);
       }
       @if $base-unit == px {
         line-height: $line-height;

data/typey.gemspec

@@ -3,13 +3,13 @@
 Gem::Specification.new do |spec|
   spec.name         = 'typey'
 
-  spec.summary      = %q{A complete framework for working with typography on the web.}
+  spec.summary      = %q{A complete framework for working with typography in sass.}
 
   spec.homepage     = 'http://github.com/jptaranto/typey'
   spec.rubyforge_project =
 
-  spec.version      = '1.0.0.beta.7'
-  spec.date         = '2015-08-07'
+  spec.version      = '1.0.0.beta.8'
+  spec.date         = '2015-09-04'
   spec.licenses     = ['GPL-2']
 
   spec.authors      = ['Jack Taranto']

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: typey
 version: !ruby/object:Gem::Version
-  version: 1.0.0.beta.7
+  version: 1.0.0.beta.8
 platform: ruby
 authors:
 - Jack Taranto
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2015-08-07 00:00:00.000000000 Z
+date: 2015-09-04 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -71,9 +71,9 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: 1.3.1
 requirements: []
-rubyforge_project: 1.0.0.beta.7
+rubyforge_project: 1.0.0.beta.8
 rubygems_version: 2.4.6
 signing_key: 
 specification_version: 4
-summary: A complete framework for working with typography on the web.
+summary: A complete framework for working with typography in sass.
 test_files: []