gem_2345 0.1.1 → 0.1.2

data/stylesheets/compass/typography/lists/_inline-list.scss

@@ -0,0 +1,47 @@
+@import "compass/support";
+
+// makes a list inline.
+@mixin inline-list {
+  list-style-type: none;
+  &, & li {
+    margin: 0;
+    padding: 0;
+    display: inline;
+  }
+}
+
+// makes an inline list delimited with the passed string.
+// Defaults to making a comma-separated list.
+//
+// Please make note of the browser support issues before using this mixin:
+//
+// use of `content` and `:after` is not fully supported in all browsers.
+// See quirksmode for the [support matrix](http://www.quirksmode.org/css/contents.html#t15)
+//
+// `:last-child` is not fully supported.
+// see quirksmode for the [support matrix](http://www.quirksmode.org/css/contents.html#t29).
+//
+// IE8 ignores rules that are included on the same line as :last-child
+// see http://www.richardscarrott.co.uk/posts/view/ie8-last-child-bug for details
+
+@mixin delimited-list($separator: ", ") {
+  @include inline-list;
+  li {
+    &:after { content: $separator; }
+    &:last-child {
+      &:after { content: ""; }
+    }
+    @if support-legacy-browser("ie", "7", $threshold: $css-sel2-support-threshold) {
+      &.last {
+        &:after { content: ""; }
+      }
+    }
+  }
+}
+
+// See [delimited-list](#mixin-delimited-list)
+// @deprecated
+@mixin comma-delimited-list {
+  @warn "comma-delimited-list is deprecated. Please use delimited-list instead.";
+  @include delimited-list;
+}

data/stylesheets/compass/typography/text/_ellipsis.scss

@@ -0,0 +1,25 @@
+@import "compass/css3/deprecated-support";
+
+// To get full firefox support, you must install the ellipsis pattern:
+//
+//     compass install compass/ellipsis
+$use-mozilla-ellipsis-binding: false !default;
+
+// This technique, by [Justin Maxwell](http://code404.com/), was originally
+// published [here](http://mattsnider.com/css/css-string-truncation-with-ellipsis/).
+// Firefox implementation by [Rikkert Koppes](http://www.rikkertkoppes.com/thoughts/2008/6/).
+@mixin ellipsis($no-wrap: true) {
+  @if $no-wrap { white-space: nowrap; }
+  overflow: hidden;
+  @include experimental(text-overflow, ellipsis,
+    not -moz,
+    not -webkit,
+    -o,
+    -ms,
+    not -khtml,
+    official
+  );
+  @if $legacy-support-for-mozilla and $use-mozilla-ellipsis-binding {
+    -moz-binding: stylesheet-url(unquote("xml/ellipsis.xml#ellipsis"));
+  }
+}

data/stylesheets/compass/typography/text/_force-wrap.scss

@@ -0,0 +1,12 @@
+// Prevent long urls and text from breaking layouts
+// [originally from perishablepress.com](http://perishablepress.com/press/2010/06/01/wrapping-content/)
+@mixin force-wrap {
+  white-space: pre;           // CSS 2.0
+  white-space: pre-wrap;      // CSS 2.1
+  white-space: pre-line;      // CSS 3.0
+  white-space: -pre-wrap;     // Opera 4-6
+  white-space: -o-pre-wrap;   // Opera 7
+  white-space: -moz-pre-wrap; // Mozilla
+  white-space: -hp-pre-wrap;  // HP Printers
+  word-wrap: break-word;      // IE 5+
+}

data/stylesheets/compass/typography/text/_nowrap.scss

@@ -0,0 +1,2 @@
+// When remembering whether or not there's a hyphen in white-space is too hard
+@mixin nowrap { white-space: nowrap; }

data/stylesheets/compass/typography/text/_replacement.scss

@@ -0,0 +1,74 @@
+@import "compass/support";
+
+// Indicates the direction you prefer to move your text
+// when hiding it.
+//
+// `left` is more robust, especially in older browsers.
+// `right` seems have better runtime performance.
+$hide-text-direction: left !default;
+
+// Hides html text and replaces it with an image.
+// If you use this on an inline element, you will need to change the display to block or inline-block.
+// Also, if the size of the image differs significantly from the font size, you'll need to set the width and/or height.
+//
+// Parameters:
+//
+// * `img` -- the relative path from the project image directory to the image, or a url literal.
+// * `x` -- the x position of the background image.
+// * `y` -- the y position of the background image.
+@mixin replace-text($img, $x: 50%, $y: 50%) {
+  @include hide-text;
+  background: {
+    @if is-url($img) {
+      image: $img;
+    } @else {
+      image: image-url($img);
+    }
+    repeat: no-repeat;
+    position: $x $y;
+  };
+}
+
+// Like the `replace-text` mixin, but also sets the width
+// and height of the element according the dimensions of the image.
+//
+// If you set `$inline` to true, then an inline image (data uri) will be used.
+@mixin replace-text-with-dimensions($img, $x: 50%, $y: 50%, $inline: false) {
+  @include replace-text(if($inline, inline-image($img), $img), $x, $y);
+  width: image-width($img);
+  height: image-height($img);
+}
+
+// Hides text in an element so you can see the background.
+//
+// The direction indicates how the text should be moved out of view.
+//
+// See `$hide-text-direction` for more information and to set this globally
+// for your application.
+@mixin hide-text($direction: $hide-text-direction) {
+  @if $direction == left {
+    $approximate-em-value: 12px / 1em;
+    $wider-than-any-screen: -9999em;
+    text-indent: $wider-than-any-screen * $approximate-em-value;
+    overflow: hidden;
+    text-align: left;
+  } @else {
+    // slightly wider than the box prevents issues with inline-block elements
+    text-indent: 110%;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+  @include for-legacy-browsers((ie: "7"), $critical-usage-threshold) {
+    //Text transform capitalize fixes text-replacement issue when used in a <button> element on ie7
+    text-transform:capitalize;
+  }
+}
+
+// Hides text in an element by squishing the text into oblivion.
+// Use this if you need to hide text contained in an inline element
+// but still have it read by a screen reader.
+@mixin squish-text {
+  font: 0/0 serif;
+  text-shadow: none;
+  color: transparent;
+}

data/stylesheets/compass/utilities/_color.scss

@@ -0,0 +1 @@
+@import "color/contrast";

data/stylesheets/compass/utilities/_general.scss

@@ -0,0 +1,6 @@
+@import "general/reset";
+@import "general/clearfix";
+@import "general/float";
+@import "general/tag-cloud";
+@import "general/hacks";
+@import "general/min";

data/stylesheets/compass/utilities/_links.scss

@@ -0,0 +1,5 @@
+@warn "This import is deprecated. Use 'compass/typography/links' instead.";
+
+@import "../typography/links/hover-link";
+@import "../typography/links/link-colors";
+@import "../typography/links/unstyled-link";

data/stylesheets/compass/utilities/_lists.scss

@@ -0,0 +1,6 @@
+@warn "This import is deprecated. Use 'compass/typography/lists' instead.";
+
+@import "../typography/lists/horizontal-list";
+@import "../typography/lists/inline-list";
+@import "../typography/lists/inline-block-list";
+@import "../typography/lists/bullets";

data/stylesheets/compass/utilities/_print.scss

@@ -0,0 +1,17 @@
+// Classes that are useful for controlling what gets printed.
+// You must mix `+print-utilities` into your print stylesheet
+// and `+print-utilities(screen)` into your screen stylesheet.
+// Note: these aren't semantic.
+@mixin print-utilities($media: print) {
+  @if $media == print {
+    .noprint, .no-print { display: none; }
+    #{elements-of-type(block)} {
+      &.print-only { display: block; }
+    }
+    #{elements-of-type(inline)} {
+      &.print-only {  display: inline; }
+    }
+  } @else {
+    .print-only { display: none; }
+  }
+}

data/stylesheets/compass/utilities/_sass.scss

@@ -0,0 +1,2 @@
+@import "sass/lists";
+@import "sass/maps";

data/stylesheets/compass/utilities/_sprites.scss

@@ -0,0 +1,2 @@
+@import "sprites/base";
+@import "sprites/sprite-img";

data/stylesheets/compass/utilities/_tables.scss

@@ -0,0 +1,3 @@
+@import "tables/alternating-rows-and-columns";
+@import "tables/borders";
+@import "tables/scaffolding";

data/stylesheets/compass/utilities/_text.scss

@@ -0,0 +1,5 @@
+@warn "This import is deprecated. Use 'compass/typography/text' instead.";
+
+@import "../typography/text/ellipsis";
+@import "../typography/text/nowrap";
+@import "../typography/text/replacement";

data/stylesheets/compass/utilities/color/_brightness.scss

@@ -0,0 +1,20 @@
+// Computes the "brightness" of a color
+//
+// Brightness is similiar to lightness in HSL but more closely approximates
+// how humans perceive the intensity of the different RGB components of
+// a color. Brightness is sometimes called luminance.
+//
+// Returns a number between 0% and 100%, where 100% is fully bright
+// (white) and 0% is fully dark (black) for color values.
+//
+// For numbers and percentages it returns the same value to be used
+// in `@include filter(brightness(1.1))`.
+@function brightness($color) {
+  @if type-of($color) == color {
+    @return ((red($color) * .299) + (green($color) * .587) + (blue($color) * .114)) / 255 * 100%;
+  }
+  @else {
+    @return unquote("brightness(#{$color})");
+  }
+}
+

data/stylesheets/compass/utilities/color/_contrast.scss

@@ -0,0 +1,52 @@
+@import "compass/utilities/color/brightness";
+
+$contrasted-dark-default:   #000 !default;
+$contrasted-light-default:  #fff !default;
+
+// Returns either the `$light` or `$dark` color
+// by deciding which contrasts more with `$color`.
+//
+// E.g. This can be used to select the more readable foreground color
+// for a given background color.
+//
+// `$dark` defaults to black and `$light` defaults to white.
+//
+// When `$color` is `null`, this function returns `null`.
+@function contrast-color(
+  $color,
+  $dark: $contrasted-dark-default,
+  $light: $contrasted-light-default,
+  $threshold: null
+) {
+  @if $threshold {
+    // Deprecated in Compass 0.13
+    @warn "The $threshold argment to contrast-color is no longer needed and will be removed in the next release."
+  }
+  @if $color == null {
+    @return null;
+  }
+  @else {
+    $color-brightness: brightness($color);
+    $dark-text-brightness: brightness($dark);
+    $light-text-brightness: brightness($light);
+
+    @return if(abs($color-brightness - $light-text-brightness) > abs($color-brightness - $dark-text-brightness), $light, $dark);
+  }
+}
+
+// Sets the specified background color and calculates a dark or light
+// contrasted text color.  The arguments are passed through to the
+// [contrast-color function](#function-contrast-color).
+@mixin contrasted(
+  $background-color,
+  $dark: $contrasted-dark-default,
+  $light: $contrasted-light-default,
+  $threshold: null
+) {
+  @if $threshold {
+    // Deprecated in Compass 0.13
+    @warn "The $threshold argment to contrasted is no longer needed and will be removed in the next release."
+  }
+  background-color: $background-color;
+  color: contrast-color($background-color, $dark, $light);
+}

data/stylesheets/compass/utilities/general/_clearfix.scss

@@ -0,0 +1,44 @@
+// @doc off
+// Extends the bottom of the element to enclose any floats it contains.
+// @doc on
+
+@import "hacks";
+
+// This basic method is preferred for the usual case, when positioned
+// content will not show outside the bounds of the container.
+//
+// Recommendations include using this in conjunction with a width.
+// Credit: [quirksmode.org](http://www.quirksmode.org/blog/archives/2005/03/clearing_floats.html)
+@mixin clearfix {
+  overflow: hidden;
+  @include has-layout;
+}
+
+// This older method from Position Is Everything called
+// [Easy Clearing](http://www.positioniseverything.net/easyclearing.html)
+// has the advantage of allowing positioned elements to hang
+// outside the bounds of the container at the expense of more tricky CSS.
+@mixin legacy-pie-clearfix {
+  &:after {
+    content    : "\0020";
+    display    : block;
+    height     : 0;
+    clear      : both;
+    overflow   : hidden;
+    visibility : hidden;
+  }
+  @include has-layout;
+}
+
+// This is an updated version of the PIE clearfix method that reduces the amount of CSS output.
+// If you need to support Firefox before 3.5 you need to use `legacy-pie-clearfix` instead.
+//
+// Adapted from: [A new micro clearfix hack](http://nicolasgallagher.com/micro-clearfix-hack/)
+@mixin pie-clearfix {
+  &:after {
+    content: "";
+    display: table;
+    clear: both;
+  }
+  @include has-layout;
+}

data/stylesheets/compass/utilities/general/_float.scss

@@ -0,0 +1,38 @@
+@import "compass/support";
+
+// The legacy support threshold for float.
+// Defaults to the $critical-usage-threshold.
+$legacy-float-support-threshold: $critical-usage-threshold !default;
+
+// Implementation of float:left with fix for the
+// [double-margin bug in IE5/6](http://www.positioniseverything.net/explorer/doubled-margin.html)
+@mixin float-left {
+  @include float(left); }
+
+// Implementation of float:right with fix for the
+// [double-margin bug in IE5/6](http://www.positioniseverything.net/explorer/doubled-margin.html)
+@mixin float-right {
+  @include float(right); }
+
+// Direction independent float mixin that fixes the
+// [double-margin bug in IE5/6](http://www.positioniseverything.net/explorer/doubled-margin.html)
+@mixin float($side: left) {
+  float: unquote($side);
+  @if support-legacy-browser("ie", "6", $threshold: $legacy-float-support-threshold) {
+    display: inline; } }
+
+// Resets floated elements back to their default of `float: none` and defaults
+// to `display: block` unless you pass `inline` as an argument
+//
+// Usage Example:
+//
+//     body.homepage
+//       #footer li
+//         +float-left
+//     body.signup
+//       #footer li
+//         +reset-float
+@mixin reset-float($display: block) {
+  float: none;
+  @if support-legacy-browser("ie", "6", $threshold: $legacy-float-support-threshold) {
+    display: $display; } }

data/stylesheets/compass/utilities/general/_hacks.scss

@@ -0,0 +1,65 @@
+@import "compass/support";
+
+// The legacy support threshold for has-layout.
+// Defaults to the $critical-usage-threshold.
+$has-layout-support-threshold: $critical-usage-threshold !default;
+
+// The `zoom` approach generates less CSS but does not validate.
+// Set this to `block` to use the display-property to hack the
+// element to gain layout.
+$default-has-layout-approach: zoom !default;
+
+// This mixin causes an element matching the selector
+// to gain the "hasLayout" property in internet explorer.
+// More information on [hasLayout](http://reference.sitepoint.com/css/haslayout).
+@mixin has-layout($approach: $default-has-layout-approach) {
+  @if support-legacy-browser("ie", "7", $threshold: $has-layout-support-threshold) {
+    @if $approach == zoom {
+      @include has-layout-zoom;
+    } @else if $approach == block {
+      @include has-layout-block;
+    } @else {
+      @warn "Unknown has-layout approach: #{$approach}";
+      @include has-layout-zoom;
+    }
+  }
+}
+
+@mixin has-layout-zoom {
+  @if support-legacy-browser("ie", "7", $threshold: $has-layout-support-threshold) {
+    *zoom: 1;
+  }
+}
+
+@mixin has-layout-block {
+  @if support-legacy-browser("ie", "7", $threshold: $has-layout-support-threshold) {
+    // This makes ie6 get layout
+    display: inline-block;
+    // and this puts it back to block
+    & { display: block; }
+  }
+}
+
+
+// The legacy support threshold for IE6 attribute hack.
+// Defaults to the $critical-usage-threshold.
+$ie6-attribute-hack-support-threshold: $critical-usage-threshold !default;
+
+// A hack to supply IE6 (and below) with a different property value.
+// [Read more](http://www.cssportal.com/css-hacks/#in_css-important).
+@mixin bang-hack($property, $value, $ie6-value) {
+  @if support-legacy-browser("ie", "6", $threshold: $ie6-attribute-hack-support-threshold) {
+    @warn "it's recommended to use the underscore-hack() mixin instead of bang-hack()";
+    #{$property}: #{$value} !important;
+    #{$property}: #{$ie6-value};
+  }
+}
+
+// A hack to supply IE6 (and below) with a different property value.
+// [Read more](http://www.paulirish.com/2009/browser-specific-css-hacks/)
+@mixin underscore-hack($property, $value, $ie6-value) {
+  @if support-legacy-browser("ie", "6", $threshold: $ie6-attribute-hack-support-threshold) {
+    #{$property}: #{$value};
+    _#{$property}: #{$ie6-value};
+  }
+}