compass-flexbox 1.0 → 1.1

data/stylesheets/_flexbox.scss

@@ -1,16 +1,20 @@
 @import "compass/css3/shared";
 
+$flexbox-legacy-support: -moz, -webkit, not -o, not -ms, not -khtml, not official;
+$flexbox-ie-support: not -moz, not -webkit, not -o, -ms, not -khtml, not official;
+$flexbox-standard-support: not -moz, -webkit, not -o, not -ms, not -khtml, official;
+
 // Enabling flexbox: setting an element to be a flex container
 @mixin display-flex() {
-    @include experimental-value(display, box, -moz, -webkit, not -o, not -ms, not -khtml, not official);
-    @include experimental-value(display, flexbox, not -moz, not -webkit, not -o, -ms, not -khtml, not official);
-    @include experimental-value(display, flex, not -moz, -webkit, not -o, not -ms, not -khtml, official);
+    @include experimental-value(display, box, $flexbox-legacy-support...);
+    @include experimental-value(display, flexbox, $flexbox-ie-support...);
+    @include experimental-value(display, flex, $flexbox-standard-support...);
 }
 
 @mixin display-inline-flex() {
-    @include experimental-value(display, inline-box, -moz, -webkit, not -o, not -ms, not -khtml, not official);
-    @include experimental-value(display, inline-flexbox, not -moz, not -webkit, not -o, -ms, not -khtml, not official);
-    @include experimental-value(display, inline-flex, not -moz, -webkit, not -o, not -ms, not -khtml, official);
+    @include experimental-value(display, inline-box, $flexbox-legacy-support...);
+    @include experimental-value(display, inline-flexbox, $flexbox-ie-support...);
+    @include experimental-value(display, inline-flex, $flexbox-standard-support...);
 }
 
 // Axis alignment: specifying alignment of items along the main flexbox axis
@@ -142,9 +146,9 @@ $default-flex-flow: $default-flex-direction $default-flex-wrap !default;
     @if $legacy-property {
         @if $legacy-value {
             @if $standard-property == flex-direction and ($value == row-reverse or $value == column-reverse) {
-                @include experimental(box-direction, reverse, -moz, -webkit, not -o, not -ms, not -khtml, not official);
+                @include experimental(box-direction, reverse, $flexbox-legacy-support...);
             }
-            @include experimental($legacy-property, $legacy-value, -moz, -webkit, not -o, not -ms, not -khtml, not official);
+            @include experimental($legacy-property, $legacy-value, $flexbox-legacy-support...);
         }
     } @else {
         @warn _support-warning($standard-property, "legacy");
@@ -152,41 +156,41 @@ $default-flex-flow: $default-flex-direction $default-flex-wrap !default;
 
     // IE 10
     @if $ie-property and $ie-value {
-        @include experimental($ie-property, $ie-value, not -moz, not -webkit, not -o, -ms, not -khtml, not official);
+        @include experimental($ie-property, $ie-value, $flexbox-ie-support...);
     }
 
     // Chrome 21+, Opera 12.1, Firefox 22+
-    @include experimental($standard-property, $standard-value, not -moz, -webkit, not -o, not -ms, not -khtml, official);
+    @include experimental($standard-property, $standard-value, $flexbox-standard-support...);
 }
 
 @function _flex-value($property, $value, $syntax) {
-    $new-value: $value;
-    $warning: false;
+    $flexbox-new-value: $value;
+    $flexbox-warning: false;
 
     @if $property == justify-content {
         @if $value == flex-start {
             @if $syntax == legacy or $syntax == ie {
-                $new-value: start;
+                $flexbox-new-value: start;
             }
         }
         @else if $value == flex-end {
             @if $syntax == legacy or $syntax == ie {
-                $new-value: end;
+                $flexbox-new-value: end;
             }
         }
         @else if $value == space-between {
             @if $syntax == legacy {
-                $warning: "\"#{$property}: #{$value}\" does not work in the legacy Firefox implementation";
+                $flexbox-warning: "\"#{$property}: #{$value}\" does not work in the legacy Firefox implementation";
             }
             @if $syntax == legacy or $syntax == ie {
-                $new-value: justify;
+                $flexbox-new-value: justify;
             }
         }
         @else if $value == space-around {
             @if $syntax == legacy {
-                $new-value: null;
+                $flexbox-new-value: null;
             } @else if $syntax == ie {
-                $new-value: distribute;
+                $flexbox-new-value: distribute;
             }
         }
     }
@@ -194,12 +198,12 @@ $default-flex-flow: $default-flex-direction $default-flex-wrap !default;
     @if $property == align-items {
         @if $value == flex-start {
             @if $syntax == legacy or $syntax == ie {
-                $new-value: start;
+                $flexbox-new-value: start;
             }
         }
         @else if $value == flex-end {
             @if $syntax == legacy or $syntax == ie {
-                $new-value: end;
+                $flexbox-new-value: end;
             }
         }
     }
@@ -207,12 +211,12 @@ $default-flex-flow: $default-flex-direction $default-flex-wrap !default;
     @if $property == align-self {
         @if $value == flex-start {
             @if $syntax == ie {
-                $new-value: start;
+                $flexbox-new-value: start;
             }
         }
         @else if $value == flex-end {
             @if $syntax == ie {
-                $new-value: end;
+                $flexbox-new-value: end;
             }
         }
     }
@@ -220,49 +224,49 @@ $default-flex-flow: $default-flex-direction $default-flex-wrap !default;
     @if $property == align-content {
         @if $value == flex-start {
             @if $syntax == ie {
-                $new-value: start;
+                $flexbox-new-value: start;
             }
         }
         @else if $value == flex-end {
             @if $syntax == ie {
-                $new-value: end;
+                $flexbox-new-value: end;
             }
         }
         @else if $value == space-between {
             @if $syntax == ie {
-                $new-value: justify;
+                $flexbox-new-value: justify;
             }
         }
         @else if $value == space-around {
             @if $syntax == ie {
-                $new-value: distribute;
+                $flexbox-new-value: distribute;
             }
         }
     }
 
     @if $property == order {
         @if $syntax == legacy and $value < 1 {
-            $warning: "\"#{$property}\" must be a positive integer in the \"#{$syntax}\" syntax";
-            $new-value: null;
+            $flexbox-warning: "\"#{$property}\" must be a positive integer in the \"#{$syntax}\" syntax";
+            $flexbox-new-value: null;
         }
     }
 
     @if $property == flex {
         @if $syntax == legacy and type_of($value) != number {
-            $warning: "\"#{$property}\" only accepts an integer in the \"#{$syntax}\" syntax";
-            $new-value: null;
+            $flexbox-warning: "\"#{$property}\" only accepts an integer in the \"#{$syntax}\" syntax";
+            $flexbox-new-value: null;
         }
     }
 
     @if $property == flex-direction {
         @if $value == row or $value == row-reverse {
             @if $syntax == legacy {
-                $new-value: horizontal;
+                $flexbox-new-value: horizontal;
             }
         }
         @else if $value == column or $value == column-reverse {
             @if $syntax == legacy {
-                $new-value: vertical;
+                $flexbox-new-value: vertical;
             }
         }
     }
@@ -270,27 +274,27 @@ $default-flex-flow: $default-flex-direction $default-flex-wrap !default;
     @if $property == flex-wrap {
         @if $value == nowrap {
             @if $syntax == legacy {
-                $new-value: single;
+                $flexbox-new-value: single;
             }
         }
         @else if $value == wrap {
             @if $syntax == legacy {
                 @warn "\"#{$property}: #{$value}\" is not supported consistently in the \"#{$syntax}\" syntax";
-                $new-value: multiple;
+                $flexbox-new-value: multiple;
             }
         }
         @else if $value == wrap-reverse {
             @if $syntax == legacy {
-                $new-value: null;
+                $flexbox-new-value: null;
             }
         }
     }
 
-    @if $new-value == null or $warning {
-        @warn if($warning, $warning, _support-warning("#{$property}: #{$value}", $syntax));
+    @if $flexbox-new-value == null or $flexbox-warning {
+        @warn if($flexbox-warning, $flexbox-warning, _support-warning("#{$property}: #{$value}", $syntax));
     }
 
-    @return $new-value;
+    @return $flexbox-new-value;
 }
 
 @function _support-warning($value, $syntax) {

data/templates/example/compass-flexbox.html

@@ -3,7 +3,7 @@
     <head>
         <meta charset="utf-8">
         <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-        <title>Flex Box</title>
+        <title>Compass Flexbox</title>
         <meta name="description" content="">
         <meta name="viewport" content="width=device-width">
         <link rel="stylesheet" href="stylesheets/compass-flexbox.css">

metadata

@@ -1,59 +1,56 @@
---- !ruby/object:Gem::Specification 
+--- !ruby/object:Gem::Specification
 name: compass-flexbox
-version: !ruby/object:Gem::Version 
-  hash: 15
+version: !ruby/object:Gem::Version
+  version: '1.1'
   prerelease: 
-  segments: 
-  - 1
-  - 0
-  version: "1.0"
 platform: ruby
-authors: 
+authors:
 - Tim Hettler
 autorequire: 
 bindir: bin
 cert_chain: []
-
-date: 2013-06-10 00:00:00 Z
-dependencies: 
-- !ruby/object:Gem::Dependency 
+date: 2013-07-12 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
   name: sass
-  prerelease: false
-  requirement: &id001 !ruby/object:Gem::Requirement 
+  requirement: !ruby/object:Gem::Requirement
     none: false
-    requirements: 
-    - - ">="
-      - !ruby/object:Gem::Version 
-        hash: 3
-        segments: 
-        - 0
-        version: "0"
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
   type: :runtime
-  version_requirements: *id001
-- !ruby/object:Gem::Dependency 
-  name: compass
   prerelease: false
-  requirement: &id002 !ruby/object:Gem::Requirement 
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: compass
+  requirement: !ruby/object:Gem::Requirement
     none: false
-    requirements: 
-    - - ">="
-      - !ruby/object:Gem::Version 
-        hash: 3
-        segments: 
-        - 0
-        version: "0"
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
   type: :runtime
-  version_requirements: *id002
-description: A compass extension that provides variables & mixins for the latest Flexible Box Layout (flexbox) specification
-email: 
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+description: A compass extension that provides variables & mixins for the latest Flexible
+  Box Layout (flexbox) specification
+email:
 - me+github@timhettler.com
 executables: []
-
 extensions: []
-
 extra_rdoc_files: []
-
-files: 
+files:
 - lib/compass-flexbox.rb
 - stylesheets/_flexbox.scss
 - templates/example/compass-flexbox.html
@@ -61,38 +58,27 @@ files:
 - templates/example/manifest.rb
 homepage: https://github.com/timhettler/compass-flexbox
 licenses: []
-
 post_install_message: 
 rdoc_options: []
-
-require_paths: 
+require_paths:
 - lib
-required_ruby_version: !ruby/object:Gem::Requirement 
+required_ruby_version: !ruby/object:Gem::Requirement
   none: false
-  requirements: 
-  - - ">="
-    - !ruby/object:Gem::Version 
-      hash: 3
-      segments: 
-      - 0
-      version: "0"
-required_rubygems_version: !ruby/object:Gem::Requirement 
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
   none: false
-  requirements: 
-  - - ">="
-    - !ruby/object:Gem::Version 
-      hash: 23
-      segments: 
-      - 1
-      - 3
-      - 6
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
       version: 1.3.6
 requirements: []
-
 rubyforge_project: 
-rubygems_version: 1.8.25
+rubygems_version: 1.8.23
 signing_key: 
 specification_version: 3
-summary: A compass extension that provides variables & mixins for the latest Flexible Box Layout (flexbox) specification
+summary: A compass extension that provides variables & mixins for the latest Flexible
+  Box Layout (flexbox) specification
 test_files: []
-