goldentype 1.0.0

data/README.mkdn

@@ -0,0 +1,51 @@
+Compass Golden Type
+====================
+
+Golden Type applies "Golden Ratio Typography" outlined by @pearsonified
+
+  http://www.pearsonified.com/2011/12/golden-ratio-typography.php
+
+Compass can automatically generate the values his calculator does
+
+  http://www.pearsonified.com/typography/
+
+
+Installation
+============
+
+From the command line:
+
+    (sudo) gem install goldentype
+
+Add to a project:
+
+    // rails: compass.config, other: config.rb
+    require 'goldentype'
+
+    // command line
+    compass install goldentype
+
+Or create a new project:
+
+    compass -r goldentype -f goldentype project_directory
+
+Available Defaults and Mixins
+=============================
+
+Mixins:
+
+* Golden Type using Phi
+
+First argument is font-size. Set to 0 if unknown or if you want to calculate based on content width. Second argument is content width (line-width) which can be ommitted if unknown or if you want to calculate based on content.
+
+If no units are given for either argument, pixels will be used by default.
+
+    golden-type($font-size, $line-width)
+
+* Adjusted Golden Type
+
+Takes same arguments as original. Will used adjusted ratio as outlined in article.
+
+    golden-type-adjusted($font-size, $line-width)
+
+

data/lib/goldentype.rb

@@ -0,0 +1,6 @@
+require 'compass'
+
+require File.join(File.dirname(__FILE__), 'goldentype', 'sass_extensions')
+
+extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
+Compass::Frameworks.register('goldentype', :path => extension_path)

data/lib/goldentype/sass_extensions.rb

@@ -0,0 +1,8 @@
+require 'sass'
+
+module Sass::Script::Functions
+  def sqrt(value)
+    numeric_transformation(value) {|n| Math.sqrt(n)}
+  end
+  declare :sqrt, :args => [:number]
+end

data/stylesheets/_goldentype.sass

@@ -0,0 +1,2 @@
+@import goldentype/core
+@import goldentype/adjusted

data/stylesheets/goldentype/adjusted.sass

@@ -0,0 +1,32 @@
+@import core
+// Adjusted Equations
+
+// h = $phi - (1 / (2 * $phi)) * (1 - (w / l^2))
+@function golden-adjusted-phi($line-width, $font-size)
+  @return $phi - (1 / (2 * $phi)) * (1 - ($line-width / (($font-size * $phi) * ($font-size * $phi) / $u)))
+
+// adjusted line height (l) given a font size (f) and line width (w)
+@function golden-height-adjusted($line-width, $font-size)
+  @return $font-size * golden-adjusted-phi($line-width, $font-size)
+
+// adjusted line width (w) given a font size (f) and line height (l)
+// w = (f * $phi)^2 * (1 + (2 * $phi)*(26/16 - $phi))
+@function golden-width-adjusted($font-size, $line-height)
+  @return round((($font-size * $phi) * ($font-size * $phi) / $u) * (1 + (2 * $phi) * (($line-height / $font-size) - $phi)))
+
+// returns golden font-size, line-height, and width using adjusted phi where possible
+=golden-text-adjusted($font-size: 0, $line-width: 0)
+  @if $font-size == 0 and $line-width == 0
+    @warn "Need either a font size or content width to begin calculations"
+  @else
+    @if unitless($font-size)
+      $font-size: $font-size * $u
+    @if unitless($line-width)
+      $line-width: $line-width * $u
+    $u: golden-unit($font-size)
+    $f: if($font-size == 0, golden-size($line-width), $font-size)
+    $l: if($line-width == 0, golden-height($f), golden-height-adjusted($line-width, $f))
+    font-size: $f
+    line-height: $l
+    width: if($line-width == 0, golden-width-adjusted($f, $l), $line-width)
+

data/stylesheets/goldentype/core.sass

@@ -0,0 +1,61 @@
+// Golden Ratio Typography
+// http://www.pearsonified.com/2011/12/phi-typography.php
+
+$phi: ((1 + sqrt(5)) / 2)
+// $phi: 1.61803398874989
+// $h: ratio ($phi)
+// $f: font size
+// $l: line height
+// $w: line width
+// $u: default unit
+$u: 1px
+
+// determine unit to divide by to simplify square units (px*px)
+@function golden-unit($val)
+  $unit: unit($val)
+
+  @if $unit == em
+    $u: 1em
+  @else if $unit == pt
+    $u: 1pt
+  @else if $unit == "%"
+    $u: 1%
+
+  @debug $unit $u
+  @return $u
+
+// calculate optimal line height (l) based on font size (f)
+// l = f * h
+@function golden-height($font-size)
+  $h: $font-size * $phi
+  @return round($h)
+
+// calculate optimal line width (w) based on line height (l)
+// w = l ^ 2
+@function golden-width($line-height)
+  @return round($line-height * $line-height / $u)
+
+// calculate optimal font-size (f) based on line width (w)
+// if   w = l ^ 2
+// then w = (f * h)^2
+// then w = f^2 * h^2
+// then w / h^2 = f^2
+// then f = sqrt(w / h^2)
+@function golden-size($line-width)
+  @return round(sqrt($line-width / ($phi * $phi)))
+
+// returns golden font-size, line-height, and width
+=golden-text($font-size: 0, $line-width: 0)
+  @if $font-size == 0 and $line-width == 0
+    @warn "Need either a font size or content width to begin calculations"
+  @else
+    @if unitless($font-size)
+      $font-size: $font-size * $u
+    @if unitless($line-width)
+      $line-width: $line-width * $u
+    $u: golden-unit($font-size)
+    $f: if($font-size == 0, golden-size($line-width), $font-size)
+    $l: golden-height($f)
+    font-size: $f
+    line-height: $l
+    width: if($line-width == 0, golden-width($l), $line-width)

data/templates/project/_golden-typography.sass

@@ -0,0 +1,10 @@
+@import goldentype
+
+// $base-font-size: 16px
+// $content-width: 550px
+
+// .goldentype
+//   +golden-text($base-font-size, $content-width)
+
+// .goldentype-adjusted
+//   +golden-text-adjusted($base-font-size, $content-width)

data/templates/project/manifest.rb

@@ -0,0 +1,14 @@
+description "golden ratio typography for compass"
+
+stylesheet '_golden-typography.sass', :media => 'screen, projection'
+
+help %Q{
+  Use mixins based on Golden Ratio Typography to generate optimal
+    font-size,
+    line-height,
+    width
+}
+
+welcome_message %Q{
+  See the README for how to use mixins
+}

metadata

@@ -0,0 +1,86 @@
+--- !ruby/object:Gem::Specification 
+name: goldentype
+version: !ruby/object:Gem::Version 
+  hash: 23
+  prerelease: 
+  segments: 
+  - 1
+  - 0
+  - 0
+  version: 1.0.0
+platform: ruby
+authors: 
+- Max Beatty
+autorequire: 
+bindir: bin
+cert_chain: []
+
+date: 2012-01-16 00:00:00 Z
+dependencies: 
+- !ruby/object:Gem::Dependency 
+  name: compass
+  prerelease: false
+  requirement: &id001 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 29
+        segments: 
+        - 0
+        - 11
+        version: "0.11"
+  type: :runtime
+  version_requirements: *id001
+description: golden ratio typography for compass
+email: max.beatty@reputation.com
+executables: []
+
+extensions: []
+
+extra_rdoc_files: []
+
+files: 
+- README.mkdn
+- lib/goldentype/sass_extensions.rb
+- lib/goldentype.rb
+- stylesheets/_goldentype.sass
+- stylesheets/goldentype/adjusted.sass
+- stylesheets/goldentype/core.sass
+- templates/project/_golden-typography.sass
+- templates/project/manifest.rb
+homepage: http://www.reputation.com/
+licenses: []
+
+post_install_message: 
+rdoc_options: []
+
+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"
+requirements: []
+
+rubyforge_project: 
+rubygems_version: 1.8.12
+signing_key: 
+specification_version: 3
+summary: golden ratio typography for compass
+test_files: []
+