framous 0.2.2 → 0.2.3

data/stylesheets/framous/_grid.scss

@@ -1,201 +0,0 @@
-//
-// Grid.scss 
-// The default grid uses 12 columns.
-// A setting that can be easily overridden in /base/settings.scss
-//
-
-//
-// Imports
-//
-
-@import "compass/css3/box-sizing";
-
-// $border-box-sizing: true !default;
-// Makes all elements have a border-box layout
-
-@if $border-box-sizing == true {
-  * {
-    @include box-sizing(border-box);
-  }
-}
-
-$fg-column: $column;
-$fg-gutter: $gutter;
-$fg-max-columns: $grid-columns;
-$fg-max-width: $max-width;
-$parent-columns: $grid-columns !default;
-
-// outer wrapper center container
-@mixin outer-container() {
-  @include clearfix;
-  max-width: $fg-max-width;
-  text-align: left;
-  margin: {
-    left: auto;
-    right: auto;
-  }
-}
-
-// Grid span columns
-// Use the span-columns mixin to specify the number of columns an element:
-// @include span-columns($span: $columns of $container-columns, $display: block)
-// eg. Element that spans across 6 columns (out of the default 12)
-// div.element { @include span-columns(6 of 8); }
-@mixin span-columns($span: $columns of $container-columns, $display: block) {
-
-  $columns: nth($span, 1);
-  $container-columns: container-span($span);
-
-  @if $container-columns != $grid-columns {
-    $parent-columns: $container-columns;
-  }
-
-  @if $display == table {
-    display: table-cell;
-    padding-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns) + flex-gutter($container-columns);
-
-    &:last-child {
-      padding-right: 0;
-    }
-  }
-
-  @else if $display == inline-block {
-    @include inline-block;
-    margin-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns);
-
-    &:last-child {
-      margin-right: 0;
-    }
-  }
-
-  @else {
-    display: block;
-    float: left;
-    margin-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns);
-
-    &:last-child {
-      margin-right: 0;
-    }
-  }
-}
-
-// Clearfix / row container
-// In order to clear floated or table-cell columns:
-@mixin row($display: block) {
-  @include clearfix;
-  @if $display == table {
-    display: table;
-  }
-
-  @else {
-    display: block;
-  }
-}
-
-// Shift
-// To move an element to the left or right by a number of columns:
-@mixin shift($n-columns: 1) {
-  margin-left: $n-columns * flex-grid(1, $parent-columns) + $n-columns * flex-gutter($parent-columns);
-}
-
-// Pad
-// To add padding around the entire column use pad().
-// By default it adds the same value as the grid's gutter.
-@mixin pad($padding: flex-gutter()) {
-  padding: $padding;
-}
-
-// Remove element gutter
-@mixin omega($display: block, $direction: right) {
-  @if $display == table {
-    padding-#{$direction}: 0;
-  }
-
-  @else {
-    margin-#{$direction}: 0;
-  }
-}
-
-// You can also use nth-omega to remove the gutter of a specific column or set of columns
-@mixin nth-omega($nth, $display: block, $direction: right) {
-  @if $display == table {
-    &:nth-child(#{$nth}) {
-      padding-#{$direction}: 0;
-    }
-  }
-
-  @else {
-    &:nth-child(#{$nth}) {
-      margin-#{$direction}: 0;
-    }
-  }
-}
-
-// Fill 100% of parent
-// This makes sure that the child fills 100% of its parent
-@mixin fill-parent() {
-  width: 100%;
-
-  @if $border-box-sizing == false {
-    @include box-sizing(border-box);
-  }
-}
-
-// Breakpoints
-// The breakpoint() mixin allows you to use media-queries to modify both the grid and the layout.
-// It takes two arguments:
-@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) {
-
-  @if length($query) == 1 {
-    @media screen and ($default-feature: nth($query, 1)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 2 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 3 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 3);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 4 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 5 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 5);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else {
-    @warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
-  }
-}
- 

data/stylesheets/framous/_settings.scss

@@ -1,42 +0,0 @@
-//
-// Settings.scss
-//
-
-//
-// 1. Responsive Grid
-//
-
-// Column width
-$column: 145px !default;
-// Gutter between each two columns
-$gutter: 9px !default;
-// Total number of columns in the grid (Total Columns For Main Container)
-$grid-columns: 12 !default;
-// Max-width of the outer container
-$max-width: 1024px !default;
-// Makes all elements have a border-box layout
-$border-box-sizing: true !default;
-// Default @media feature for the breakpoint() mixin
-$default-feature: min-width;
-
-//
-// 2. Responsive Breakpoints
-// @see http://css-tricks.com/snippets/css/media-queries-for-standard-devices
-//
-
-// Smartphones (portrait and landscape)
-$phone:							min-device-width 320px max-device-width 479px;
-// Smartphones (portrait)
-$phone-portrait:		max-width 319px;
-// Smartphones (landscape)
-$phone-landscape:		min-width 320px max-width 479px;
-// iPads (portrait and landscape)
-$ipad:							min-device-width 768px;
-// iPads (portrait)
-$ipad-portrait:			min-device-width 768px max-device-width 1024px orientation portrait;
-// iPads (landscape)
-$ipad-landscape:		min-device-width 768px max-device-width 1024px orientation landscape;
-// Desktops and laptops
-$desktop:						min-width 1024px;
-// iPhone 4
-$retina:						-webkit-min-device-pixel-ratio 1.5 min-device-pixel-ratio 1.5;