compass 0.10.0.rc1 → 0.10.0.rc2

data/CHANGELOG.markdown

@@ -1,6 +1,29 @@
 COMPASS CHANGELOG
 =================
 
+0.10.0.rc2 (April 12, 2010)
+---------------------------
+**IMPORTANT:**
+
+* Compass now depends on Sass 3 -- Please be prepared to upgrade.
+  Things won't break but you'll have a lot of deprecation warnings.
+  Upgrading is pretty easy thanks to the `sass-convert` tool. See the
+  [Sass Changelog](http://beta.sass-lang.com/docs/yardoc/file.SASS_CHANGELOG.html)
+  for more information.
+* All compass stylesheets are now written in the SCSS syntax,
+  if you import compass framework stylesheets with an explicit
+  `.sass` extension, then you'll receive deprecation warnings
+  directing you to update your stylesheets.
+* A new command line switch `--syntax` (or `-x`) has been added
+  to commands that install stylesheets into your project that
+  allows you to select the syntax to use (scss or sass)
+* A new configuration option `preferred_syntax` now exists
+  and defaults to `:scss`. Please update your project's configuration
+  file with `preferred_syntax = :sass` if you prefer to use the
+  indentation-based syntax.
+* You may silence deprecation warnings by adding
+  `sass_options = {:quiet => true}` to your configuration.
+
 0.10.0.pre9 (March 6, 2010)
 ---------------------------
 

data/Rakefile

@@ -51,7 +51,7 @@ begin
     gemspec.description = "Compass is a Sass-based Stylesheet Framework that streamlines the creation and maintainance of CSS."
     gemspec.authors = ["Chris Eppstein"]
     gemspec.has_rdoc = false
-    gemspec.add_dependency('haml', '>= 2.2.14')
+    gemspec.add_dependency('haml', '>= 3.0.0.beta.2')
     gemspec.files = []
     gemspec.files << "CHANGELOG.markdown"
     gemspec.files << "README.markdown"
@@ -131,6 +131,18 @@ task :examples do
   end
 end
 
+namespace :examples do
+  desc "clean up the example directories"
+  task :clean do
+    puts "Cleaning Examples"
+    Dir.glob('examples/*/clean.rb').each do |cleaner|
+      load cleaner
+    end
+  end
+end
+
+task "gemspec:generate" => "examples:clean"
+
 namespace :git do
   task :clean do
     sh "git", "clean", "-fdx"

data/VERSION.yml

@@ -2,4 +2,4 @@
 :patch: 0
 :major: 0
 :minor: 10
-:build: rc1
+:build: rc2

data/examples/blueprint_default/src/ie.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-ie;

data/examples/blueprint_default/src/print.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-print;

data/examples/blueprint_default/src/{screen.sass → screen.scss}

@@ -1,8 +1,9 @@
-@import blueprint.sass
-@import blueprint/scaffolding.sass
-@import compass/reset.sass
+@import "blueprint";
+@import "blueprint/scaffolding";
+@import "compass/reset";
+
+@include blueprint;
 
-+blueprint
 // Remove the scaffolding when you're ready to start doing visual design.
 // Or leave it in if you're happy with how blueprint looks out-of-the-box
-+blueprint-scaffolding
+@include blueprint-scaffolding;

data/examples/blueprint_plugins/src/buttons.scss

@@ -0,0 +1,47 @@
+@import "compass/utilities/general/float";
+@import "blueprint/buttons";
+
+// Use the following HTML code to place the buttons on your site:
+//
+// <button type="submit" class="button positive">
+//   <img src="css/blueprint/plugins/buttons/icons/tick.png" alt=""/> Save
+// </button>
+//
+// <a class="button" href="/password/reset/">
+//   <img src="css/blueprint/plugins/buttons/icons/key.png" alt=""/> Change Password
+// </a>
+//
+// <a href="#" class="button negative">
+//   <img src="css/blueprint/plugins/buttons/icons/cross.png" alt=""/> Cancel
+// </a>
+
+a.button {
+  // you can pass "left" or "right" to +anchor-button to float it in that direction
+  // or you can pass no argument to leave it inline-block (cross browser safe!) within
+  // the flow of your page.
+  @include anchor-button(left);
+  // All the button color mixins take 4 optional arguments:
+  // font color, background color, border color, border highlight color
+  // the first three default to constants set in blueprint/buttons
+  // the last one defaults to a shade lighter than the border color.
+  @include button-colors;
+  @include button-hover-colors;
+  @include button-active-colors; }
+
+button {
+  // The +button-button mixin is just like the +anchor-button mixin, but for <button> elements.
+  @include button-button(left);
+  @include button-colors;
+  @include button-hover-colors;
+  @include button-active-colors; }
+
+// We can change the colors for buttons of certain classes, etc.
+a.positive, button.positive {
+  color: #529214;
+  @include button-hover-colors(#529214, #e6efc2, #c6d880);
+  @include button-active-colors(white, #529214, #529214); }
+
+a.negative, button.negative {
+  color: #d12f19;
+  @include button-hover-colors(#d12f19, #fbe3e4, #fbc2c4);
+  @include button-active-colors(white, #d12f19, #d12f19); }

data/examples/blueprint_plugins/src/ie.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-ie;

data/examples/blueprint_plugins/src/{link_icons.sass → link_icons.scss}

@@ -1,13 +1,13 @@
-@import blueprint/link_icons.sass
+@import "blueprint/link-icons";
 
 // This turns link icons on for all links. You can change the scoping selector from
 // body to something more specific if you prefer.
-body
-  +link-icons
+body {
+  @include link-icons;
   // Use this class if a link gets an icon when it shouldn't.
-  a.noicon
-    +no-link-icon
+  a.noicon {
+    @include no-link-icon; }
   // 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
-    +link-icon("pdf.png")
+  a#this-is-a-pdf-link {
+    @include link-icon(unquote("pdf.png")); } }

data/examples/blueprint_plugins/src/print.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-print;

data/examples/blueprint_plugins/src/rtl_screen.scss

@@ -0,0 +1,15 @@
+@import "blueprint";
+@import "blueprint/fancy-type";
+@import "blueprint/scaffolding";
+@import "blueprint/rtl";
+@import "compass/reset";
+
+@include blueprint;
+
+@include rtl-typography;
+
+@include fancy-type;
+
+// Remove the scaffolding when you're ready to start doing visual design.
+// Or leave it in if you're happy with how blueprint looks out-of-the-box
+@include blueprint-scaffolding;

data/examples/blueprint_plugins/src/screen.scss

@@ -0,0 +1,12 @@
+@import "blueprint";
+@import "blueprint/fancy-type";
+@import "blueprint/scaffolding";
+@import "compass/reset";
+
+@include blueprint;
+
+@include fancy-type;
+
+// Remove the scaffolding when you're ready to start doing visual design.
+// Or leave it in if you're happy with how blueprint looks out-of-the-box
+@include blueprint-scaffolding;

data/examples/blueprint_scoped/src/ie.scss

@@ -0,0 +1,4 @@
+@import "blueprint";
+
+body.bp {
+  @include blueprint-ie(true); }

data/examples/blueprint_scoped/src/print.scss

@@ -0,0 +1,4 @@
+@import "blueprint";
+
+body.bp {
+  @include blueprint-print(true); }

data/examples/blueprint_scoped/src/screen.scss

@@ -0,0 +1,5 @@
+@import "blueprint";
+@import "compass/reset";
+
+body.bp {
+  @include blueprint(true); }

data/examples/blueprint_scoped_form/src/ie.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-ie;

data/examples/blueprint_scoped_form/src/print.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-print;

data/examples/blueprint_scoped_form/src/screen.scss

@@ -0,0 +1,15 @@
+@import "blueprint";
+@import "compass/reset";
+
+@include blueprint-grid;
+
+@include blueprint-typography;
+
+@include blueprint-utilities;
+
+@include blueprint-debug;
+
+@include blueprint-interaction;
+
+form.blueprint {
+  @include blueprint-form; }

data/examples/blueprint_semantic/src/ie.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-ie;

data/examples/blueprint_semantic/src/liquid.scss

@@ -0,0 +1,69 @@
+@import "blueprint";
+@import "blueprint/fancy-type";
+@import "blueprint/scaffolding";
+@import "blueprint/liquid";
+@import "compass/reset";
+
+.container {
+  @include container; }
+
+body.blueprint {
+  @include blueprint-typography(true);
+  @include blueprint-scaffolding-body;
+  hr {
+    @include colruler; }
+  hr.space {
+    @include colspacer; }
+  img#w3c {
+    margin-top: 0;
+    padding-top: 0; } }
+
+body#index {
+  #page-header {
+    @include span(6); }
+  #files-header {
+    @include span(8); }
+  #description-header {
+    @include span(10); }
+  #info {
+    @include box;
+    ul {
+      margin-bottom: 0;
+      padding-bottom: 0; } } }
+
+body#sample {
+  @include fancy-paragraphs;
+  h2 {
+    @include alt; }
+  #first-box {
+    @include column(7);
+    @include colborder; }
+  #another-box {
+    @include column(8);
+    @include colborder; }
+  #aligned-box {
+    @include column(7, true); }
+  #main {
+    @include column(15);
+    @include prepend(1);
+    @include colborder;
+    img#test {
+      @include pull(1);
+      margin-top: 0;
+      padding-top: 0; }
+    em.caps {
+      @include reset-font;
+      @include caps; }
+    #nested-1 {
+      @include column(7);
+      @include colborder; }
+    #nested-2 {
+      @include column(7, true); } }
+  #sidebar {
+    @include column(7, true);
+    h3 {
+      em {
+        @include reset-font;
+        @include alt; } } }
+  #parting-thought {
+    @include alt; } }

data/examples/blueprint_semantic/src/print.scss

@@ -0,0 +1,3 @@
+@import "blueprint";
+
+@include blueprint-print;

data/examples/blueprint_semantic/src/screen.scss

@@ -0,0 +1,69 @@
+@import "blueprint";
+@import "blueprint/fancy-type";
+@import "blueprint/scaffolding";
+@import "compass/reset";
+
+body.blueprint {
+  @include blueprint-typography(true);
+  @include blueprint-scaffolding-body;
+  .container {
+    @include container; }
+  .showgrid {
+    background: inline_image(unquote("grid.png")); }
+  hr {
+    @include colruler; }
+  hr.space {
+    @include colspacer; }
+  img#w3c {
+    margin-top: 0;
+    padding-top: 0; } }
+
+body#index {
+  #page-header {
+    @include span(6); }
+  #files-header {
+    @include span(8); }
+  #description-header {
+    @include span(10); }
+  #info {
+    @include box;
+    ul {
+      margin-bottom: 0;
+      padding-bottom: 0; } } }
+
+body#sample {
+  @include fancy-paragraphs;
+  h2 {
+    @include alt; }
+  #first-box {
+    @include column(7);
+    @include colborder; }
+  #another-box {
+    @include column(8);
+    @include colborder; }
+  #aligned-box {
+    @include column(7, true); }
+  #main {
+    @include column(15);
+    @include prepend(1);
+    @include colborder;
+    img#test {
+      @include pull(1);
+      margin-top: 0;
+      padding-top: 0; }
+    em.caps {
+      @include reset-font;
+      @include caps; }
+    #nested-1 {
+      @include column(7);
+      @include colborder; }
+    #nested-2 {
+      @include column(7, true); } }
+  #sidebar {
+    @include column(7, true);
+    h3 {
+      em {
+        @include reset-font;
+        @include alt; } } }
+  #parting-thought {
+    @include alt; } }

data/examples/compass/clean.rb

@@ -0,0 +1,2 @@
+require 'fileutils'
+FileUtils.rm_rf "#{File.dirname(__FILE__)}/extensions"

data/examples/compass/src/compass.scss

@@ -0,0 +1,46 @@
+@mixin compass($s) {
+  position: relative;
+  width: 4 * $s;
+  height: 4 * $s;
+  font-size: 24px;
+  font-family: "Academy Engraved LET", "Papyrus";
+  .n, .s, .e, .w {
+    position: absolute;
+    width: $s;
+    height: $s;
+    text-align: center;
+    vertical-align: middle; }
+  .w {
+    left: 0px; }
+  .n.w, .s.w {
+    left: 0.5 * $s; }
+  .n, .s {
+    left: 1.5 * $s; }
+  .n.e, .s.e {
+    left: 2.5 * $s; }
+  .e {
+    left: 3 * $s; }
+  .n {
+    top: 0px; }
+  .n.w, .n.e {
+    top: 0.5 * $s; }
+  .w, .e {
+    top: 1.5 * $s; }
+  .s.w, .s.e {
+    top: 2.5 * $s; }
+  .s {
+    top: 3 * $s; } }
+
+.compass {
+  margin: 1em auto;
+  @include compass(4em);
+  .n, .s, .e, .w {
+    p {
+      margin: {
+        top: 1.5em;
+        bottom: 1.5em; }; } }
+  .n.w, .s.w, .n.e, .s.e {
+    p {
+      margin: {
+        top: 1em;
+        bottom: 1em; }; } } }