compass 0.10.0.pre5 → 0.10.0.pre6

data/CHANGELOG.markdown

@@ -1,6 +1,54 @@
 COMPASS CHANGELOG
 =================
 
+0.10.0.pre6 (February 22, 2010)
+-------------------------------
+
+**IMPORTANT:**
+
+* Rails users need to update their compass initializer.
+* The CSS 3 Gradient mixins were re-written and their usage has changed.
+
+Read on for the details:
+
+### CLI
+* Fixed some issues with colorized output.
+* Don't force the user to specify the configuration path when calling compass config
+
+### Compass Core
+* Fix to the bang_hack mixin (Credit: Mark Rajcok)
+* Support :first-child and :last-child pseudo selectors for +horizontal-list. (Credit: Cody Robbins)
+* Clear the sticky footer so that it works correctly with grid layouts.
+* The css3 gradient module has been re-written and has a new, much simpler mixins. If you have been using the css3 gradient mixins, you'll need to update your sass stylesheets. The new mixins can be seen in action [here](http://compass-style.org/examples/css3/gradients.html).
+* Added new helper functions: `image_width("path/to/image.png")` & `image_height("path/to/image.png")` that return the size in pixels. (Credit: Deepak Jois & Richard Aday)
+
+### Blueprint
+* Take margins into account in liquid grid. (Credit: Christoffer Eliesen)
+
+### Rails
+* Several Rails 3 bug fixes (Credit: Jacques Crocker) 
+* Don't set unset options on the Sass::Plugin
+* Fixed a setup bug and handle compass configuration changes at rails boot.
+
+**IMPORTANT:** Existing rails projects _must_ change their compass initializer file to:
+
+    require 'compass'
+    rails_root = (defined?(Rails) ? Rails.root : RAILS_ROOT).to_s
+    Compass.add_project_configuration(File.join(rails_root, "config", "compass.rb"))
+    Compass.configure_sass_plugin!
+    Compass.handle_configuration_change!
+
+### Internals
+* New APIs for dealing with configuration changes and accessing a compiler instance.
+* Provide a convenience function for discovering extensions: `Compass.discover_extensions!` that can be called during project configuration w/ other ruby frameworks.
+
+### Extensions
+
+* Don't force an extension to register itself just because it has ruby code.
+  This makes it easier for extensions to provide Sass functions from ruby.
+
+Special thanks to Daniel Hofstetter for fixing my typos.
+
 0.10.0.pre5 (January 18, 2010)
 ------------------------------
 * Fixed a bug in the grid builder in ruby 1.8.6 (Credit: [Richard Wöber][der-rich])

data/VERSION.yml

@@ -2,4 +2,4 @@
 :patch: 0
 :major: 0
 :minor: 10
-:build: pre5
+:build: pre6

data/examples/css3/extensions/compass-colors/README.markdown

@@ -0,0 +1,50 @@
+Compass Colors
+==============
+
+This compass extension provides support for working with colors in Sass and generating color themes for use on your website.
+
+Installing
+==========
+
+    sudo gem install chriseppstein-compass-colors
+
+
+To install a theme into your existing compass project, add the following to your compass configuration file:
+
+    require 'compass-colors'
+
+Then run this command:
+
+    compass -f colors -p <Theme Name>
+
+The _theme.sass partial can then be imported into your stylesheets and the color constants can be used.
+
+    @import theme.sass    
+    
+Supported Color Themes
+======================
+
+With all of these themes, you must pick a base color and the theme takes it from there:
+
+* Basic/Monochromatic (basic)
+* Complementary (complementary)
+* Triadic (triadic)
+* Split Complementary (split_complement)
+* Analogous (analogous)
+
+Sass Functions Provided
+=======================
+
+* `lighten(color, percentage)` - Create a color lighter by the percent amount provided.
+* `darken(color, percentage)`  - Create a color darker by the percent amount provided.
+* `saturate(color, percentage)` - Increase the saturation of a color by the percent amount provided.
+* `desaturate(color, percentage)` - Decrease the saturation of a color by the percent amount provided.
+* `hue(color)` - Extract the hue from the color in degrees (0-360). Suitable to be passed as the first argument of hsl.
+* `saturation(color)` - Extract the saturation from the color in percent (0-100). Suitable to be passed as the second argument of hsl.
+* `luminosity(color)` - Extract the luminosity from the color in percent (0-100). Suitable to be passed as the third argument of hsl.
+* `mix(color1, color2, percentage)` - Create a new color by mixing two colors together. Percentage (0-100) is optional, and indicates how
+  much of color2 should be mixed into color1.
+* `grayscale(color)` - Create a gray color by mapping the color provided to the grayscale.
+* `adjust_hue(color, degrees)` - Add the number of degrees provided to the hue of the color keeping luminosity and saturation constant.
+  Degrees can be negative.
+* `complement(color)` - Returns the compliment of the color provided.

data/examples/css3/extensions/compass-colors/VERSION.yml

@@ -0,0 +1,5 @@
+--- 
+:build: 
+:major: 0
+:minor: 3
+:patch: 1

data/examples/css3/extensions/compass-colors/example/config.rb

@@ -0,0 +1,13 @@
+# Require any additional compass plugins here.
+require File.join(File.dirname(__FILE__), '..', 'lib', 'compass-colors')
+
+project_type = :stand_alone
+# Set this to the root of your project when deployed:
+http_path = "/"
+css_dir = "stylesheets"
+sass_dir = "src"
+images_dir = "images"
+extensions_dir = "extensions"
+output_style = :compact
+# To enable relative paths to assets via compass helper functions. Uncomment:
+relative_assets = true

data/examples/css3/extensions/compass-colors/example/src/_split_compliment_theme.sass

@@ -0,0 +1,28 @@
+// In theory the lightness and saturation values of corresponding colors should not change.
+// In reality, these values should be adjusted to create a more pleasant color combination.
+// There is not any mathematical formula for this, but you can use the lighten, darken,
+// saturate and desaturate functions to adjust your main colors.
+!base_color ||= red
+!complement_support_color = adjust_hue(!base_color, 180 + 30)
+!complement_accent_color  = adjust_hue(!base_color, 180 - 30)
+
+!base_dark_color     = darken(!base_color, 25)
+!base_darker_color   = darken(!base_color, 50)
+!base_darkest_color  = darken(!base_color, 75)
+!base_light_color    = lighten(!base_color, 25)
+!base_lighter_color  = lighten(!base_color, 50)
+!base_lightest_color = lighten(!base_color, 75)
+
+!dark_complement_support_color     = darken(!complement_support_color, 25)
+!darker_complement_support_color   = darken(!complement_support_color, 50)
+!darkest_complement_support_color  = darken(!complement_support_color, 75)
+!light_complement_support_color    = lighten(!complement_support_color, 25)
+!lighter_complement_support_color  = lighten(!complement_support_color, 50)
+!lightest_complement_support_color = lighten(!complement_support_color, 75)
+
+!dark_complement_accent_color     = darken(!complement_accent_color, 25)
+!darker_complement_accent_color   = darken(!complement_accent_color, 50)
+!darkest_complement_accent_color  = darken(!complement_accent_color, 75)
+!light_complement_accent_color    = lighten(!complement_accent_color, 25)
+!lighter_complement_accent_color  = lighten(!complement_accent_color, 50)
+!lightest_complement_accent_color = lighten(!complement_accent_color, 75)

data/examples/css3/extensions/compass-colors/example/src/screen.sass

@@ -0,0 +1,40 @@
+@import compass/utilities.sass
+// We can change the theme color here by pre-setting the !base_color
+!base_color = #614DA3
+@import split_compliment_theme.sass
+
+html
+  :height 100%
+
+body#split-compliment
+  :margin 0
+  :height 100%
+  .base
+    :background-color = !base_color
+    .darker
+      :background-color = !base_dark_color
+    .lighter
+      :background-color = !base_light_color
+  .complement-support
+    :background-color = !complement_support_color
+    .darker
+      :background-color = !dark_complement_support_color
+    .lighter
+      :background-color = !light_complement_support_color
+  .complement-accent
+    :background-color = !complement_accent_color
+    .darker
+      :background-color = !dark_complement_accent_color
+    .lighter
+      :background-color = !light_complement_accent_color
+  .base, .complement-support, .complement-accent
+    +clearfix
+    :height 33%
+    div
+      :height 100%
+  .darker
+    :float left
+  .lighter
+    :float right
+  .darker, .lighter
+    :width 33%

data/examples/css3/extensions/compass-colors/lib/compass-colors.rb

@@ -0,0 +1,9 @@
+require 'compass'
+
+module Compass
+  module Colors
+  end
+end
+require File.join(File.dirname(__FILE__), 'compass-colors', 'hsl')
+require File.join(File.dirname(__FILE__), 'compass-colors', 'compass_extension')
+require File.join(File.dirname(__FILE__), 'compass-colors', 'sass_extensions')

data/examples/css3/extensions/compass-colors/lib/compass-colors/compass_extension.rb

@@ -0,0 +1,7 @@
+if defined?(Compass)
+  options = Hash.new
+  options[:stylesheets_directory] = File.expand_path(File.join(File.dirname(__FILE__), '..', '..', 'sass'))
+  options[:templates_directory]   = File.expand_path(File.join(File.dirname(__FILE__), '..', '..', 'templates'))
+
+  Compass::Frameworks.register('colors', options)
+end

data/examples/css3/extensions/compass-colors/lib/compass-colors/hsl.rb

@@ -0,0 +1,109 @@
+module Compass
+  module Colors
+    class HSL
+
+      # Stored in degrees [0, 360)
+      attr_reader :h
+      # Stored as a number from [0,1]
+      attr_reader :s, :l
+
+      def self.from_color(color)
+        rgb = color.respond_to?(:rgb) ? color.rgb : color.value
+        from_rgb(*rgb)
+      end
+
+      def self.from_rgb(r, g, b)
+        rgb = [r,g,b]
+        rgb.map!{|c| c / 255.0}
+        min_rgb = rgb.min
+        max_rgb = rgb.max
+        delta = max_rgb - min_rgb
+
+        lightness = (max_rgb + min_rgb) / 2.0
+
+        if delta < 1e-5
+           hue = 0
+           saturation = 0
+        else
+           saturation = if ( lightness < 0.5 )
+              delta / ( max_rgb + min_rgb )
+           else
+             delta / ( 2 - max_rgb - min_rgb )
+           end
+
+           deltas = rgb.map{|c| (((max_rgb - c) / 6.0) + (delta / 2.0)) / delta}
+
+           hue = if (rgb[0] - max_rgb).abs < 1e-5
+             deltas[2] - deltas[1]
+           elsif (rgb[1] - max_rgb).abs < 1e-5
+             ( 1.0 / 3.0 ) + deltas[0] - deltas[2]
+           else
+             ( 2.0 / 3.0 ) + deltas[1] - deltas[0]
+           end
+           hue += 1 if hue < 0
+           hue -= 1 if hue > 1
+         end
+         from_fractions(hue, saturation, lightness)
+      end
+
+      def self.from_fractions(hue, saturation, lightness)
+        HSL.new(360 * hue, saturation, lightness)
+      end
+
+      def initialize(h, s, l)
+        self.h = h
+        self.s = s
+        self.l = l
+      end
+
+      def to_color
+        m2 = l <= 0.5 ? l * (s + 1) : l + s - l * s
+        m1 = l * 2 - m2
+        Sass::Script::Color.new([hue_to_rgb(m1, m2, hp + 1.0/3),
+                                 hue_to_rgb(m1, m2, hp),
+                                 hue_to_rgb(m1, m2, hp - 1.0/3)].map { |c| (c * 0xff).round })
+      end
+
+      def h=(hue)
+        @h = hue % 360
+      end
+
+      def s=(saturation)
+        @s = if saturation < 0
+          0.0
+        elsif saturation > 1
+          1.0
+        else
+          saturation
+        end
+      end
+
+      def l=(lightness)
+        @l = if lightness < 0
+          0.0
+        elsif lightness > 1
+          1.0
+        else
+          lightness
+        end
+      end
+
+      private
+      #hue as a percentage
+      def hp
+        h / 360.0
+      end
+      # helper for making rgb
+      def hue_to_rgb(m1, m2, h)
+        h += 1 if h < 0
+        h -= 1 if h > 1
+        return m1 + (m2 - m1) * h * 6 if h * 6 < 1
+        return m2 if h * 2 < 1
+        return m1 + (m2 - m1) * (2.0/3 - h) * 6 if h * 3 < 2
+        return m1
+      end
+
+    end
+  end
+end
+

data/examples/css3/extensions/compass-colors/lib/compass-colors/sass_extensions.rb

@@ -0,0 +1,112 @@
+require 'sass'
+
+module Sass::Script::Functions
+  module Colors
+    extend self
+    def rgb_value(color)
+      if color.respond_to?(:rgb)
+        color.rgb
+      else
+        color.value
+      end
+    end
+  end
+  # Takes a color object and amount by which to lighten it (0 to 100).
+  def lighten(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.l += amount.value / 100.0
+    hsl.to_color
+  end
+
+  # Takes a color object and percent by which to lighten it (0 to 100).
+  def lighten_percent(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.l += (1 - hsl.l) * (amount.value / 100.0)
+    hsl.to_color
+  end
+
+  # Takes a color object and amount by which to darken it (0 to 100).
+  def darken(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.l -= amount.value / 100.0
+    hsl.to_color
+  end
+
+  # Takes a color object and percent by which to darken it (0 to 100).
+  def darken_percent(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.l *= 1.0 - (amount.value / 100.0)
+    hsl.to_color
+  end
+
+  # Saturate (make a color "richer") a color by the given amount (0 to 100)
+  def saturate(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.s += amount.value / 100.0
+    hsl.to_color
+  end
+
+  # Saturate (make a color "richer") a color by the given percent (0 to 100)
+  def saturate_percent(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.s += (1 - hsl.s) * (amount.value / 100.0)
+    hsl.to_color
+  end
+
+  # Desaturate (make a color "grayer") a color by the given amount (0 to 100)
+  def desaturate(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.s -= amount.value / 100.0
+    hsl.to_color
+  end
+
+  # Desaturate (make a color "grayer") a color by the given percent (0 to 100)
+  def desaturate_percent(color, amount)
+    hsl = Compass::Colors::HSL.from_color(color)
+    hsl.s *= (1.0 - (amount.value / 100.0))
+    hsl.to_color
+  end
+
+  # Return the hue of a color as a number between 0 and 360
+  def hue(color)
+    Sass::Script::Number.new(Compass::Colors::HSL.from_color(color).h.round)
+  end
+
+  # Return the saturation of a color as a number between 0 and 100
+  def saturation(color)
+    Sass::Script::Number.new((Compass::Colors::HSL.from_color(color).s * 100).round)
+  end
+
+  # Return the luminosity of a color as a number between 0 and 100
+  def luminosity(color)
+    Sass::Script::Number.new((Compass::Colors::HSL.from_color(color).l * 100).round)
+  end
+  alias lightness luminosity
+
+  # Mixes two colors by some amount (0 to 100). Defaults to 50.
+  def mix(color1, color2, amount = nil)
+    percent = amount ? amount.value.round / 100.0 : 0.5
+    new_colors = Colors.rgb_value(color1).zip(Colors.rgb_value(color2)).map{|c1, c2| (c1 * percent) + (c2 * (1 - percent))}
+    Sass::Script::Color.new(new_colors)
+  end
+
+  # Returns the grayscale equivalent color for the given color
+  def grayscale(color)
+    hsl = Compass::Colors::HSL.from_color(color)
+    g = (hsl.l * 255).round
+    Sass::Script::Color.new([g, g, g])
+  end
+
+  # adjust the hue of a color by the given number of degrees.
+  def adjust_hue(color, degrees)
+    hsl = Compass::Colors::HSL.from_color(color)
+    degrees = degrees.value.to_f.round if degrees.is_a?(Sass::Script::Literal)
+    hsl.h += degrees
+    hsl.to_color
+  end
+
+  def complement(color)
+    adjust_hue color, 180
+  end
+
+end