susy 2.0.0.alpha.1 → 2.0.0.alpha.2

data/sass/susy/math/_container.scss

@@ -0,0 +1,45 @@
+// Container math
+// ==============
+
+// Parse the $container-position into margin values
+@function parse-container-position(
+  $justify: $container-position
+) {
+  $left   : null;
+  $right  : null;
+
+  @if type-of($justify) == list {
+    $left: nth($justify,1);
+    $right: nth($justify,2);
+  } @else if type-of($justify) == number and not unitless($justify) {
+    $left: $justify;
+    $right: $justify;
+  } @else if $justify == left {
+    $left: 0;
+  } @else if $justify == right {
+    $right: 0;
+  } @else if $justify == center {
+    $left: auto;
+    $right: auto;
+  }
+
+  @return $left $right;
+}
+
+// Calculate the width of a container based on columns and gutters
+@function calculate-container-width(
+  $columns        : $columns,
+  $gutters        : $gutters,
+  $column-width   : $column-width,
+  $outer          : false
+) {
+  $width: null;
+
+  @if $column-width {
+    $width: column-sum($columns, $gutters, $outer) * $column-width;
+  } @else {
+    @warn "We need either `$column-width` or `$container` in order to create your container.";
+  }
+
+  @return $width;
+}

data/sass/susy/math/_location.scss

@@ -0,0 +1,47 @@
+// Location math
+// =============
+
+// Find if a span covers the last columns
+@function is-last(
+  $span,
+  $location,
+  $columns: $columns
+) {
+  $is-last: false;
+
+  @if $location == "last" or $location == "omega" {
+    $is-last: true;
+  } @else if $location + ($span - 1) == column-count($columns) {
+    $is-last: true;
+  }
+
+  @return $is-last;
+}
+
+// Find if a span covers the first columns
+@function is-first(
+  $location
+) {
+  @if $location == "first" or $location == "alpha" or $location == 1 {
+    @return true;
+  } @else {
+    @return false;
+  }
+}
+
+// Return a numeric location, even if a first/last keyword is used
+@function get-location-position(
+  $span,
+  $location,
+  $columns: $columns
+) {
+  @if type-of($location) == number {
+    @return $location;
+  } @else if $location == first or $location == alpha {
+    @return 1;
+  } @else if $location == last or $location == omega {
+    @return column-count($columns) - $span + 1;
+  } @else {
+    @return false;
+  }
+}

data/templates/project/README.md

@@ -3,16 +3,6 @@
 *This document currently represents the plans for Susy Next syntax,
 and not necessarily the existing functionality.*
 
-## Output Settings
-
-**Document direction:**
-- `$layout-direction: 'left to right' !default;`
-- 'ltr' | 'left to right' | 'rtl' | 'right to left' | 'both'
-
-**Default output style:**
-- `$output-style: 'float' !default;`
-- 'float' | 'isolate' | *others TBD?*
-
 ## Defining Layouts
 
 *We should avoid the "grid" terminology
@@ -28,7 +18,14 @@ For grids, we need:
 - width/ratio of columns
 - width/ratio of gutters
 
-*(?) Do we really need to manage outer margins at all? Or can they be handled easily by the user?*
+Layout styles to support:
+- ltr, rtl, mixed-direction
+- content-box or border-box sizing
+- gutters inside (padding) or outside (margin)
+- gutters before, after, or split
+
+
+*(?) Do we really need to manage grid margins at all? Or can they be handled easily by the user?*
 
 Any solution should support:
 - Arbitrary non-grid layouts
@@ -36,6 +33,34 @@ Any solution should support:
 - Symmetric and asymmetric grids
 - Any arbitrary breakpoints (min/max/both)
 
+## Functions
+
+- Need to access the width of a certain number of columns
+  - Symmetric or asymmetric
+  - With or without edge gutters (inner or outer width)
+  - In context
+
+```scss
+// symmetric
+width: span(4);
+width: span(4 of 3);
+width: span(4 of 3 outer);
+
+// asymmetric
+width: span(4 at 2);
+width: span(4 at 2 of 3 4 5 4 3);
+width: span(4 at 2 of 3 4 5 4 3 outer);
+```
+
+- Need to access the width of a single gutter
+  - In context
+
+```scss
+// symmetric
+width: gutter();
+width: gutter(3);
+```
+
 ## Container
 
 Establish a container element: `container($width)`

data/templates/project/_base.scss

@@ -1,4 +1,4 @@
-// ---------------------------------------------------------------------------
+// -------
 // Imports
 
 @import "susy";

data/templates/project/manifest.rb

@@ -1,9 +1,6 @@
 stylesheet 'screen.scss', :media => "screen, projection"
 stylesheet '_base.scss'
 
-file 'behaviors/box-sizing/boxsizing.htc'
-file 'behaviors/box-sizing/boxsizing.php'
-
 description "Susy: a flexible static/fluid/elastic grid system native to compass."
 
 help %Q{

data/templates/project/screen.scss

@@ -1,4 +1,4 @@
-// ---------------------------------------------------------------------------
+// -------
 // Imports
 
 @import "base";

metadata

@@ -1,15 +1,15 @@
 --- !ruby/object:Gem::Specification 
 name: susy
 version: !ruby/object:Gem::Version 
-  hash: 2779824819
+  hash: -1173656864
   prerelease: 6
   segments: 
   - 2
   - 0
   - 0
   - alpha
-  - 1
-  version: 2.0.0.alpha.1
+  - 2
+  version: 2.0.0.alpha.2
 platform: ruby
 authors: 
 - Eric Meyer
@@ -24,7 +24,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2013-01-23 00:00:00 Z
+date: 2013-05-03 00:00:00 Z
 dependencies: 
 - !ruby/object:Gem::Dependency 
   name: compass
@@ -58,21 +58,6 @@ dependencies:
         version: 3.2.0
   type: :runtime
   version_requirements: *id002
-- !ruby/object:Gem::Dependency 
-  name: breakpoint
-  prerelease: false
-  requirement: &id003 !ruby/object:Gem::Requirement 
-    none: false
-    requirements: 
-    - - ">="
-      - !ruby/object:Gem::Version 
-        hash: 9
-        segments: 
-        - 1
-        - 3
-        version: "1.3"
-  type: :runtime
-  version_requirements: *id003
 description: Susy is a tool for building layouts of any type with a simple shared syntax.
 email: 
 - eric@oddbird.net
@@ -95,38 +80,41 @@ extra_rdoc_files:
 files: 
 - lib/susy.rb
 - sass/_susy.scss
-- sass/README.md
-- sass/susy/_api.scss
-- sass/susy/_grids.scss
-- sass/susy/_gutters.scss
+- sass/susy/_core.scss
 - sass/susy/_helpers.scss
-- sass/susy/_language.scss
 - sass/susy/_math.scss
+- sass/susy/_settings.scss
 - sass/susy/api/_float.scss
-- sass/susy/api/_isolation.scss
-- sass/susy/grids/_add.scss
-- sass/susy/grids/_find.scss
-- sass/susy/gutters/_add.scss
-- sass/susy/gutters/_find.scss
-- sass/susy/helpers/_background-grid.scss
-- sass/susy/helpers/_box-sizing.scss
-- sass/susy/helpers/_clearfix.scss
-- sass/susy/helpers/_columns.scss
-- sass/susy/helpers/_find.scss
+- sass/susy/api/_shared.scss
+- sass/susy/api/float/_container.scss
+- sass/susy/api/float/_end.scss
+- sass/susy/api/float/_isolate.scss
+- sass/susy/api/float/_span.scss
+- sass/susy/api/shared/_container.scss
+- sass/susy/api/shared/_grid-background.scss
+- sass/susy/api/shared/_margins.scss
+- sass/susy/api/shared/_padding.scss
+- sass/susy/helpers/_direction.scss
+- sass/susy/helpers/_nth.scss
 - sass/susy/helpers/_sass-lists.scss
-- sass/susy/helpers/_span-shared.scss
-- sass/susy/language/_parse-add.scss
-- sass/susy/language/_parse-list.scss
-- sass/susy/language/_span.scss
+- sass/susy/language/_shared.scss
+- sass/susy/language/_susy.scss
+- sass/susy/language/_susy1.scss
+- sass/susy/language/shared/_context.scss
+- sass/susy/language/shared/_settings.scss
+- sass/susy/language/susy/_background.scss
+- sass/susy/language/susy/_container.scss
+- sass/susy/language/susy/_functions.scss
+- sass/susy/language/susy/_gallery.scss
+- sass/susy/language/susy/_isolate.scss
+- sass/susy/language/susy/_math.scss
+- sass/susy/language/susy/_rows.scss
+- sass/susy/language/susy/_span.scss
+- sass/susy/language/susy1/_settings.scss
 - sass/susy/math/_columns.scss
-- sass/susy/math/_context.scss
-- sass/susy/math/_gutters.scss
-- templates/box-sizing/behaviors/box-sizing/boxsizing.htc
-- templates/box-sizing/behaviors/box-sizing/boxsizing.php
-- templates/box-sizing/manifest.rb
+- sass/susy/math/_container.scss
+- sass/susy/math/_location.scss
 - templates/project/_base.scss
-- templates/project/behaviors/box-sizing/boxsizing.htc
-- templates/project/behaviors/box-sizing/boxsizing.php
 - templates/project/manifest.rb
 - templates/project/README.md
 - templates/project/screen.scss

data/sass/README.md

@@ -1,33 +0,0 @@
-SUSY NEXT
-============================
-
-## Guiding Principles
-
-Susy Next is a next-generation css layout system,
-allowing a single natural-language input API
-to create any structural output you might want.
-
-* The input API must be output-system agnostic.
-* The input API must be easy to use.
-* The output style must always be defined by the user.
-* The system must be future friendly.
-* The system must be cross-browser compatible.
-* We will not assume anything about the source HTML.
-
-## A Separation of Concerns
-
-In order to accomplish that flexibility,
-we need to split the Susy architecture into segments:
-
-1. Input Layer
-   * User facing
-   * Natural language keywords/sentence structure
-   * User facing global variables
-2. Translation Layer
-   * Translates Input into local variables to be used to calculate output
-3. Plugin API
-   * Architecture to allow for plugins. Ideally utilizing [Mixin Interpolation](https://github.com/nex3/sass/issues/626) but, until that's available, I suggest a system [similar to this](https://github.com/Snugug/sass-api-test)
-4. Output Layer
-   * Actual output of CSS
-   * Defined by individual output systems
-   * Shared components are allowed and encouraged (width calculations are going to be more or less the same, for instance)

data/sass/susy/_api.scss

@@ -1,39 +0,0 @@
-@mixin grid-span($span, $location, $context: false, $gutter: false, $output-style: $output) {
-
-  @if $output-style == 'float' {
-    @include output-float($span, $location, $context, $gutter);
-  }
-  @else if $output-style == 'isolation' {
-    @include output-isolation($span, $location, $context, $gutter);
-  }
-}
-
-@mixin push($span, $location, $context: false, $gutter: false, $output-style: $output) {
-
-  @if $output-style == 'float' {
-    @include push-float($span, $location, $context, $gutter);
-  }
-  @else if $output-style == 'isolation' {
-    @include push-isolation($span, $location, $context, $gutter);
-  }
-}
-
-@mixin pull($span, $location, $context: false, $gutter: false, $output-style: $output) {
-
-  @if $output-style == 'float' {
-    @include pull-float($span, $location, $context, $gutter);
-  }
-  @else if $output-style == 'isolation' {
-    @include pull-isolation($span, $location, $context, $gutter);
-  }
-}
-
-@mixin isolate($span, $location, $context: false, $gutter: false, $output-style: $output) {
-
-  @if $output-style == 'float' {
-    @include isolate-float($span, $location, $context, $gutter);
-  }
-}
-
-@import "api/float";
-@import "api/isolation";

data/sass/susy/_grids.scss

@@ -1,2 +0,0 @@
-@import "grids/add";
-@import "grids/find";

data/sass/susy/_gutters.scss

@@ -1,2 +0,0 @@
-@import "gutters/add";
-@import "gutters/find";

data/sass/susy/_language.scss

@@ -1,3 +0,0 @@
-@import "language/parse-list";
-@import "language/parse-add";
-@import "language/span";

data/sass/susy/api/_isolation.scss

@@ -1,16 +0,0 @@
-@mixin output-isolation($span, $location, $columns, $gutter) {
-  @include output-float($span, $location, $columns, $gutter);
-
-  @if not end-row($span, $location, $columns) {
-    @include isolate-float($location - 1, 1, $columns, $gutter);
-  }
-
-}
-
-@mixin push-isolation($span, $location, $columns: false, $gutter: false) {
-  @include push-float($span, $location, $columns, $gutter);
-}
-
-@mixin pull-isolation($span, $location, $columns: false, $gutter: false) {
-  @include pull-float($span, $location, $columns, $gutter);
-}

data/sass/susy/grids/_add.scss

@@ -1,10 +0,0 @@
-@function add-grid($grid-definition) {
-  $parsed: parse-add($grid-definition);
-
-  @if nth($parsed, 2) == false and length($grids) == 0 {
-    @return nth($parsed, 1);
-  }
-  @else {
-    @return append($grids, (nth($parsed, 1) nth($parsed, 2)), 'comma');
-  }
-}

data/sass/susy/grids/_find.scss

@@ -1,10 +0,0 @@
-//////////////////////////////
-// Find Grid
-//
-// Finds the grid that you are on.
-// From Singularity
-// Must be using Breakpoint to work properly
-//////////////////////////////
-@function find-grid($user-columns: false) {
-  @return find-object($grids, $user-columns);
-}

data/sass/susy/gutters/_add.scss

@@ -1,10 +0,0 @@
-@function add-gutter($gutter-definition) {
-  $parsed: parse-add($gutter-definition);
-
-  @if nth($parsed, 2) == false and length($gutters) == 0 {
-    @return nth($parsed, 1);
-  }
-  @else {
-    @return append($gutters, (nth($parsed, 1) nth($parsed, 2)), 'comma');
-  }
-}

data/sass/susy/gutters/_find.scss

@@ -1,10 +0,0 @@
-//////////////////////////////
-// Find gutter
-//
-// Finds the gutter that you are on.
-// From Singularity
-// Must be using Breakpoint to work properly
-//////////////////////////////
-@function find-gutter($user-gutter: false) {
-  @return find-object($gutters, $user-gutter);
-}