rapido-css 0.1.2 → 0.1.3

data/stylesheets/susy/_grid.scss

@@ -1,286 +0,0 @@
-// ---------------------------------------------------------------------------
-// Imports
-
-@import "compass/utilities/general/clearfix";
-@import "compass/css3/box-sizing";
-
-// ---------------------------------------------------------------------------
-// Border-Box Sizing
-
-// Apply the border-box sizing model to all elements
-// and adjust the grid math appropriately.
-@mixin border-box-sizing {
-  $border-box-sizing: true;
-  * { @include box-sizing(border-box); }
-}
-
-// ---------------------------------------------------------------------------
-// Container
-
-// Set the width of a container
-//
-//  $columns  : The number of columns in the Grid Layout.
-@mixin set-container-width(
-  $columns  : $total-columns,
-  $style    : $container-style
-){
-  $width: container-outer-width($columns);
-
-  @if $style == 'static' {
-    @include if-rem(width, $width);
-  } @else {
-    @if $style == 'fluid' {
-      @if unit($width) == '%' { @include if-rem(width, $width); }
-    } @else {
-      @include if-rem(max-width, $width);
-      @if $legacy-support-for-ie6 {
-        @if unit($width) == 'rem' {
-          _width: round(convert-length($width, px));
-        } @else {
-          _width: $width;
-        }
-      }
-    }
-  }
-}
-
-// Set the outer grid-containing element(s).
-//
-//  $columns  : The number of columns in the container.
-@mixin apply-container(
-  $columns  : $total-columns
-){
-  @include pie-clearfix;
-  @include set-container-width($columns);
-  @include if-rem(padding-left, $grid-padding);
-  @include if-rem(padding-right, $grid-padding);
-  margin: { left: auto; right: auto; }
-}
-
-// Set one or more layouts on a grid-containing element at any number of media-query breakpoints.
-//
-// $media-layout-1        : [default:$total-columns] A list of values including -
-//                        : One unitless number (representing columns in a layout)
-//                        : Two optional lengths (representing min and max-width media-query breakpoints).
-// $media-layout-2 ...-10 : [optional] Same as $media-layout-1
-@mixin container(
-  $media-layout-1   : $total-columns,
-  $media-layout-2   : false,
-  $media-layout-3   : false,
-  $media-layout-4   : false,
-  $media-layout-5   : false,
-  $media-layout-6   : false,
-  $media-layout-7   : false,
-  $media-layout-8   : false,
-  $media-layout-9   : false,
-  $media-layout-10  : false
-){
-  $media-layouts    : compact($media-layout-2,$media-layout-3,$media-layout-4,$media-layout-5,$media-layout-6,$media-layout-7,$media-layout-8,$media-layout-9,$media-layout-10);
-
-  @if is-default-layout($media-layout-1) {
-    @include apply-container();
-  } @else {
-    @include at-breakpoint($media-layout-1) {
-      @include apply-container();
-    }
-  }
-
-  @each $ml in $media-layouts {
-    @if $ml {
-      @include at-breakpoint($ml) {
-        @include set-container-width;
-      }
-    }
-  }
-}
-
-// ---------------------------------------------------------------------------
-// Columns
-
-// Create a grid element spanning any number of 'columns' in a grid 'context'.
-// $columns : The number of columns to span.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $padding : [optional] Padding applied to the inside of individual grid columns.
-//          : Padding is only output if one or two values are specified (e.g. 1em or 10px 20px)
-//          : Padding values are applied only on the horizontal axis in from-to order
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin span-columns(
-  $columns,
-  $context       : $total-columns,
-  $padding       : false,
-  $from          : $from-direction,
-  $style         : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  $to       : opposite-position($from);
-  $pos      : split-columns-value($columns,position);
-  $cols     : split-columns-value($columns,columns);
-  $pad-from : if($style == static, 0 * $gutter-width, relative-width(0 * $gutter-width, $context));
-  $pad-to   : if($style == static, 0 * $gutter-width, relative-width(0 * $gutter-width, $context));
-
-  @if $padding != false {
-    $pad-from : nth($padding, 1);
-
-    @if length($padding) > 1 {
-      $pad-to: nth($padding, 2);
-    } @else {
-      $pad-to: $pad-from;
-    }
-
-    $pad-from : if($style == static, $pad-from, relative-width($pad-from, $context));
-    $pad-to   : if($style == static, $pad-to, relative-width($pad-to, $context));
-
-    padding-#{$from}: $pad-from;
-    padding-#{$to}: $pad-to;
-  }
-
-  width: columns($cols, $context, $style) - if($border-box-sizing, 0, $pad-to + $pad-from);
-
-  @if ($pos == 'omega') {
-    @include omega($from);
-  } @else {
-    float: $from;
-    margin-#{$to}: gutter($context, $style);
-    @if $legacy-support-for-ie6 { display: inline; }
-  }
-}
-
-// Apply to elements spanning the last column, to account for the page edge.
-// Only needed as an override. Normally 'omega' can just be called by `columns`.
-//
-// $from    : The start-direction for your document.
-@mixin omega(
-  $from     : $from-direction
-) {
-  $from   : unquote($from);
-  $to     : opposite-position($from);
-  $hack   : opposite-position($omega-float);
-
-  float: $omega-float;
-  margin-#{$to}: 0;
-
-  @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
-    *margin-#{$hack}: - $gutter-width;
-    @if $legacy-support-for-ie6 { display: inline; }
-  }
-}
-
-// Shortcut to apply omega to a specific subset of elements.
-//
-// $n         : [first | only | last | <equation>]
-// $selector  : [child | last-child | of-type | last-of-type ]
-// $from      : The start-direction for your document.
-@mixin nth-omega(
-  $n        : last,
-  $selector : child,
-  $from     : $from-direction
-) {
-  $from     : unquote($from);
-  $ie: if($n == "first", true, false);
-  @include adjust-support-for($ie6: $ie, $ie7: $ie, $ie8: $ie) {
-    &:#{format-nth($n,$selector)} { @include omega($from); }
-  }
-}
-
-// ---------------------------------------------------------------------------
-// Resets
-
-// Reset a '+columns' grid element to default block behavior
-//
-// $from  : The start direction of your layout (e.g. 'left' for ltr languages)
-@mixin reset-columns(
-  $from: $from-direction
-) {
-  $from   : unquote($from);
-  $to     : opposite-position($from);
-  $hack   : opposite-position($omega-float);
-
-  float: none;
-  width: auto;
-  margin-#{$to}: auto;
-
-  @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
-    *margin-#{$hack}: auto;
-    @if $legacy-support-for-ie6 { display: block; }
-  }
-}
-
-// Apply to elements previously set as omega.
-// This will return floats and margins back to non-omega settigns.
-//
-// $context : [optional] The context (columns spanned by parent).
-// $from    : The start-direction for your document.
-// $style   : The container style to use.
-@mixin remove-omega(
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from   : unquote($from);
-  $to     : opposite-position($from);
-  $hack   : opposite-position($omega-float);
-
-  float: $from;
-  margin-#{$to}: gutter($context, $style);
-
-  @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
-    *margin-#{$hack}: auto;
-  }
-}
-
-// Shortcut to apply remove-omega to a specific subset of elements.
-//
-// $n         : [first | only | last | <equation>]
-// $selector  : [child | last-child | of-type | last-of-type ]
-// $context   : [optional] The context (columns spanned by parent).
-// $from      : The start-direction for your document.
-// $style     : The container style to use.
-@mixin remove-nth-omega(
-  $n        : last,
-  $selector : child,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  $ie: if($n == "first", true, false);
-  @include adjust-support-for($ie6: $ie, $ie7: $ie, $ie8: $ie) {
-    &:#{format-nth($n,$selector)} {
-      @include remove-omega($context, $from, $style);
-    }
-  }
-}
-
-// ---------------------------------------------------------------------------
-// Change Settings
-
-@mixin with-grid-settings(
-  $columns: $total-columns,
-  $width: $column-width,
-  $gutter: $gutter-width,
-  $padding: $grid-padding
-) {
-  // keep the defaults around
-  $default-columns: $total-columns;
-  $default-width: $column-width;
-  $default-gutter: $gutter-width;
-  $default-padding: $grid-padding;
-
-  // use the new settings
-  $total-columns: $columns;
-  $column-width: $width;
-  $gutter-width: $gutter;
-  $grid-padding: $padding;
-
-  // apply to contents
-  @content;
-
-  // re-instate the defaults
-  $total-columns: $default-columns;
-  $column-width: $default-width;
-  $gutter-width: $default-gutter;
-  $grid-padding: $default-padding;
-}

data/stylesheets/susy/_isolation.scss

@@ -1,51 +0,0 @@
-// ---------------------------------------------------------------------------
-// Isolation
-
-// Isolate the position of a grid element (use in addition to span-columns)
-//
-// $location  : The grid column to isolate in, relative to the container;
-// $context   : [optional] The context (columns spanned by parent).
-// $from      : The start direction of your layout (e.g. 'left' for ltr languages)
-@mixin isolate(
-  $location,
-  $context: $total-columns,
-  $from: $from-direction,
-  $style: fix-static-misalignment()
-) {
-  $to: opposite-position($from);
-  margin-#{$to}: -100%;
-  margin-#{$from}: space($location - 1, $context, $style);
-}
-
-// Isolate a group of elements in a grid, using nth-child selectors
-//
-// $columns       : The column-width of each item on the grid;
-// $context       : [optional] The context (columns spanned by parent).
-// $selector      : [child | of-type | last-of-type ] (default is 'child')
-// $from          : The start direction of your layout (e.g. 'left' for ltr languages)
-@mixin isolate-grid(
-  $columns,
-  $context: $total-columns,
-  $selector: 'child',
-  $from: $from-direction,
-  $style: fix-static-misalignment()
-) {
-  $to: opposite-position($from);
-  $location: 1;
-  $line: floor($context / $columns);
-
-  @include span-columns($columns, $context, $from: $from, $style: $style);
-  margin-#{$to}: -100%;
-
-  @for $item from 1 through $line {
-    $nth: '#{$line}n + #{$item}';
-    &:#{format-nth($nth,$selector)} {
-      margin-#{$from}: space($location - 1, $context, $style);
-      @if $location == 1 { clear: $from; }
-      @else { clear: none; }
-
-      $location: $location + $columns;
-      @if $location > $context { $location: 1; }
-    }
-  }
-}

data/stylesheets/susy/_margin.scss

@@ -1,93 +0,0 @@
-// ---------------------------------------------------------------------------
-// Margin Mixins
-
-// Apply 'columns' margin before an element to push it along the grid.
-//
-// $columns : The number of columns to span.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin pre(
-  $columns,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  margin-#{$from}: space($columns, $context, $style);
-}
-
-// 'push' is a synonymn for 'pre'
-@mixin push(
-  $columns,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  @include pre($columns, $context, $from, $style);
-}
-
-// Apply negative 'columns' margin before an element to pull it along the grid.
-//
-// $columns : The number of columns to span.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin pull(
-  $columns,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  margin-#{$from}: 0 - space($columns, $context, $style);
-}
-
-// Apply 'columns' margin after an element to contain it in a grid.
-//
-// $columns : The number of columns to span.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin post(
-  $columns,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  $to : opposite-position($from);
-  margin-#{$to}: space($columns, $context, $style);
-}
-
-// Apply 'columns' before and/or after an element to contain it on a grid.
-//
-// $pre     : The number of columns to add as margin before.
-// $post    : The number of columns to add as margin after.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin squish(
-  $pre      : false,
-  $post     : false,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  @if $pre {
-    @include pre($pre, $context, $from, $style)
-  }
-  @if $post {
-    @include post($post, $context, $from, $style)
-  }
-}

data/stylesheets/susy/_media.scss

@@ -1,112 +0,0 @@
-// ---------------------------------------------------------------------------
-// Media Mixins
-
-// Create a new layout context for (@content) descendants.
-//
-// $layout-cols : a (unitless) number of columns to use for this layout.
-@mixin layout(
-  $layout-cols
-) {
-  // store default $total-columns setting for later, then change it.
-  $default-layout   : $total-columns;
-  $total-columns    : $layout-cols;
-
-  // apply children in this new layout context.
-  @content;
-
-  // return to default $total-columns setting.
-  $total-columns    : $default-layout;
-}
-
-// Nest a block of code inside a new media-query and layout context.
-//
-// $media-layout  : a list of values [$min $layout $max $ie] including...
-//                : - one unitless number (columns in a layout)
-//                : - two optional lengths (min and max-width media-query breakpoints).
-//                : - one optional boolean or string to trigger fallback support for IE.
-// $font-size     : [optional] The base font-size of your layout, if you are using ems.
-//                : - defaults to $base-font-size
-@mixin at-breakpoint(
-  $media-layout,
-  $font-size: $base-font-size
-) {
-  $media-layout : medialayout($media-layout,$font-size);
-  $min          : nth($media-layout,1);
-  $layout       : nth($media-layout,2);
-  $max          : nth($media-layout,3);
-  $ie           : nth($media-layout,4);
-
-  @if (not $breakpoint-media-output) and (not $breakpoint-ie-output) and (not $breakpoint-raw-output) {
-    @warn "Either $breakpoint-media-output, $breakpoint-ie-output, or $breakpoint-raw-output must be true for at-breakpoint to work.";
-  }
-
-  // We need to have either a min-width breakpoint or a layout in order to proceed.
-  @if $min or $layout or $max {
-
-    // If we don't have a layout, we create one based on the min-width.
-    @if not $layout {
-      $layout: get-layout($min);
-    }
-
-    // If we still don't have a layout, we have a problem.
-    @if $layout {
-      // Set our new layout context.
-      @include layout($layout) {
-        @if $breakpoint-media-output {
-          // Capture current state of ie support and set new
-          $atbreak-legacy-ie-matrix: capture-legacy-ie-matrix();
-          @include set-legacy-ie-support;
-
-          @if $min and $max {
-            // Both $min and $max
-            @media (min-width: $min) and (max-width: $max) {
-              @content;
-            }
-          } @else {
-            @if (not $min) and (not $max) {
-              // Neither $min nor $max:
-              // We can create a breakpoint based on the number of columns in the layout.
-              $min: fix-ems(container-outer-width($width: false));
-            }
-            @if $min {
-              // Min only:
-              @media (min-width: $min) {
-                @content;
-              }
-            } @else {
-              // Max only:
-              @media (max-width: $max) {
-                @content;
-              }
-            }
-          }
-          // Return legacy-ie support to original
-          @include set-legacy-ie-support($atbreak-legacy-ie-matrix...);
-        }
-        // Set an IE fallback
-        @if $ie and $breakpoint-ie-output {
-          @if (type-of($ie) == 'bool') {
-            $ie: 'lt-ie9';
-          }
-          .#{$ie} & {
-            $atbreak-experimental-matrix: capture-experimental-matrix();
-            @include set-experimental-support($ms: true);
-            @content;
-            @include set-experimental-support($atbreak-experimental-matrix...);
-          }
-        }
-
-        @if $breakpoint-raw-output {
-          @content;
-        }
-      }
-    } @else {
-      @warn "Something went horribly wrong here. Try adjusting your variables.";
-    }
-
-  } @else {
-    @warn "You need to provide either a valid layout (number of columns)
-    or a valid media-query min-width breakpoint (length).";
-  }
-
-}

data/stylesheets/susy/_padding.scss

@@ -1,92 +0,0 @@
-// ---------------------------------------------------------------------------
-// Padding Mixins
-
-// add empty colums as padding before an element.
-// $columns : The number of columns to prefix.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin prefix(
-  $columns,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from           : unquote($from);
-  padding-#{$from}: space($columns, $context, $style);
-}
-
-// add empty colums as padding after an element.
-// $columns : The number of columns to suffix.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin suffix(
-  $columns,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from         : unquote($from);
-  $to           : opposite-position($from);
-  padding-#{$to}: space($columns, $context, $style);
-}
-
-// add empty colums as padding before and after an element.
-// $columns : The number of columns to pad.
-// $context : [optional] The context (columns spanned by parent).
-//          : Context is required on any nested elements.
-//          : Context MUST NOT be declared on a root element.
-// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
-// $style   : The container style to use.
-@mixin pad(
-  $prefix   : false,
-  $suffix   : false,
-  $context  : $total-columns,
-  $from     : $from-direction,
-  $style    : fix-static-misalignment()
-) {
-  $from     : unquote($from);
-  @if $prefix {
-    @include prefix($prefix, $context, $from, $style);
-  }
-  @if $suffix {
-    @include suffix($suffix, $context, $from, $style);
-  }
-}
-
-// Bleed into colums with margin/padding on any side of an element.
-// $width   : The side of the bleed.
-//          : Any unit-length will be used directly.
-//          : Any unitless number will be used as a column-count.
-//          : Use "2 of 6" format to represent 2 cals in a 6-col nested context.
-// $sides   : One or more sides to bleed [ top | right | bottom | left | all ].
-// $style   : The container style to use.
-@mixin bleed(
-  $width: $grid-padding,
-  $sides: left right,
-  $style: fix-static-misalignment()
-) {
-  @if $border-box-sizing { @include box-sizing(content-box) }
-
-  @if type-of($width) == 'list' {
-    $width: filter($width, of);
-    $width: space(nth($width,1), nth($width,2), $style);
-  } @else if unitless($width) {
-    $width: space($width, $style: $style);
-  }
-
-  @if $sides == 'all' {
-    margin: - $width;
-    padding: $width;
-  } @else {
-    @each $side in $sides {
-      margin-#{$side}: - $width;
-      padding-#{$side}: $width;
-    }
-  }
-}

data/stylesheets/susy/_settings.scss

@@ -1,56 +0,0 @@
-// ---------------------------------------------------------------------------
-// Susy Settings
-
-// The total number of columns in the grid
-$total-columns      : 12              !default;
-
-// The width of columns and gutters.
-// These must all be set with the comparable units.
-$column-width       : 4em             !default;
-$gutter-width       : 1em             !default;
-
-// Padding on the left and right of a Grid Container.
-$grid-padding       : $gutter-width   !default;
-
-// ---------------------------------------------------------------------------
-// Advanced Settings
-
-// From Direction:
-// Controls for right-to-left or bi-directional sites.
-$from-direction     : left            !default;
-
-// Omega Float Direction:
-// The direction that +omega elements are floated by deafult.
-$omega-float        : opposite-position($from-direction)    !default;
-
-// Container Width:
-// Override the total width of your grid, using any length (50em, 75%, etc.)
-$container-width    : false           !default;
-
-// Container Style:
-// 'magic'  - Static (fixed or elastic) when there's enough space,
-//            fluid when there isn't. This is the SUSY MAGIC SAUCE(TM).
-// 'static' - Forces the grid container to remain static at all times.
-// 'fluid'  - Forces the grid to remain fluid at all times.
-//            (this will overrule any static $container-width settings)
-$container-style    : magic           !default;
-
-// Border-Box Sizing
-// Adjust the grid math appropriately for box-sizing: border-box;
-// Warning: This does not actually apply the new box model!
-// In most cases you can ignore this setting,
-// and simply apply the border-box-sizing mixin.
-$border-box-sizing  : false           !default;
-
-// ---------------------------------------------------------------------------
-// IE Settings
-
-// When you are using a seperate IE stylesheet,
-// you can use these settings to control the output of at-breakpoint.
-// By default, at-breakpoint will output media-queries as well as
-// any defined ie-fallback classes.
-$breakpoint-media-output  : true      !default;
-$breakpoint-ie-output     : true      !default;
-
-// Danger Zone! Only set as 'true' in IE-specific style sheets.
-$breakpoint-raw-output    : false     !default;