Merge branch 'master' of github.com:chriseppstein/compass

Gemfile

@@ -7,8 +7,11 @@ gem "rails", "~>3.0.0.rc"
 gem "compass-validator", "3.0.0"
 gem "css_parser", "~> 1.0.1"
 gem "sass"
+gem "haml", "~> 3.1.alpha"
 gem "rcov"
 gem "rubyzip"
 gem "livereload"
 gem "chunky_png", "~> 0.10.1"
-gem "ruby-prof"
+
+gem "ruby-prof" unless RUBY_PLATFORM == "java"
+

Rakefile

@@ -61,7 +61,7 @@ task :examples do
     puts "=" * "Compiling #{example}".length
     Dir.chdir example do
       load "bootstrap.rb" if File.exists?("bootstrap.rb")
-      Compass::Exec::SwitchUI.new(["--force"]).run!
+      Compass::Exec::SubCommandUI.new(%w(compile --force)).run!
     end
     # compile any haml templates to html
     FileList["#{example}/**/*.haml"].each do |haml_file|

doc-src/Gemfile

@@ -8,7 +8,7 @@ gem 'mime-types'
 gem 'serve', "1.0.0"
 gem 'nokogiri'
 gem 'coderay'
-gem 'sass', ">= 3.1.0.alpha.50", :git => "git://github.com/chriseppstein/sass.git"
+gem 'sass', ">= 3.1.0.alpha.50"
 gem 'fssm', '0.1.2'
 gem 'haml', ">= 3.1.0.alpha.36"
 gem 'rake'

doc-src/Gemfile.lock

@@ -5,16 +5,10 @@ GIT
     nanoc3 (3.2.0a3)
       cri (>= 1.0.0)
 
-GIT
-  remote: git://github.com/chriseppstein/sass.git
-  revision: c9de58c678644ec9b0ae5103ab595815e5aa4ecf
-  specs:
-    sass (3.1.0.alpha.50)
-
 PATH
   remote: ..
   specs:
-    compass (0.11.alpha.4.02d6292)
+    compass (0.11.alpha.4.d67a43a)
       chunky_png (~> 0.10.3)
       sass (>= 3.1.0.alpha.50)
 
@@ -40,6 +34,7 @@ GEM
     rake (0.8.7)
     rdiscount (1.6.5)
     ruby-prof (0.9.2)
+    sass (3.1.0.alpha.214)
     serve (1.0.0)
       activesupport (~> 3.0.1)
       i18n (~> 0.4.1)
@@ -67,6 +62,6 @@ DEPENDENCIES
   rake
   rdiscount
   ruby-prof
-  sass (>= 3.1.0.alpha.50)!
+  sass (>= 3.1.0.alpha.50)
   serve (= 1.0.0)
   thor

doc-src/assets/javascripts/site.js

@@ -109,7 +109,7 @@ $('document').ready(function(){
       changeTheme();
       event.preventDefault();
 
-    // View source for mixins
+    // View source for mixins & functions
     } else if (target.attr("rel") == "view source") {
       $(target.attr("href")).toggle();
       event.preventDefault();

doc-src/content/CHANGELOG.markdown

@@ -26,6 +26,16 @@ The Documentation for the [latest preview release](http://beta.compass-style.org
   The CLI options will still override the values set within the config file, but they might
   inform other values. For instance `compass compile -e production` will have the environment
   parameter preset to `:production` so that you can set other values in the project accordingly.
+* New infrastructure for supporting experimental css3 functions that are prefixed but have the same
+  syntax across all browsers. It is now possible to configure which browsers support which
+  experimental functions outside of the compass release cycle. For details, see the
+  [cross browser helpers](/reference/compass/helpers/cross-browser/).
+* [Blueprint] Added a new sass function called span($n) to the grid module which replaces
+  the now **deprecated span mixin**. If you are using this mixin, please replace it with:
+  `width: span($n)`.
+* [Blueprint] Blueprint no longer adds `!important` to the widths of `input`, `textarea`,
+  and `select` form fields, so compass no longer defaults to using `!important` in those cases.
+  If you were relying on this behavior, you may need to adjust your stylesheets accordingly.
 
 
 0.11.alpha.4 (12/08/2010)

doc-src/content/examples/compass/css3/gradient.haml

@@ -1,8 +1,8 @@
 ---
-title: Gradient
+title: Background Gradients
 description: css3 mixin for css gradients
 framework: compass
-stylesheet: compass/css3/_gradient.scss
+stylesheet: compass/css3/_images.scss
 example: true
 ---
 = render "partials/example"

doc-src/content/examples/compass/css3/gradient/stylesheet.sass

@@ -14,30 +14,30 @@
 
 // This will yield a radial gradient with an apparent specular highlight  
 #radial-gradient
-  +radial-gradient(color-stops(#00FFFF 10px, #1E90FF 30px), 45 45)
+  +background-image(radial-gradient(45 45, #0ff 10px, #1e90ff 30px))
 
 // This yields a linear gradient spanning from the upper left corner to the lower right corner
 #linear-gradient
-  +linear-gradient(color-stops(#fff, #ddd), left top)
+  +background-image(linear-gradient(left top, #fff, #ddd))
 
 // This yields a gradient starting at the top with #fff, ending in #aaa  
 #v-gradient
-  +linear-gradient(color-stops(#fff, #aaa))
+  +background-image(linear-gradient(#fff, #aaa))
 
 // Same as above but with a #ccc at the halfway point  
 #v-gradient-2
-  +linear-gradient(color-stops(#fff, #ccc, #aaa))
+  +background-image(linear-gradient(#fff, #ccc, #aaa))
 
 // Same as the first example but with #ccc at the 30% from the top, and #bbb at 70% from the top  
 #v-gradient-3
-  +linear-gradient(color-stops(#fff, #ccc 30%, #bbb 70%, #aaa))
+  +background-image(linear-gradient(#fff, #ccc 30%, #bbb 70%, #aaa))
 
 // This yields a horizontal linear gradient spanning from left to right.
 #h-gradient
-  +linear-gradient(color-stops(#fff, #ddd), left)
+  +background-image(linear-gradient(left, #fff, #ddd))
 
 #svg-gradient
   $experimental-support-for-svg: true
-  +linear-gradient(color-stops(#2AC363, #CD8C14, #9C4CC2), left)
+  +background-image(linear-gradient(left, #2ac363, #cd8c14, #9c4cc2))
   width: 80px
   height: 80px

doc-src/content/help/tutorials/contributing.markdown

@@ -34,10 +34,10 @@ Here's some general information about the project you might find useful along th
 
 * [Submitting Patches](#patches)
 * [Project Structure](#project-structure)
-* Project Architecture
+<!-- * Project Architecture
   * [Command Line](/help/tutorials/command-line)
   * [Extensions](/help/tutorials/extensions)
-  * [Configuration](help/tutorials/configuration-reference)
+  * [Configuration](help/tutorials/configuration-reference) -->
 * [General Philosophy](#project-philosophy)
 * [Stylesheet Conventions](#stylesheet-conventions)
 * [Miscellaneous Stuff](#faq)

doc-src/content/help/tutorials/spriting.markdown

@@ -146,9 +146,11 @@ this in mind.
 
 ## Large numbers of sprites
 The magic stylesheet can get very large when there are large numbers of sprites. 50 sprites
-will cause there to be over 150 variables created and then passed into the `sprite` function.
+will cause there to be over 150 variables created and then passed into the
+`sprite-map` [function](/reference/compass/helpers/sprites/#sprite-map).
 You may find that customizing the sprite function call to only pass those values that you
-are overriding will provide a performance boost.
+are overriding will provide a small performance boost.
+See a [concrete example](https://gist.github.com/747970).
 
 ## Oily PNG
 

doc-src/content/index.haml

@@ -10,13 +10,18 @@ layout: homepage
   .compass
     %h4 Why designers love Compass.
     %ol
-      %li Get cleaner markup with no presentational classes.
+      %li Experience cleaner markup without presentational classes.
       %li It’s chock full of the web’s best reusable patterns.
       %li Developing a personal framework is simple. 
       %li Compass mixins make CSS3 easy.
+      %li Download and create extensions with ease.
   .sass
     %h4 Compass uses Sass.
-    %p <a href="http://sass-lang.com/">Sass</a> is an extension of CSS3 which adds nested rules, variables, mixins, selector inheritance, and more. Sass generates well formatted CSS.
+    %p
+      <a href="http://sass-lang.com/">Sass</a> is an extension of CSS3 which
+      adds nested rules, variables, mixins, selector inheritance, and more.
+      Sass generates well formatted CSS and makes your stylesheets
+      easier to organize and maintain.
 %h3 Brilliant people use Compass, including these <em>wildly talented</em> folks:
 %ul#featured_sites
   %li

doc-src/content/index/functions.haml

@@ -0,0 +1,24 @@
+---
+title: Compass Documentation | All Functions
+crumb: Docs
+body_id: home
+---
+%article
+  %h1#logo Sass Based Functions
+  
+  - all_functions.sorted_and_grouped_by_name{|f| f.last.name }.each do |(group, functions)|
+    %h3= group
+    %ul
+      - functions.each do |(i, f)|
+        %li
+          %a{:href=>"#{i.path}#function-#{f.name}"}= f.sass_signature(:html)
+
+  %h1#logo All Ruby Based Functions
+  %ul
+    - Sass::Script::Functions.public_instance_methods.sort_by{|m| m.to_s}.each do |m|
+      %li
+        - name = m.to_s.gsub("_","-")
+        - if i = item_for_function_name(name)
+          %a{:href=>"#{i.path}##{name}"}= name
+        - else
+          = name

doc-src/content/index/mixins.haml

@@ -6,9 +6,9 @@ body_id: home
 %article
   %h1#logo Compass Mixins
   
-  - all_mixins.sort_by{|i| i.first.identifier}.each do |item, mixins|
-    %h3= link_to item[:title], item
+  - all_mixins.sorted_and_grouped_by_name{|m| m.last.name }.each do |(group, mixins)|
+    %h3= group
     %ul
-      - mixins.sort_by{|m| m.name}.each do |m|
-        %li= mixin_signature(m)
-
+      - mixins.each do |(i, m)|
+        %li
+          %a{:href=>"#{i.path}#mixin-#{m.name}"}= m.sass_signature(:none, :html)

doc-src/content/index/variables.haml

@@ -6,10 +6,10 @@ body_id: home
 %article
   %h1#logo Compass Variables
   
-  - all_constants.sort_by{|i| i.first.identifier}.each do |item, constants|
-    %h3= link_to item[:title], item
+  - all_constants.sorted_and_grouped_by_name{|v| v.last.name }.each do |(group, variables)|
+    %h3= group
     %ul
-      - constants.sort_by{|c| c.name}.each do |c|
-        %li $#{c.name}
-
+      - variables.each do |(i, v)|
+        %li
+          %a{:href=>"#{i.path}#const-#{v.name}"}= "$" + v.name
   

doc-src/content/reference/compass/css3/gradient.haml

@@ -12,13 +12,8 @@ classnames:
   - css3
 ---
 - render 'reference' do
-  %p
+  :markdown
+    **<span class="warning">IMPORTANT:</span>** This module has been deprecated. See the new
+    [images module](../images/) for the new, more flexible approach to gradients.
+    
     Provides mixins to create cross-browser CSS3 gradients.
-  %p
-    To enable SVG gradient support in Opera and IE9, set
-    <code>$experimental-support-for-svg: true</code> in your stylesheet.
-  %p
-    NOTE: At this time, Opera renders incorrectly an SVG background on a element
-    with a border, repeating the gradient towards the end. You can set
-    <code>background-repeat: no-repeat</code> to avoid this, but the gradient
-    will not fill the area completely.

doc-src/content/reference/compass/css3/images.haml

@@ -12,6 +12,33 @@ classnames:
   - css3
 ---
 - render 'reference' do
-  %p
+  :markdown
     Provides mixins that work across many modern browsers with the latest
     CSS3 image rendering primitives.
+    
+    These mixins provide intelligent cross-browser access to properties that accept
+    images or image-like values (e.g. gradients). The syntax is very straightforward,
+    it is exactly like the css syntax that you would use for the corresponding CSS3
+    properties: Values are comma and space delimited, just as they would be for a property.
+    Vendor prefixes are used only when necessary.
+    
+    Example (more examples are available by following the links below):
+    
+    <pre><code class="source-code scss">.in-css3 {
+      background: image-url("foo.png"),
+                  linear-gradient(top left, #333, #0c0),
+                  radial-gradient(#c00, #fff 100px);
+    }
+    .with-compass {
+      @include background(image-url("foo.png"),
+                          linear-gradient(top left, #333, #0c0),
+                          radial-gradient(#c00, #fff 100px));
+    }</code></pre>
+        
+    To enable SVG gradient support in Opera and IE9, set
+    <code>$experimental-support-for-svg: true</code> in your stylesheet.
+    
+    NOTE: At this time, Opera renders incorrectly an SVG background on a element
+    with a border, repeating the gradient towards the end. You can set
+    <code>background-repeat: no-repeat</code> to avoid this, but the gradient
+    will not fill the area completely.

doc-src/content/reference/compass/helpers.haml

@@ -35,9 +35,18 @@ layout: core
   * [inline-font-files()](/reference/compass/helpers/inline-data/#inline-font-files)
   * [inline-image()](/reference/compass/helpers/inline-data/#inline-image)
   * [nest()](/reference/compass/helpers/selectors/#nest)
+  * [prefix()](/reference/compass/helpers/cross-browser/#prefix)
+  * [prefixed()](/reference/compass/helpers/cross-browser/#prefixed)
   * [pi()](/reference/compass/helpers/trig/#pi)
   * [sin()](/reference/compass/helpers/trig/#sin)
   * [stylesheet-url()](/reference/compass/helpers/urls/#stylesheet-url)
   * [scale-lightness()](/reference/compass/helpers/colors/#scale-lightness)
   * [tan()](/reference/compass/helpers/trig/#tan)
+  * [-css2()](/reference/compass/helpers/cross-browser/#-css2)
+  * [-moz()](/reference/compass/helpers/cross-browser/#-moz)
+  * [-ms()](/reference/compass/helpers/cross-browser/#-ms)
+  * [-o()](/reference/compass/helpers/cross-browser/#-o)
+  * [-pie()](/reference/compass/helpers/cross-browser/#-pie)
+  * [-svg()](/reference/compass/helpers/cross-browser/#-svg)
+  * [-webkit()](/reference/compass/helpers/cross-browser/#-webkit)
 

doc-src/content/reference/compass/helpers/color-stops.haml

@@ -8,6 +8,8 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "color-stops"
 ---
 %h1 Compass Color Stops Helper
 

doc-src/content/reference/compass/helpers/colors.haml

@@ -8,6 +8,11 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "adjust-lightness"
+  - "adjust-saturation"
+  - "scale-lightness"
+  - "scale-saturation"
 ---
 %h1 Compass Color Helpers
 %p

doc-src/content/reference/compass/helpers/constants.haml

@@ -8,6 +8,8 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "opposite-position"
 ---
 %h1 Compass Constant Helpers
 

doc-src/content/reference/compass/helpers/cross-browser.haml

@@ -0,0 +1,114 @@
+--- 
+title: Compass Cross Browser Helpers
+crumb: Cross Browser
+framework: compass
+meta_description: Helper functions for working with vendor prefixed functions.
+layout: core
+classnames:
+  - reference
+  - core
+  - helpers
+documented_functions:
+  - "prefixed"
+  - "prefix"
+  - "-webkit"
+  - "-moz"
+  - "-o"
+  - "-ms"
+  - "-svg"
+  - "-pie"
+  - "-css2"
+---
+%h1 Compass Cross Browser Helpers
+
+:markdown
+  These helpers are used by compass to create mixins that can insulate
+  the user from cross browser syntax and vendor prefix complexities.
+  
+  If you need to support a new experimental (prefixed) function in your
+  project using these helpers, you can add support for it adding the following
+  to your compass configuration file:
+  
+      Compass::BrowserSupport.add_support("function-name", "webkit", "moz")
+
+  For an example of how to use these functions see the
+  [compass images module](https://github.com/chriseppstein/compass/blob/master/frameworks/compass/stylesheets/compass/css3/_images.scss).
+
+#prefixed.helper
+  %h3
+    %a(href="#prefixed")
+      prefixed(<span class="arg">$prefix<span>, <span class="arg">$arg</span>, ...)
+  .details
+    %p
+      Returns true if any of the arguments require the given prefix.
+
+#prefix.helper
+  %h3
+    %a(href="#prefix")
+      prefix(<span class="arg">$prefix<span>, <span class="arg">$arg</span>, ...)
+  .details
+    %p
+      Transforms the argument(s) into a representation for the rendering engine
+      indicated by <code>$prefix</code>. Usually this means just adding a prefix,
+      but in some cases, this may result in entirely different representations for
+      the given rendering engine (E.g. linear-gradient).
+    %p
+      Values that do not have a specific representation are passed through without
+      being transformed.
+
+#-webkit.helper
+  %h3
+    %a(href="#-webkit")
+      \-webkit(<span class="arg">$arg</span>, ...)
+  .details
+    %p
+      This is a shortcut for calling <code>prefix(-webkit, $arg, ...)</code>.
+#-moz.helper
+  %h3
+    %a(href="#-moz")
+      \-moz(<span class="arg">$arg</span>, ...)
+  .details
+    %p
+      This is a shortcut for calling <code>prefix(-moz, $arg, ...)</code>.
+#-o.helper
+  %h3
+    %a(href="#-o")
+      \-o(<span class="arg">$arg</span>, ...)
+  .details
+    %p
+      This is a shortcut for calling <code>prefix(-o, $arg, ...)</code>.
+#-ms.helper
+  %h3
+    %a(href="#-ms")
+      \-ms(<span class="arg">$arg</span>, ...)
+  .details
+    %p
+      This is a shortcut for calling <code>prefix(-ms, $arg, ...)</code>.
+#-svg.helper
+  %h3
+    %a(href="#-svg")
+      \-svg(<span class="arg">$arg</span>, ...)
+  .details
+    %p
+      This is a shortcut for calling <code>prefix(-svg, $arg, ...)</code>.
+      Instead of adding a prefix, it returns a representation of the
+      arguments using SVG to render them where it can.
+#-pie.helper
+  %h3
+    %a(href="#-pie")
+      \-pie(<span class="arg">$arg</span>, ...)
+  .details
+    %p
+      This is a shortcut for calling <code>prefix(-pie, $arg, ...)</code>.
+      It it used to get <a href="/reference/compass/css3/pie/">CSS3 PIE</a>
+      support where necessary.
+#-css2.helper
+  %h3
+    %a(href="#-css2")
+      \-css2(<span class="arg">$arg</span>, ...)
+  .details
+    %p
+      This is a shortcut for calling <code>prefix(-css2, $arg, ...)</code>.
+      It is a kind of hack to sanitize the output of experimental code
+      into a form that can be parsed by a css2.1 compliant parser.
+      Usually this results in causing some functions to be omitted.

doc-src/content/reference/compass/helpers/display.haml

@@ -8,6 +8,8 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "elements-of-type"
 ---
 %h1 Compass Display Helpers
 

doc-src/content/reference/compass/helpers/font-files.haml

@@ -8,6 +8,8 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "font-files"
 ---
 %h1 Compass Font Files Helper
 

doc-src/content/reference/compass/helpers/image-dimensions.haml

@@ -8,6 +8,9 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "image-width"
+  - "image-height"
 ---
 %h1 Compass Image Dimension Helpers
 

doc-src/content/reference/compass/helpers/inline-data.haml

@@ -8,6 +8,9 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "inline-image"
+  - "inline-font-files"
 ---
 %h1 Compass Inline Data Helpers
 

doc-src/content/reference/compass/helpers/selectors.haml

@@ -8,6 +8,12 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "nest"
+  - "append-selector"
+  - "enumerate"
+  - "headings"
+  - "headers"
 ---
 %h1 Compass Selector Helpers
 
@@ -67,6 +73,7 @@ classnames:
       %li
         %a(href="/examples/compass/helpers/using-extend-in-place-of-enumerate/") Example of using <code>@extend</code> in place of enumerate
 
+%a(name="headers")
 #headings.helper
   %h3
     %a(href="#append-selector")

doc-src/content/reference/compass/helpers/sprites.haml

@@ -8,6 +8,13 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "sprite-map"
+  - "sprite"
+  - "sprite-map-name"
+  - "sprite-file"
+  - "sprite-url"
+  - "sprite-position"
 ---
 %h1 Compass Sprite Helpers
 

doc-src/content/reference/compass/helpers/trig.haml

@@ -8,6 +8,11 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "pi"
+  - "sin"
+  - "cos"
+  - "tan"
 ---
 %h1 Compass Trig Helpers
 

doc-src/content/reference/compass/helpers/urls.haml

@@ -8,6 +8,10 @@ classnames:
   - reference
   - core
   - helpers
+documented_functions:
+  - "stylesheet-url"
+  - "font-url"
+  - "image-url"
 ---
 %h1 Compass URL Helpers
 

doc-src/content/search.haml

@@ -30,5 +30,15 @@ body_id: search
     }
 %input#q{:type => "text", :placeholder=>"Search"}
 
+%h2 Index of all:
+%ul#indexes
+  %li
+    %a(href="/index/variables/") Variables
+  %li
+    %a(href="/index/mixins/") Mixins
+  %li
+    %a(href="/index/functions/") Functions
+
+%h2 Results
 %ol#results
   %li.none Please enter a search term.

doc-src/content/stylesheets/partials/_code.scss

@@ -1,18 +1,18 @@
 //html.sass .mixin-source .scss, html.scss .mixin-source .sass { @extend .hide;}
-.mixin-source, .example-source {
+.mixin-source, .example-source, .function-source {
   position: relative; @extend .fixed-font;
   .syntaxhighlighter, pre {
   &.scss, &.sass, &.css, &.haml, &.html { display: none; } } }
 
-html.sass { .mixin-source .syntaxhighlighter.sass, .example-source .syntaxhighlighter.sass { display: block; } }
-html.scss { .mixin-source .syntaxhighlighter.scss, .example-source .syntaxhighlighter.scss { display: block; } }
+html.sass { .mixin-source, .example-source, .function-source { .syntaxhighlighter.sass { display: block; } } }
+html.scss { .mixin-source, .example-source, .function-source { .syntaxhighlighter.scss { display: block; } } }
 html.css .example-source .syntaxhighlighter.css { display: block; }
 html.html .example-source .syntaxhighlighter.html { display: block; }
 html.haml .example-source .syntaxhighlighter.haml { display: block; }
 
 
 
-.mixin-source { display: none; }
+.mixin-source, .function-source { display: none; }
 
 html.light .syntaxhighlighter, html.dark .syntaxhighlighter {
   margin: 0 0 2px;
@@ -59,7 +59,7 @@ h3 { @include round-corners;
   a { text-decoration: none;}
   code, .arg { font-weight: normal; }
 }
-h3.mixin { @include round-top-corners; margin-bottom: 2px;}
+h3.mixin, h3.function { @include round-top-corners; margin-bottom: 2px;}
 .arg {
   display: inline-block;
   padding: 0 2px;

doc-src/content/stylesheets/partials/_theme.scss

@@ -74,7 +74,7 @@
   &.sass a[rel=sass], &.scss a[rel=scss], &.css a[rel=css], &.html a[rel=html], &.haml a[rel=haml] { color: $heading; color: rgba($heading, .7); @extend .round-corners-em; @extend .inset-panel-#{$theme}; }
 
   #version { color: rgba($heading, .3); a { color: rgba($nav-link, .7); } }
-  .mixin-source, .example-source { @extend .mixin-panel-#{$theme};
+  .mixin-source, .example-source, .function-source { @extend .mixin-panel-#{$theme};
     .container textarea { color: $code; }
   }
   h2 a.help { color: $heading;}

doc-src/content/stylesheets/partials/_typography.scss

@@ -42,3 +42,5 @@ em { font-style: italic; }
 
 dl.table dt, dl.table dd { display: inline-block; }
 dg { display: block; margin-bottom: 1.5em; }
+
+.warning { color: #c00; }

doc-src/layouts/partials/main-navigation.haml

@@ -7,7 +7,7 @@
       %li.vcard
         %a.fn.org.url.uid{:href => "/", :rel => "home"} Home
       %li
-        %a{:href => "/reference/compass/", :rel => "documentation"} Docs
+        %a{:href => "/reference/compass/", :rel => "documentation"} Reference
       %li
         %a{:href => "/help", :rel=> "help"} Help
       %li

doc-src/layouts/partials/reference/functions.haml

@@ -0,0 +1,19 @@
+- if (functions = functions(@item)).any?
+  %h2 Functions
+
+  - functions.each do |function|
+    %a{:href=>"#function-#{function.name}-source", :rel => "view source"} view source
+    %h3.function{:id=>"function-#{function.name}"}
+      %a.permalink{:href => "#function-#{function.name}"}= function.sass_signature(:html)
+    .function-source{:id=>"function-#{function.name}-source"}
+      %pre.source-code.sass= function.to_sass
+      %pre.source-code.scss= function.to_scss
+
+    .source-documentation
+      = format_doc(function.comment)
+      - if (examples = examples(@item, function)).any?
+        %dl.examples
+          - examples.each do |example|
+            %dt= link_to example.item[:title], example
+            - if example.item[:description]
+              %dd= example.item[:description]

doc-src/layouts/partials/reference/mixins.haml

@@ -4,7 +4,7 @@
   - mixin_defs.each do |mixin|
     %a{:href=>"#mixin-#{mixin.name}-source", :rel => "view source"} view source
     %h3.mixin{:id=>"mixin-#{mixin.name}"}
-      %a.permalink{:href => "#mixin-#{mixin.name}"}= mixin_signature(mixin)
+      %a.permalink{:href => "#mixin-#{mixin.name}"}= mixin.sass_signature(:none, :html)
     .mixin-source{:id=>"mixin-#{mixin.name}-source"}
       %pre.source-code.sass= mixin.to_sass
       %pre.source-code.scss= mixin.to_scss

doc-src/layouts/reference.haml

@@ -20,4 +20,6 @@
 
 = render "partials/reference/constants"
 
+= render "partials/reference/functions"
+
 = render "partials/reference/mixins"

doc-src/lib/default.rb

@@ -28,6 +28,12 @@ def body_attributes(item)
   }
 end
 
+module Enumerable
+  def sorted_and_grouped_by_name
+    sort_by{|i| yield(i)}.group_by{|i| yield(i).sub(/^[^\w]/,"")[0..0].upcase}
+  end
+end
+
 class Recycler
   attr_accessor :values
   attr_accessor :index

doc-src/lib/stylesheets.rb

@@ -118,6 +118,26 @@ def mixins(item)
   mixins.reject{|m| m.comment =~ /@private/}
 end
 
+def functions(item)
+  sass_tree = tree(item)
+  functions = []
+  comment = nil
+  sass_tree.children.each do |child|
+    if child.is_a?(Sass::Tree::FunctionNode)
+      child.comment = comment && Sass::Tree::CommentNode.clean(comment)
+      comment = nil
+      functions << child
+    elsif child.is_a?(Sass::Tree::CommentNode)
+      comment ||= ""
+      comment << "\n" unless comment.empty?
+      comment << child.docstring
+    else
+      comment = nil
+    end
+  end
+  functions.reject{|m| m.comment =~ /@private/}
+end
+
 def constants(item)
   sass_tree = tree(item)
   constants = []
@@ -140,33 +160,27 @@ def constants(item)
 end
 
 def all_constants
-  variables = []
-  @items.each do |item|
-    next unless item.identifier =~ %r{/reference}
-    next unless item[:stylesheet]
-    vars = constants(item)
-    if vars.any?
-      variables << [item, vars]
+  @items.inject([]) do |variables, item|
+    next variables unless item.identifier =~ %r{/reference}
+    next variables unless item[:stylesheet]
+    variables += constants(item).map{|v| [item, v] }
   end
 end
-  variables
-end
 
 def all_mixins
-  all_mixins = []
-  @items.each do |item|
-    next unless item.identifier =~ %r{/reference}
-    next unless item[:stylesheet]
-    ms = mixins(item)
-    if ms.any?
-      all_mixins << [item, ms]
+  @items.inject([]) do |all_mixins, item|
+    next all_mixins unless item.identifier =~ %r{/reference}
+    next all_mixins unless item[:stylesheet]
+    all_mixins += mixins(item).map{|m| [item, m] }
   end
 end
-  all_mixins
-end
 
-def mixin_signature(mixin, format = :html)
-  mixin.sass_signature(:none, format)
+def all_functions
+  @items.inject([]) do |all_functions, item|
+    next all_functions unless item.identifier =~ %r{/reference}
+    next all_functions unless item[:stylesheet]
+    all_functions += functions(item).map{|f| [item, f] }
+  end
 end
 
 def example_items
@@ -177,6 +191,12 @@ def example_items
   end
 end
 
+def item_for_function_name(function_name)
+  @items.detect do |item|
+    (item.identifier =~ %r{helpers}) && item[:documented_functions] && item[:documented_functions].include?(function_name)
+  end
+end
+
 def examples_for_item(item)
   @site.cached("examples/#{item.identifier}") do
     example_items.select do |i|

doc-src/lib/stylesheets/sass_extensions.rb

@@ -19,18 +19,9 @@ module Sass
     class VariableNode < Node
       attr_accessor :comment unless method_defined? :comment
     end
-    class MixinDefNode < Node
-      attr_accessor :name unless method_defined? :name
-      attr_accessor :args unless method_defined? :args
-      attr_accessor :comment unless method_defined? :comment
-      def sass_signature(mode = :definition, format = :text)
-        prefix = case mode
-        when :definition
-          "="
-        when :include
-          "+"
-        end
-        "#{prefix}#{name}#{arglist_to_sass(format)}"
+    module HasSignature
+      def sass_signature(format = :text)
+        "#{name}#{arglist_to_sass(format)}"
       end
 
       private
@@ -57,6 +48,30 @@ module Sass
         sass_str
       end
     end
+    class MixinDefNode < Node
+      attr_accessor :name unless method_defined? :name
+      attr_accessor :args unless method_defined? :args
+      attr_accessor :comment unless method_defined? :comment
+      unless included_modules.include?(HasSignature)
+        include HasSignature
+        alias sass_signature_without_prefix sass_signature
+        def sass_signature(mode = :definition, format = :text)
+          prefix = case mode
+          when :definition
+            "="
+          when :include
+            "+"
+          end
+          "#{prefix}#{sass_signature_without_prefix(format)}"
+        end
+      end
+    end
+    class FunctionNode < Node
+      attr_accessor :name unless method_defined? :name
+      attr_accessor :args unless method_defined? :args
+      attr_accessor :comment unless method_defined? :comment
+      include HasSignature unless included_modules.include?(HasSignature)
+    end
     class ImportNode < RootNode
       attr_accessor :imported_filename unless method_defined? :imported_filename
     end

examples/blueprint_plugins/src/link_icons.scss

@@ -10,4 +10,4 @@ body {
   // Not all links have a url structure that can be detected,
   // So you can set them explicitly yourself like so:
   a#this-is-a-pdf-link {
-    @include link-icon(unquote("pdf.png")); } }
+    @include link-icon("pdf.png"); } }

examples/blueprint_semantic/src/liquid.scss

@@ -20,11 +20,11 @@ body.blueprint {
 
 body#index {
   #page-header {
-    @include span(6); }
+    width: span(6); }
   #files-header {
-    @include span(8); }
+    width: span(8); }
   #description-header {
-    @include span(10); }
+    width: span(10); }
   #info {
     @include box;
     ul {

examples/blueprint_semantic/src/screen.scss

@@ -9,7 +9,7 @@ body.blueprint {
   .container {
     @include container; }
   .showgrid {
-    background: inline_image(unquote("grid.png")); }
+    background: inline_image("grid.png"); }
   hr {
     @include colruler; }
   hr.space {
@@ -20,11 +20,11 @@ body.blueprint {
 
 body#index {
   #page-header {
-    @include span(6); }
+    width: span(6); }
   #files-header {
-    @include span(8); }
+    width: span(8); }
   #description-header {
-    @include span(10); }
+    width: span(10); }
   #info {
     @include box;
     ul {

examples/compass/config.rb

@@ -5,3 +5,4 @@ sass_dir = "src"
 images_dir = "images"
 output_style = :compact
 relative_assets = true
+line_comments = false

examples/compass/images/.gitignore

@@ -0,0 +1,2 @@
+flag-*.png
+emblem-*.png