susy 2.0.0.beta.3 → 2.0.0.rc.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 3a8a770621f5c94d8e367a8019a22f9cbf70d4ad
-  data.tar.gz: 9a1c8cd9a1b701054eac039ac46036db8bb29a32
+  metadata.gz: b5655917505fce129931804fc695e1e51625e95b
+  data.tar.gz: c81923912ee3fff6b24c1044bf6d60c8456abc48
 SHA512:
-  metadata.gz: 0547e1ab69123432985801feacc22c1a7c7e0386874c71940131a0a774d5a60c941c4b0911276ba8878dcc37ad5b814b0a8e7763c816fecafc9c07bf357eb3e3
-  data.tar.gz: 3bb35def7bf985cf7aba9f78e80dac528bedcb69788a3f0b78ced2d18155ab6e61802d7fd64b7fba69e33ca0af134a349a7ac5862820087be227facf7a18d6ff
+  metadata.gz: f6d1cf8d97dd318a0dbc9cc802d71b59347a55b7985c43b5837cb0efa0ce2d3d66c3547a8c8d5deff75c7b2620e7cf2f09cf45ad006bceac2766871058eb5262
+  data.tar.gz: aef002701b2ef4cc933923e1ca6ccad8b28abd96fa39950b88a8d0b2ecf132e15deb7e96e45448e6ae6d014d81715d6081e89c155ded4863d9187950f22f3c1b

data/README.md

@@ -1,40 +1,40 @@
-[![Build Status](https://travis-ci.org/ericam/susy.png?branch=susy-next)](https://travis-ci.org/ericam/susy)
+Power Tools For The Web
+=======================
 
-# Susy [a Compass plugin]
+[![Build Status](https://travis-ci.org/ericam/susy.png?branch=susy-next)](https://travis-ci.org/ericam/susy)
 
-Susy is a semantic CSS grid system with a responsive twist.
+Susy is an agnostic set of tools
+for creating powerful, custom layouts.
+We provide the language,
+but you provide all the opinions.
+Use a grid, don't use a grid,
+or use a combination of grids —
+it's all up to you.
 
-The web is a responsive place,
-from your lithe & lively development process
-to your end user's super-tablet-multi-magic-lap-phone.
-You need grids that are powerful, but custom;
-reliable, but responsive.
+We didn't want to build another system,
+we wanted to build power tools
+that you could use in any system.
 
-This isn't another one-size-fits-all grid framework
-that will make your sites look identical
-and litter your markup with meaningless "col2of5" jargon.
-We don't design your site or write your markup,
-we just do the math and get out of your way.
+Your markup, your layout | *our math*
 
-We provide a single shared syntax for describing layouts,
-and then let you select your favorite output,
-or build your own.
+Resources
+---------
 
-## Resources
-- [Website](http://susy.oddbird.net)
-- [Changelog](https://github.com/ericam/susy/blob/master/CHANGELOG.mkdn)
-- [Tutorial](http://susy.oddbird.net/guides/getting-started/)
-- [Reference](http://susy.oddbird.net/guides/reference/)
+- [Website](http://susy.oddbird.net/)
+- [Documentation](http://susydocs.oddbird.net/)
 - [Sites using Susy](http://susy.oddbird.net/sites-using-susy/)
-- [Twitter @CompassSusy](http://twitter.com/compasssusy/)
+- [Twitter @SassSusy](http://twitter.com/Sasssusy/)
 
-## Contributing
+Contributing
+------------
 
 We love contributions,
 both as ideas and pull requests.
-The core of Susy is all in the `/sass/` directory.
-
-Once you make changes,
-you can test them by building the gem
-and installing it somewhere to test.
-We also have unit tests that you can run.
+Susy is written in pure Sass,
+all contained in the `/sass/` directory.
+Everything else is just packaging.
+If you know Sass,
+or are willing to learn,
+you can contribute to Susy.
+
+More documentation on contributing to come...

data/VERSION

@@ -1 +1 @@
-2.0.0.beta.2
+2.0.0.rc.0

data/docs/changelog.rst

@@ -1,6 +1,36 @@
 Changelog
 =========
 
+2.0.0.rc.1 — Feb 7 2014
+-----------------------
+
+- Add browser support module with settings to ``use-custom`` mixins
+  for ``background-image``,
+  ``background-options`` (``-size``, ``-clip``, ``-origin``),
+  ``box-sizing``, ``clearfix``, and ``rem``.
+  If you set to ``false``,
+  we'll make sure everything works well on modern browsers.
+  If you set to ``true``,
+  we'll check for existing mixins (e.g. from Compass or Bourbon)
+  to provide more powerful legacy support.
+
+  .. code-block: scss
+
+    $susy: (
+      use-custom: (
+        clearfix: false,
+        background-image: true,
+        background-options: false,
+        box-sizing: true,
+        rem: true,
+      ),
+    );
+
+- Fix bugs caused by Sass changes to ``str-index()``,
+  ``#{&}``, and ``@at-root``.
+- Fix Bower dependencies, and add support for Sache.
+- Remove legacy Compass polyfils from susyone code.
+
 
 2.0.0.beta.3 — Jan 10 2014
 --------------------------
@@ -11,6 +41,7 @@ Changelog
 
   + ``@import 'susyone';``
 
+
 2.0.0.beta.2 — Jan 6 2014
 -------------------------
 
@@ -19,7 +50,7 @@ Changelog
 - Add ``isolate`` function to return isolation offset width.
 - Fix a bug with ``last`` output for ``split``-gutter layouts.
 - Fix a bug with split-gutter ``span()``, and ``narrow``/``wider`` keywords.
-- Fix a bug with ``bleed`` and ``null``+``inside`` gutters.
+- Fix a bug with ``bleed`` and ``null`` + ``inside`` gutters.
 - ``bleed`` output uses TRBL shorthand when possible.
 - Clean up and document the core math functions.
 - Document upgrade path, core-math, and DIY grids.

data/sass/susy/_math.scss

@@ -1,6 +1,7 @@
 // Math
 // ====
 
+@import "math/maps";
 @import "math/settings";
 @import "math/validation";
 @import "math/columns";

data/sass/susy/language/_susy.scss

@@ -1,8 +1,6 @@
 // Susy Next Syntax
 // ================
 
-@import "shared";
-
 @import "../math";
 @import "../output/float";
 

data/sass/susy/language/_susyone.scss

@@ -1,10 +1,6 @@
 // ---------------------------------------------------------------------------
 // Partials
 
-// temporary
-@import "susyone/units";
-
-// permanent
 @import "susyone/settings";
 @import "susyone/functions";
 @import "susyone/grid";

data/sass/susy/language/susy/_background.scss

@@ -59,24 +59,44 @@ $susy-overlay-grid-head-exists: false;
 ) {
   @if not $susy-overlay-grid-head-exists {
     @at-root head { @include overlay-head; }
+    @at-root head::before { @include overlay-trigger; }
+    @at-root head:hover { @include overlay-trigger-hover; }
     $susy-overlay-grid-head-exists: true !global;
   }
 
-  $selector: #{&};
-
-  @at-root head:hover {
-    ~ #{$selector},
-    ~ body #{$selector} {
-      position: relative;
-      &::before {
-        @include grid-overlay-base;
-        @include background-grid($grid);
-      }
+  head:hover ~ &,
+  head:hover ~ body & {
+    position: relative;
+    &::before {
+      @include grid-overlay-base;
+      @include background-grid($grid);
     }
   }
 }
 
 
+// [Private] Overlay Trigger
+// -------------------------
+@mixin overlay-trigger {
+  content: "|||";
+  display: block;
+  padding: 5px 10px;
+  font: {
+    family: sans-serif;
+    size: 16px;
+    weight: bold;
+  }
+}
+
+
+// [Private] Overlay Trigger Hover
+// -------------------------------
+@mixin overlay-trigger-hover {
+  background: rgba(white, .5);
+  color: red;
+}
+
+
 // [Private] Overlay Head
 // ----------------------
 // <head> styles to create grid overlay toggle
@@ -97,20 +117,6 @@ $susy-overlay-grid-head-exists: false;
   z-index: 999;
   color: #333;
   background: rgba(white, .25);
-  &::before {
-    content: "|||";
-    display: block;
-    padding: 5px 10px;
-    font: {
-      family: sans-serif;
-      size: 16px;
-      weight: bold;
-    }
-  }
-  &:hover {
-    box-shadow: 0 0 1px rgba(#333,.5);
-    background: rgba(white, .5);
-  }
 }
 
 
@@ -337,7 +343,7 @@ $susy-overlay-grid-head-exists: false;
 
         $return: map-merge($return, (
           image: if($image, map-merge($image, $baseline), $baseline),
-          size: if($size, append($size, $baseline-size, comma), $baseline-size),
+          size: if($size, ($size, $baseline-size), $baseline-size),
         ));
       }
 

data/sass/susy/language/susy/_bleed.scss

@@ -10,11 +10,11 @@
 ) {
   $output: get-bleed($bleed);
 
-  @each $property, $value in $output {
-    #{$property}: $value;
+  @if susy-get(global-box-sizing) != content-box {
+    $output: map-merge((box-sizing: content-box), $output);
   }
 
-  @include susy-box-sizing(content-box);
+  @include output($output);
 }
 
 
@@ -150,7 +150,7 @@
   $return: ();
 
   @each $key, $value in $bleed {
-    @if str-index($key, margin) > 0 {
+    @if str-index($key, margin) {
       $margin: map-merge($margin, ($key: $value));
     } @else if str-index($key, padding) > 0 {
       $padding: map-merge($padding, ($key: $value));

data/sass/susy/language/susy/_box-sizing.scss

@@ -8,7 +8,7 @@
 @mixin global-box-sizing(
   $box: susy-get(global-box-sizing)
 ) {
-  *, *:before, *:after { @include susy-box-sizing($box); }
+  *, *::before, *::after { @include output((box-sizing: $box)); }
   @include update-box-model($box);
 }
 

data/sass/susy/language/susy/_container.scss

@@ -17,7 +17,7 @@
   $box        : susy-get(box-sizing, $layout);
 
   @if $box {
-    @include susy-box-sizing($box);
+    @include output((box-sizing: $box));
   }
 
   @include float-container($width, $justify, $property);

data/sass/susy/language/susy/_gallery.scss

@@ -50,9 +50,9 @@
 
   // Collective Output
   @if $box == border-box or ($inside and not $box and not $global-box) {
-    @include susy-box-sizing(border-box);
+    @include output((box-sizing: border-box));
   } @else if $box == content-box {
-    @include susy-box-sizing(content-box);
+    @include output((box-sizing: content-box));
   }
 
   @include float-span-output($output...);

data/sass/susy/language/susy/_gutters.scss

@@ -8,9 +8,9 @@
 @mixin gutters(
   $span: $susy
 ) {
-  $span    : parse-gutters($span);
-  $gutters    : get-gutters($span);
-  $output     : (
+  $span: parse-gutters($span);
+  $gutters: get-gutters($span);
+  $output: (
     before: map-get($gutters, before),
     after: map-get($gutters, after),
     flow: susy-get(flow, $span),

data/sass/susy/language/susy/_rows.scss

@@ -6,7 +6,7 @@
 // -----
 // Apply to any element that should force a line break.
 @mixin break {
-  clear: both;
+  @include output((clear: both));
 }
 
 
@@ -14,7 +14,7 @@
 // -------
 // Cancel the break() effect, e.g. when using media queries.
 @mixin nobreak {
-  clear: none;
+  @include output((clear: none));
 }
 
 

data/sass/susy/language/susy/_settings.scss

@@ -42,40 +42,33 @@ $susy-keywords: (
 );
 
 
-// User Settings
-// -------------
-// - Define the $susy variable with a map of your own settings.
-// - Set EITHER $column-width OR $container
-// - Use $column-width for static layouts
-$susy: () !default;
-
-
 // Parse Susy Keywords and Maps
 // ----------------------------
 @function parse-settings(
   $short: $susy
 ) {
-  $return: ();
+  $_return: ();
 
   @if type-of($short) == map {
-    $return: $short;
+    $_return: $short;
   } @else {
     @each $item in $short {
       // strings
       @if type-of($item) == string {
         @each $key, $value in $susy-keywords {
           @if index($value, $item) {
-            $return: deep-set($return, $key, $item);
+            $_key-value: append($key, $item);
+            $_return: _susy-deep-set($_return, $_key-value...);
           }
         }
       // maps
       } @else if type-of($item) == map {
-        $return: map-merge($return, $item);
+        $_return: map-merge($_return, $item);
       }
     }
   }
 
-  @return $return;
+  @return $_return;
 }
 
 
@@ -84,30 +77,30 @@ $susy: () !default;
 @function parse-layout(
   $short
 ) {
-  $return: ();
-  $columns: ();
-  $gutters: null;
+  $_return: ();
+  $_columns: ();
+  $_gutters: null;
 
   @if not unitless(nth(nth($short, 1), 1)) {
-    $gutters: nth($short, 1);
+    $_gutters: nth($short, 1);
   } @else {
-    $columns: (columns: nth($short, 1));
-    $gutters: if(length($short) > 1, nth($short, 2), $gutters);
+    $_columns: (columns: nth($short, 1));
+    $_gutters: if(length($short) > 1, nth($short, 2), $_gutters);
   }
 
-  @if type-of($gutters) == list and length($gutters) > 0 {
-    $gutters: (
-      gutters: nth($gutters, 2) / nth($gutters, 1),
-      column-width: nth($gutters, 1),
+  @if type-of($_gutters) == list and length($_gutters) > 0 {
+    $_gutters: (
+      gutters: nth($_gutters, 2) / nth($_gutters, 1),
+      column-width: nth($_gutters, 1),
     );
   } @else {
-    $gutters: if($gutters, (gutters: $gutters), ());
+    $_gutters: if($_gutters, (gutters: $_gutters), ());
   }
 
-  $return: map-merge($return, $columns);
-  $return: map-merge($return, $gutters);
+  $_return: map-merge($_return, $_columns);
+  $_return: map-merge($_return, $_gutters);
 
-  @return $return;
+  @return $_return;
 }
 
 
@@ -116,27 +109,27 @@ $susy: () !default;
 @function parse-grid(
   $short: $susy
 ) {
-  $return: parse-settings($short);
-  $layout: ();
+  $_return: parse-settings($short);
+  $_layout: ();
 
   @if type-of($short) == map {
-    $return: $short;
+    $_return: $short;
   } @else {
     @each $item in $short {
       // number or list
       @if type-of($item) == number or type-of($item) == list {
         @if type-of($item) == list or unitless($item) {
-          $layout: append($layout, $item);
+          $_layout: append($_layout, $item);
         } @else {
-          $return: map-merge($return, (container: $item));
+          $_return: map-merge($_return, (container: $item));
         }
       }
     }
 
-    $layout: if(length($layout) > 0, parse-layout($layout), $layout);
+    $_layout: if(length($_layout) > 0, parse-layout($_layout), $_layout);
   }
 
-  @return map-merge($return, $layout);
+  @return map-merge($_return, $_layout);
 }
 
 
@@ -146,47 +139,47 @@ $susy: () !default;
   $short,
   $key: span
 ) {
-  $return: ();
+  $_return: ();
 
   @if type-of($short) == map {
-    $return: $short;
+    $_return: $short;
   } @else {
-    $at: index($short, at);
-
-    @if $at {
-      $loci: $at + 1;
-      $location: nth($short, $loci);
-      $return: map-merge($return, (location: $location));
-      $short: set-nth($short, $at, null);
-      $short: set-nth($short, $loci, null);
+    $_at: index($short, at);
+
+    @if $_at {
+      $_loci: $_at + 1;
+      $_location: nth($short, $_loci);
+      $_return: map-merge($_return, (location: $_location));
+      $short: set-nth($short, $_at, null);
+      $short: set-nth($short, $_loci, null);
     }
 
-    $i: 1;
-    $span: ();
+    $_i: 1;
+    $_span: ();
 
-    @while $i <= length($short) {
-      $this: nth($short, $i);
+    @while $_i <= length($short) {
+      $_this: nth($short, $_i);
 
-      @if type-of($this) == number {
-        $span: append($span, $this);
-        $short: set-nth($short, $i, null);
-      } @else if $this == of {
-        $short: set-nth($short, $i, null);
-        $i: length($short) + 1;
+      @if type-of($_this) == number {
+        $_span: append($_span, $_this);
+        $short: set-nth($short, $_i, null);
+      } @else if $_this == of {
+        $short: set-nth($short, $_i, null);
+        $_i: length($short) + 1;
       }
 
-      $i: $i + 1;
+      $_i: $_i + 1;
     }
 
-    @if length($span) > 0 {
-      $span: if(length($span) == 1, nth($span, 1), $span);
-      $return: map-merge($return, ($key: $span));
+    @if length($_span) > 0 {
+      $_span: if(length($_span) == 1, nth($_span, 1), $_span);
+      $_return: map-merge($_return, ($key: $_span));
     }
 
-    $return: map-merge($return, parse-grid($short));
+    $_return: map-merge($_return, parse-grid($short));
   }
 
-  @return $return;
+  @return $_return;
 }
 
 
@@ -195,70 +188,29 @@ $susy: () !default;
 @function parse-gutters(
   $short: $susy
 ) {
-  $gutters: parse-span($short, gutter-override);
-  $span: susy-get(gutter-override, $gutters);
+  $_gutters: parse-span($short, gutter-override);
+  $_span: susy-get(gutter-override, $_gutters);
 
-  @if $span and not map-get($gutters, columns) {
-    $context: ();
-    $new: ();
+  @if $_span and not map-get($_gutters, columns) {
+    $_context: ();
+    $_new: ();
 
-    @each $item in $span {
+    @each $item in $_span {
       @if type-of($item) == number and unitless($item) {
-        $context: append($context, $item);
+        $_context: append($_context, $item);
       } @else {
-        $new: append($new, $item);
+        $_new: append($_new, $item);
       }
     }
 
-    $context: parse-grid($context);
-    $new: if(length($new) == 0, null, $new);
-    $new: if(length($new) == 1, nth($new, 1), $new);
-    $new: (gutter-override: if($new != $span, $new, $span));
-
-    $gutters: map-merge($gutters, $new);
-    $gutters: map-merge($gutters, $context);
-  }
-
-  @return $gutters;
-}
-
+    $_context: parse-grid($_context);
+    $_new: if(length($_new) == 0, null, $_new);
+    $_new: if(length($_new) == 1, nth($_new, 1), $_new);
+    $_new: (gutter-override: if($_new != $_span, $_new, $_span));
 
-// Susy Set
-// --------
-// Change one setting
-// - $key   : setting name
-// - $value : setting value
-@mixin susy-set(
-  $key,
-  $value
-) {
-  $susy: deep-set($susy, $key, $value) !global;
-}
-
-
-// Susy Get
-// --------
-// Return one setting from a grid
-// - $key     : <keyword>
-// - $layout  : <settings>
-@function susy-get(
-  $key,
-  $layout: map-merge($susy-defaults, $susy)
-) {
-  $layout: parse-grid($layout);
-  $options: $layout $susy $susy-defaults;
-  $break: false;
-  $return: null;
-
-  @each $opt in $options {
-    @if type-of($opt) == map and not $break {
-      $keyset: deep-has-key($opt, $key...);
-      @if $keyset {
-        $return: deep-get($opt, $key...);
-        $break: true;
-      }
-    }
+    $_gutters: map-merge($_gutters, $_new);
+    $_gutters: map-merge($_gutters, $_context);
   }
 
-  @return $return;
+  @return $_gutters;
 }