compass 0.10.0.rc1 → 0.10.0.rc2

data/frameworks/blueprint/stylesheets/blueprint/_form.scss

@@ -0,0 +1,56 @@
+@import "colors";
+
+// Mixin for producing Blueprint "inline" forms. Should be used with the blueprint-form mixin.
+@mixin blueprint-inline-form {
+  line-height: 3;
+  p {
+    margin-bottom: 0; } }
+
+@mixin blueprint-form {
+  @include blueprint-form-layout;
+  @include blueprint-form-borders;
+  @include blueprint-form-sizes; }
+
+@mixin blueprint-form-layout {
+  label {
+    font-weight: bold; }
+  fieldset {
+    padding: 1.4em;
+    margin: 0 0 1.5em 0; }
+  legend {
+    font-weight: bold;
+    font-size: 1.2em; }
+  input {
+    &.text, &.title, &[type=text], &[type=password] {
+      margin: 0.5em 0;
+      background-color: white;
+      padding: 5px; }
+    &.title {
+      font-size: 1.5em; }
+    &[type=checkbox], &.checkbox,
+    &[type=radio], &.radio {
+      position: relative;
+      top: 0.25em; } }
+  textarea {
+    margin: 0.5em 0;
+    padding: 5px; }
+  select {
+    margin: 0.5em 0; } }
+
+@mixin blueprint-form-sizes($input_width: 300px, $textarea_width: 390px, $textarea_height: 250px) {
+  input {
+    &.text, &.title, &[type=text], &[type=password] {
+      width: $input_width; } }
+  textarea {
+    width: $textarea_width;
+    height: $textarea_height; } }
+
+@mixin blueprint-form-borders($unfocused_border_color: #bbbbbb, $focus_border_color: #666666, $fieldset_border_color: #cccccc) {
+  fieldset {
+    border: 1px solid $fieldset_border_color; }
+  input.text, input.title, input[type=text], input[type=password],
+  textarea,
+  select {
+    border: 1px solid $unfocused_border_color;
+    &:focus {
+      border: 1px solid $focus_border_color; } } }

data/frameworks/blueprint/stylesheets/blueprint/_grid.scss

@@ -0,0 +1,244 @@
+//  --------------------------------------------------------------
+//  SASS Gridification
+//  * Author:   Chris Eppstein
+//  A SASS adaptation of Blueprint CSS
+//  * Version:         0.7.1 (2008-02-25)
+//  * Website:         http://code.google.com/p/blueprintcss/
+//  Based on work by:
+//  * Lorin Tackett     [lorintackett.com]
+//  * Olav Bjorkoy      [bjorkoy.com]
+//  * Nathan Borror     [playgroundblues.com]
+//  * Jeff Croft        [jeffcroft.com]
+//  * Christian Metts   [mintchaos.com]
+//  * Khoi Vinh         [subtraction.com]
+//  Read more about using a grid here:
+//  * http://www.subtraction.com/2007/03/18/oh-yeeaahh
+//  --------------------------------------------------------------
+
+@import "compass/utilities/general/float";
+
+// The number of columns in the grid.
+$blueprint_grid_columns: 24 !default;
+
+// The width of a column
+$blueprint_grid_width: 30px !default;
+
+// The amount of margin between columns
+$blueprint_grid_margin: 10px !default;
+
+// The width of a column including the margin. With default settings this is `40px`.
+$blueprint_grid_outer_width: $blueprint_grid_width + $blueprint_grid_margin;
+
+// The width of the container. With default settings this is `950px`.
+$blueprint_container_size: $blueprint_grid_outer_width * $blueprint_grid_columns - $blueprint_grid_margin;
+
+// Generates presentational class names that you can use
+// in your html to layout your pages.
+//
+// #### Note:
+// Best practices discourage using this mixin,
+// but it is provided to support legacy websites
+// and to test the sass port against blueprint's example pages.
+
+@mixin blueprint-grid {
+  // A container should group all your columns
+  .container {
+    @include container; }
+  .column, #{enumerate("div.span", 1, $blueprint_grid_columns)} {
+    @include column-base; }
+  // The last column in a row needs this class (or mixin) or it will end up on the next row.
+  .last, div.last {
+    @include last; }
+  // Use these classes (or mixins) to set the width of a column.
+  @for $n from 1 to $blueprint_grid_columns {
+    .span-#{$n} {
+      @include span($n); } }
+  .span-#{$blueprint_grid_columns}, div.span-#{$blueprint_grid_columns} {
+    @include span($blueprint_grid_columns);
+    margin: 0; }
+  input, textarea, select {
+    @for $n from 1 through $blueprint_grid_columns {
+      &.span-#{$n} {
+        @include span($n, true); } } }
+  // Add these to a column to append empty cols.
+  @for $n from 1 to $blueprint_grid_columns {
+    .append-#{$n} {
+      @include append($n); } }
+  // Add these to a column to prepend empty cols.
+  @for $n from 1 to $blueprint_grid_columns {
+    .prepend-#{$n} {
+      @include prepend($n); } }
+  // Use these classes on an element to push it into the
+  // next column, or to pull it into the previous column.
+  #{enumerate(".pull", 1, $blueprint_grid_columns)} {
+    @include pull-base; }
+  @for $n from 1 through $blueprint_grid_columns {
+    .pull-#{$n} {
+      @include pull-margins($n); } }
+  #{enumerate(".push", 1, $blueprint_grid_columns)} {
+    @include push-base; }
+  @for $n from 1 through $blueprint_grid_columns {
+    .push-#{$n} {
+      @include push-margins($n); } }
+  .prepend-top {
+    @include prepend-top; }
+  .append-bottom {
+    @include append-bottom; } }
+
+// A container for your columns.
+//
+// #### Note:
+// If you use this mixin without the class and want to support ie6
+// you must set text-align left on your container element in an IE stylesheet.
+@mixin container {
+  width: $blueprint_container_size;
+  margin: 0 auto;
+  @include clearfix; }
+
+// The last column in a row needs this mixin or it will end up
+// on the next row in some browsers.
+@mixin last {
+  margin-right: 0; }
+
+// Use this mixins to set the width of n columns.
+@mixin column($n, $last: false) {
+  @include column-base($last);
+  @include span($n); }
+
+// Set only the width of an element to align it with the grid.
+// Most of the time you'll want to use `+column` instead.
+//
+// This mixin is especially useful for aligning tables to the grid.
+@mixin span($n, $override: false) {
+  $width: $blueprint_grid_width * $n + $blueprint_grid_margin * ($n - 1);
+  @if $override {
+    width: $width !important; }
+  @else {
+    width: $width; } }
+
+// The basic set of styles needed to make an element
+// behave like a column:
+//
+// * floated to left
+// * gutter margin on the right (unless the last column)
+// * Some IE fixes
+//
+// #### Note:
+// This mixin gets applied automatically when using `+column`
+// so you probably don't need to use it directly unless
+// you need to deviate from the grid or are trying
+// to reduce the amount of generated CSS.
+@mixin column-base($last: false) {
+  @include float-left;
+  @if $last {
+    @include last; }
+  @else {
+    margin-right: $blueprint_grid_margin; }
+  * html & {
+    overflow-x: hidden; } }
+
+// Mixin to a column to append n empty columns to the right
+// by adding right padding to the column.
+@mixin append($n) {
+  padding-right: $blueprint_grid_outer_width * $n; }
+
+// Mixin to a column to append n empty columns to the left
+// by adding left padding to the column.
+@mixin prepend($n) {
+  padding-left: $blueprint_grid_outer_width * $n; }
+
+// Adds trailing margin.
+@mixin append-bottom($amount: 1.5em) {
+  margin-bottom: $amount; }
+
+// Adds leading margin.
+@mixin prepend-top($amount: 1.5em) {
+  margin-top: $amount; }
+
+// Base styles that make it possible to pull an element to the left.
+// #### Note:
+// This mixin gets applied automatically when using `+pull`
+// so you probably don't need to use it directly unless
+// you need to deviate from the grid or are trying
+// to reduce the amount of generated CSS.
+@mixin pull-base {
+  @include float-left;
+  position: relative; }
+
+// The amount of pulling for element to the left.
+// #### Note:
+// This mixin gets applied automatically when using `+pull`
+// so you probably don't need to use it directly unless
+// you need to deviate from the grid or are trying
+// to reduce the amount of generated CSS.
+@mixin pull-margins($n, $last: false) {
+  @if $last {
+    margin-left: -$blueprint_grid_outer_width * $n + $blueprint_grid_margin; }
+  @else {
+    margin-left: -$blueprint_grid_outer_width * $n; } }
+
+// Moves a column `n` columns to the left.
+//
+// This mixin can also be used to change the display order of columns.
+//
+// If pulling past the last (visually) element in a row,
+// pass `true` as the second argument so the calculations can adjust
+// accordingly.
+
+// For example:
+//
+// HTML:
+//     <div id="one">One</div>
+//     <div id="two">Two</div>
+// Sass:
+//     #one
+//       +column(18, true)
+//       +prepend(6)
+//     #two
+//       +column(6)
+//       +pull(18, true)
+@mixin pull($n, $last: false) {
+  @include pull-base;
+  @include pull-margins($n, $last); }
+
+@mixin push-base {
+  @include float-right;
+  position: relative; }
+
+@mixin push-margins($n) {
+  margin: 0 -$blueprint_grid_outer_width * $n 1.5em $blueprint_grid_outer_width * $n; }
+
+// mixin to a column to push it n columns to the right
+@mixin push($n) {
+  @include push-base;
+  @include push-margins($n); }
+
+// Border on right hand side of a column.
+@mixin border($border_color: #eeeeee, $border_width: 1px) {
+  padding-right: $blueprint_grid_margin / 2 - $border_width;
+  margin-right: $blueprint_grid_margin / 2;
+  border-right: #{$border_width} solid #{$border_color}; }
+
+// Border with more whitespace, spans one column.
+@mixin colborder($border_color: #eeeeee, $border_width: 1px) {
+  padding-right: floor(($blueprint_grid_width + 2 * $blueprint_grid_margin - $border_width) / 2);
+  margin-right: ceil(($blueprint_grid_width + 2 * $blueprint_grid_margin - $border_width) / 2);
+  border-right: #{$border_width} solid #{$border_color}; }
+
+// Mixin this to an hr to make a horizontal ruler across a column.
+@mixin colruler($border_color: #dddddd) {
+  background: $border_color;
+  color: $border_color;
+  clear: both;
+  float: none;
+  width: 100%;
+  height: 0.1em;
+  margin: 0 0 1.45em;
+  border: none; }
+
+// Mixin this to an hr to make a horizontal spacer across a column.
+@mixin colspacer {
+  @include colruler;
+  background: white;
+  color: white;
+  visibility: hidden; }

data/frameworks/blueprint/stylesheets/blueprint/_ie.scss

@@ -0,0 +1,108 @@
+// @doc off
+// The blueprint IE mixins should be mixed into a stylesheet that gets conditionally included
+// into IE like so:
+// <!--[if lt IE 8]><link rel="stylesheet" href="ie.css"
+//                   type="text/css" media="screen, projection"><![endif]-->
+// @doc on
+
+//| Usage Examples
+//| --------------
+//|
+//| As a top-level mixin, apply to any page that includes the stylesheet:
+//|
+//|     +blueprint-ie
+//|
+//| Scoped by a presentational class:
+//|
+//|     body.blueprint
+//|      +blueprint-ie(true)
+//|
+//| Scoped by semantic selectors:
+//|
+//|     body#page-1, body#page-2, body.a-special-page-type
+//|       +blueprint-ie(true)
+//|
+//| **Deprecated:** You can pass the body selector as the first argument when used as a top-level mixin
+//|
+//|     +blueprint-ie("body#page-1, body#page-2, body.a-special-page-type")
+@mixin blueprint-ie($body_selector: body) {
+  @if $body_selector == true {
+    @include blueprint-ie-body;
+    @include blueprint-ie-defaults; }
+  @else {
+    #{$body_selector} {
+      @include blueprint-ie-body;
+      @if $body_selector != "body" {
+        @warn "[DEPRECATED] To specify a the selector \"#{$body_selector}\" to +blueprint-ie, pass true as the first argument and mix it into #{$body_selector}.";
+        @include blueprint-ie-defaults; } }
+    @if $body_selector == "body" {
+      @include blueprint-ie-defaults; } } }
+
+@mixin blueprint-ie-body {
+  text-align: center;
+  @include blueprint-ie-hacks; }
+
+@mixin blueprint-ie-hacks {
+  * html & {
+    legend {
+      margin: 0px -8px 16px 0;
+      padding: 0; } }
+  html>& {
+    p code {
+      *white-space: normal; } } }
+
+// Fixes for Blueprint "inline" forms in IE
+@mixin blueprint-inline-form-ie {
+  div, p {
+    vertical-align: middle; }
+  label {
+    position: relative;
+    top: -0.25em; }
+  input {
+    &.checkbox, &.radio, &.button, button {
+      margin: 0.5em 0; } } }
+
+@mixin blueprint-ie-defaults {
+  .container {
+    text-align: left; }
+  sup {
+    vertical-align: text-top; }
+  sub {
+    vertical-align: text-bottom; }
+  hr {
+    margin: -8px auto 11px; }
+  img {
+    -ms-interpolation-mode: bicubic; }
+  fieldset {
+    padding-top: 0; }
+  textarea {
+    overflow: auto; }
+  input {
+    &.text {
+      margin: 0.5em 0;
+      background-color: white;
+      border: 1px solid #bbbbbb;
+      &:focus {
+        border: 1px solid #666666; } }
+    &.title {
+      margin: 0.5em 0;
+      background-color: white;
+      border: 1px solid #bbbbbb;
+      &:focus {
+        border: 1px solid #666666; } }
+    &.checkbox {
+      position: relative;
+      top: 0.25em; }
+    &.radio {
+      position: relative;
+      top: 0.25em; }
+    &.button {
+      position: relative;
+      top: 0.25em; } }
+  textarea {
+    margin: 0.5em 0; }
+  select {
+    margin: 0.5em 0; }
+  button {
+    position: relative;
+    top: 0.25em; } }

data/frameworks/blueprint/stylesheets/blueprint/_interaction.scss

@@ -0,0 +1,57 @@
+@import "colors";
+
+@mixin blueprint-interaction {
+  .error {
+    @include error; }
+  .notice {
+    @include notice; }
+  .success {
+    @include success; }
+  .hide {
+    display: none; }
+  .highlight {
+    @include highlight; }
+  .added {
+    @include added; }
+  .removed {
+    @include removed; } }
+
+@mixin feedback-base {
+  padding: 0.8em;
+  margin-bottom: 1em;
+  border: 2px solid $feedback_border_color; }
+
+@mixin error {
+  @include feedback-base;
+  background: $error_bg_color;
+  color: $error_color;
+  border-color: $error_border_color;
+  a {
+    color: $error_color; } }
+
+@mixin notice {
+  @include feedback-base;
+  background: $notice_bg_color;
+  color: $notice_color;
+  border-color: $notice_border_color;
+  a {
+    color: $notice_color; } }
+
+@mixin success {
+  @include feedback-base;
+  background: $success_bg_color;
+  color: $success_color;
+  border-color: $success_border_color;
+  a {
+    color: $success_color; } }
+
+@mixin highlight {
+  background: $highlight_color; }
+
+@mixin added {
+  background: $added_bg_color;
+  color: $added_color; }
+
+@mixin removed {
+  background: $removed_bg_color;
+  color: $removed_color; }