compass-unsemantic 0.1

data/stylesheets/sass/partials/_unsemantic-ie-snap.sass

@@ -0,0 +1,12 @@
+//
+// Fix for IE in Windows 8 "snap" mode.
+//
+// http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design
+//
+// Without affecting Windows Phone IE.
+//
+// http://timkadlec.com/2013/01/windows-phone-8-and-device-width
+//
+@media screen and (max-width: 400px)
+  @-ms-viewport
+    width: 320px

data/stylesheets/sass/partials/_unsemantic-vars.sass

@@ -0,0 +1,224 @@
+// These mixins are intended to be used from:
+//
+//   * _unsemantic-grid-base.sass
+//   * _unsemantic-grid-mobile.sass
+//   * _unsemantic-grid-desktop.sass
+//
+// But could be used in your own styles, via class
+// names of your choice. You don't *have* to be
+// unsemantic. That's entirely up to you! :)
+
+// If you don't need IE7 support, set a flag in the top-level scope.
+//
+//   $unsemantic-ie7-support: false
+//
+// If you do not declare that variable, the default setting is true.
+
+@import "compass/css3"
+
+// `Variables
+//----------------------------------------------------------------------------------------------------
+
+$unsemantic-ie7-support: true !default
+
+$container-max-width: 1200px !default
+
+$gutter-half: 10px !default
+
+$lang-forward: left !default
+
+$lang-reverse: right !default
+
+// `Clear floated elements.
+//----------------------------------------------------------------------------------------------------
+
+// http://sonspring.com/journal/clearing-floats
+
+%clear
+  clear: both
+  display: block
+  overflow: hidden
+  visibility: hidden
+  width: 0
+  height: 0
+
+// http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified
+
+%clearfix:before,
+%clearfix:after
+  content: "."
+  display: block
+  overflow: hidden
+  visibility: hidden
+  font-size: 0
+  line-height: 0
+  width: 0
+  height: 0
+
+%clearfix:after
+  clear: both
+
+@if $unsemantic-ie7-support
+  %clearfix
+    /* <IE7> */
+    *zoom: 1
+    /* </IE7> */
+
+// `Container
+//----------------------------------------------------------------------------------------------------
+
+%grid-container
+  @extend %clearfix
+  margin-left: auto
+  margin-right: auto
+  max-width: $container-max-width
+
+  // Set if gutter is non-zero
+  @if $gutter-half != 0
+    padding-left: $gutter-half
+    padding-right: $gutter-half
+
+// `Grid columns.
+//----------------------------------------------------------------------------------------------------
+
+%grid-columns-all
+  +box-sizing(border-box)
+
+  // Set if gutter is non-zero
+  @if $gutter-half != 0
+    padding-left: $gutter-half
+    padding-right: $gutter-half
+
+    @if $unsemantic-ie7-support
+      // [1] Remove padding, since IE7 doesn't
+      //     support "box-sizing: border-box".
+
+      /* <IE7> */
+      *padding-left: 0
+      *padding-right: 0
+      /* </IE7> */
+
+      //
+      // [2] Fake what would normally be padding,
+      //     for browsers that support box-sizing.
+      & > *
+        /* <IE7> */
+        *margin-left: expression((!this.className.match(/grid-[1-9]/) && this.currentStyle.display === "block" && this.currentStyle.width === "auto") && "#{$gutter-half}")
+        *margin-right: expression((!this.className.match(/grid-[1-9]/) && this.currentStyle.display === "block" && this.currentStyle.width === "auto") && "#{$gutter-half}")
+        /* </IE7> */
+
+// `Push & Pull, to rearrange column order (for potential "SEO").
+//----------------------------------------------------------------------------------------------------
+
+// Remove padding, if it's being used
+// as a parent for other grid columns.
+%grid-parent
+  padding-left: 0
+  padding-right: 0
+
+// Allows columns to be offset +/- left.
+%grid-columns-push-pull
+  position: relative
+
+// `Hide on desktop/tablet/mobile.
+//----------------------------------------------------------------------------------------------------
+
+%hide
+  display: none !important
+
+// `Grid columns.
+//----------------------------------------------------------------------------------------------------
+
+//
+// For 5 through 95 percent.
+//
+
+@for $i from 1 through 19
+  $num: $i * 5
+  $decimal: $num / 100
+  $percent: $num * 1%
+
+  %grid-#{$num}
+    float: $lang-forward
+    width: $percent
+
+    @if $unsemantic-ie7-support
+      /* <IE7> */
+      *width: expression(Math.floor(#{$decimal} * (this.parentNode.offsetWidth - parseFloat(this.parentNode.currentStyle.paddingLeft) - parseFloat(this.parentNode.currentStyle.paddingRight))) + "px")
+      /* </IE7> */
+
+  %prefix-#{$num}
+    margin-#{$lang-forward}: $percent
+
+  %suffix-#{$num}
+    margin-#{$lang-reverse}: $percent
+
+  %push-#{$num}
+    #{$lang-forward}: $percent
+
+    @if $unsemantic-ie7-support
+      /* <IE7> */
+      *#{$lang-forward}: expression(Math.floor(#{$decimal} * (this.parentNode.offsetWidth - parseFloat(this.parentNode.currentStyle.paddingLeft) - parseFloat(this.parentNode.currentStyle.paddingRight))) + "px")
+      /* </IE7> */
+
+  %pull-#{$num}
+    #{$lang-forward}: $percent * -1
+
+    @if $unsemantic-ie7-support
+      /* <IE7> */
+      *#{$lang-forward}: expression(Math.floor(#{$decimal * -1} * (this.parentNode.offsetWidth - parseFloat(this.parentNode.currentStyle.paddingLeft) - parseFloat(this.parentNode.currentStyle.paddingRight))) + "px")
+      /* </IE7> */
+
+//
+// For one-third and two-thirds.
+//
+
+@for $i from 1 through 2
+  $num: $i * 33
+  $one-third: 1/3
+  $decimal: $i * $one-third
+  $percent: ($num + $decimal) * 1%
+
+  // Percentage based widths.
+  %grid-#{$num}
+    float: $lang-forward
+    width: $percent
+
+    @if $unsemantic-ie7-support
+      /* <IE7> */
+      *width: expression(Math.floor(#{$decimal} * (this.parentNode.offsetWidth - parseFloat(this.parentNode.currentStyle.paddingLeft) - parseFloat(this.parentNode.currentStyle.paddingRight))) + "px")
+      /* </IE7> */
+
+  // Prefix, to add extra columns before.
+  %prefix-#{$num}
+    margin-#{$lang-forward}: $percent
+
+  // Suffix, to add extra columns after.
+  %suffix-#{$num}
+    margin-#{$lang-reverse}: $percent
+
+  // Push & Pull, to rearrange column order (for potential "SEO").
+  %push-#{$num}
+    #{$lang-forward}: $percent
+
+    @if $unsemantic-ie7-support
+      /* <IE7> */
+      *#{$lang-forward}: expression(Math.floor(#{$decimal} * (this.parentNode.offsetWidth - parseFloat(this.parentNode.currentStyle.paddingLeft) - parseFloat(this.parentNode.currentStyle.paddingRight))) + "px")
+      /* </IE7> */
+
+  %pull-#{$num}
+    #{$lang-forward}: $percent * -1
+
+    @if $unsemantic-ie7-support
+      /* <IE7> */
+      *#{$lang-forward}: expression(Math.floor(#{$decimal * -1} * (this.parentNode.offsetWidth - parseFloat(this.parentNode.currentStyle.paddingLeft) - parseFloat(this.parentNode.currentStyle.paddingRight))) + "px")
+      /* </IE7> */
+
+//
+// Full width, just line-break.
+//
+
+%grid-100
+  @extend %clearfix
+  clear: both
+  width: 100%

data/stylesheets/sass/unsemantic-grid-base-no-ie7-rtl.sass

@@ -0,0 +1,11 @@
+$unsemantic-ie7-support: false
+
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base"

data/stylesheets/sass/unsemantic-grid-base-no-ie7.sass

@@ -0,0 +1,4 @@
+$unsemantic-ie7-support: false
+
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base"

data/stylesheets/sass/unsemantic-grid-base-rtl.sass

@@ -0,0 +1,9 @@
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base"

data/stylesheets/sass/unsemantic-grid-base-tablet-no-ie7-rtl.sass

@@ -0,0 +1,11 @@
+$unsemantic-ie7-support: false
+
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base-tablet"

data/stylesheets/sass/unsemantic-grid-base-tablet-no-ie7.sass

@@ -0,0 +1,5 @@
+$unsemantic-with-tablet: true
+$unsemantic-ie7-support: false
+
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base"

data/stylesheets/sass/unsemantic-grid-base-tablet-rtl.sass

@@ -0,0 +1,9 @@
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base-tablet"

data/stylesheets/sass/unsemantic-grid-base-tablet.sass

@@ -0,0 +1,4 @@
+$unsemantic-with-tablet: true
+
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base"

data/stylesheets/sass/unsemantic-grid-base.sass

@@ -0,0 +1,2 @@
+@import "partials/unsemantic-ie-snap"
+@import "partials/unsemantic-grid-base"

data/stylesheets/sass/unsemantic-grid-desktop-no-ie7-rtl.sass

@@ -0,0 +1,10 @@
+$unsemantic-ie7-support: false
+
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-desktop"

data/stylesheets/sass/unsemantic-grid-desktop-no-ie7.sass

@@ -0,0 +1,3 @@
+$unsemantic-ie7-support: false
+
+@import "partials/unsemantic-grid-desktop"

data/stylesheets/sass/unsemantic-grid-desktop-rtl.sass

@@ -0,0 +1,8 @@
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-desktop"

data/stylesheets/sass/unsemantic-grid-desktop.sass

@@ -0,0 +1 @@
+@import "partials/unsemantic-grid-desktop"

data/stylesheets/sass/unsemantic-grid-mobile-no-ie7-rtl.sass

@@ -0,0 +1,10 @@
+$unsemantic-ie7-support: false
+
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-mobile"

data/stylesheets/sass/unsemantic-grid-mobile-no-ie7.sass

@@ -0,0 +1,3 @@
+$unsemantic-ie7-support: false
+
+@import "partials/unsemantic-grid-mobile"

data/stylesheets/sass/unsemantic-grid-mobile-rtl.sass

@@ -0,0 +1,8 @@
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-mobile"

data/stylesheets/sass/unsemantic-grid-mobile.sass

@@ -0,0 +1 @@
+@import "partials/unsemantic-grid-mobile"

data/stylesheets/sass/unsemantic-grid-responsive-no-ie7-rtl.sass

@@ -0,0 +1,10 @@
+$unsemantic-ie7-support: false
+
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-responsive"

data/stylesheets/sass/unsemantic-grid-responsive-no-ie7.sass

@@ -0,0 +1,3 @@
+$unsemantic-ie7-support: false
+
+@import "partials/unsemantic-grid-responsive"

data/stylesheets/sass/unsemantic-grid-responsive-rtl.sass

@@ -0,0 +1,8 @@
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-responsive"

data/stylesheets/sass/unsemantic-grid-responsive-tablet-no-ie7-rtl.sass

@@ -0,0 +1,10 @@
+$unsemantic-ie7-support: false
+
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-responsive-tablet"

data/stylesheets/sass/unsemantic-grid-responsive-tablet-no-ie7.sass

@@ -0,0 +1,3 @@
+$unsemantic-ie7-support: false
+
+@import "partials/unsemantic-grid-responsive-tablet"

data/stylesheets/sass/unsemantic-grid-responsive-tablet-rtl.sass

@@ -0,0 +1,8 @@
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-responsive-tablet"

data/stylesheets/sass/unsemantic-grid-responsive-tablet.sass

@@ -0,0 +1 @@
+@import "partials/unsemantic-grid-responsive-tablet"

data/stylesheets/sass/unsemantic-grid-responsive.sass

@@ -0,0 +1 @@
+@import "partials/unsemantic-grid-responsive"

data/stylesheets/sass/unsemantic-grid-tablet-no-ie7-rtl.sass

@@ -0,0 +1,10 @@
+$unsemantic-ie7-support: false
+
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-tablet"

data/stylesheets/sass/unsemantic-grid-tablet-no-ie7.sass

@@ -0,0 +1,3 @@
+$unsemantic-ie7-support: false
+
+@import "partials/unsemantic-grid-tablet"

data/stylesheets/sass/unsemantic-grid-tablet-rtl.sass

@@ -0,0 +1,8 @@
+//
+// For right-to-left languages.
+// (Hebrew, Arabic, etc.)
+//
+$lang-forward: right
+$lang-reverse: left
+
+@import "partials/unsemantic-grid-tablet"