compass-grid 0.1.0

data/README.mkdn

@@ -0,0 +1,24 @@
+Compass Grid
+====================
+
+A flexible grid system for the compass css framework
+
+
+Installation
+============
+
+From the command line:
+
+    (sudo) gem install compass-grid
+
+Add to a project:
+
+    // rails: compass.config, other: config.rb
+    require 'compass-grid'
+
+    // command line
+    compass install compass-grid
+    
+Or create a new project:
+
+    compass -r compass-grid -f compass-grid project_directory

data/lib/compass-grid.rb

@@ -0,0 +1,3 @@
+require 'compass'
+extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
+Compass::Frameworks.register("compass-grid", :path => extension_path)

data/stylesheets/_compass-grid.scss

@@ -0,0 +1 @@
+@import "compass-grid/grid";

data/stylesheets/compass-grid/_grid.scss

@@ -0,0 +1,17 @@
+@import "compass/typography/vertical_rhythm";
+
+//defaults for grid system
+$grid-debug: false;
+$grid-width: 80% !default;
+$grid-total-columns: 8 !default;
+$grid-columns-gutter: 5% !default;
+$grid-baseline-height: $base-line-height !default;
+$grid-align: center !default;
+$grid-width-min: undefined !default;
+$grid-width-max: undefined !default;
+
+@import "grid/grid";
+//@import "grid/column"
+//@import "grid/shift"
+//@import "grid/push"
+//@import "grid/rhythm"

data/stylesheets/compass-grid/grid/_column.scss

@@ -0,0 +1,45 @@
+$column-content-wrap: ".in";
+$column-gap: none;
+
+@mixin grid-column ($number-of-columns, $position: left, $column-gap-side: both) {
+	
+	// calc column width
+	width: ($number-of-columns / $grid-columns) * 100%;
+	
+	// set column position
+	@if $position == left {
+		float: left;
+	} @else {
+		float: right;
+		margin-left: -5px;
+	}
+	
+	// construct column gaps with content wraps
+	> #{$column-content-wrap} {
+		
+		@if $column-gap != none {
+			@if $column-gap-side == both {
+				margin-right: $column-gap / 2;
+				margin-left: $column-gap / 2;
+			} @else {
+				margin-#{$column-gap-side}: $column-gap / 2;
+			}
+		}
+	}
+}
+
+@mixin grid-column-equal($equal: yes) {
+	@if $equal == yes {
+		padding-bottom:32767px;
+	  margin-bottom:-32767px;
+	} @else if $equal == no {
+		padding-bottom: 0;
+		margin-bottom: 0;
+	} @else if $equal == container {
+		@include clearfix();
+		overflow: hidden; 
+	  display:block;
+		position:relative;
+	  width: 100%;
+	}
+}

data/stylesheets/compass-grid/grid/_grid.scss

@@ -0,0 +1,43 @@
+@import "compass/utilities/general/clearfix";
+@import "compass/layout/grid-background";
+
+@mixin grid($width: $grid-width, 
+            $total: $grid-total-columns, 
+            $gutter: $grid-columns-gutter, 
+            $height: $grid-baseline-height, 
+            $align: $grid-align, 
+            $width-min: $grid-width-min, 
+            $width-max: $grid-width-max) {
+  
+  // allow to override defaults
+  $grid-width: $width;
+  $grid-width-min: $width-min;
+  $grid-width-max: $width-max;
+  $grid-baseline-height: $height;
+  $grid-columns-gutter: $gutter;
+  $grid-total-columns: $total;
+  $grid-align: $align;
+  
+  & {
+	  @include clearfix;
+
+		width: $width;
+    margin-left: auto;
+    margin-right: auto;
+    text-align: left;
+    
+    @if $grid-debug {
+      $number-of-gutters: $total - 1;
+      $column-width: (100% / $total) - ($gutter * $number-of-gutters / $total);
+      @include grid-background($total, $column-width, $gutter, $offset: 0%);
+    }
+    
+    @if $width-min != undefined {
+      min-width: $width-min;
+    }
+      
+    @if $width-max != undefined {
+      max-width: $width-max;
+    }
+  }
+}

data/stylesheets/compass-grid/grid/_push.scss

@@ -0,0 +1,16 @@
+@mixin grid-push($direction, $number-of-columns: 0) {
+	// calc columns
+	$amount: ($number-of-columns / $grid-columns) * 100%;
+	
+	@if $direction == left {
+		margin-right: $amount;
+	} @else if $direction == right {
+		margin-left: $amount;
+	} @else if $direction == up {
+		margin-bottom: $number-of-columns * $grid-height;
+	} @else if $direction == down {
+		margin-top: $number-of-columns * $grid-height;
+	} @else if $direction == none {
+		margin: 0;
+	}
+}

data/stylesheets/compass-grid/grid/_rhythm.scss

@@ -0,0 +1,20 @@
+$grid-font-base: 15;
+$grid-rhythm-default: $grid-height / $grid-font-base;
+
+@mixin grid-rhythm-base {
+	font-size: ($grid-font-base / 16) * 100%;
+	$grid-rhythm-default: $grid-height / $grid-font-base;
+}
+
+@mixin grid-rhythm($divisor, $top: top, $bottom: bottom) {
+	$size: ($grid-height / $grid-font-base) / $divisor;
+	$rhythm: $divisor * 1em;
+	font-size: $size * 1em;
+	line-height: $rhythm;
+	@if $top == top {
+		margin-top: $rhythm;
+	} 
+	@if $bottom == bottom {
+		margin-bottom: $rhythm;
+	}
+}

data/stylesheets/compass-grid/grid/_shift.scss

@@ -0,0 +1,18 @@
+@mixin grid-shift($direction, $number-of-columns: 0) {
+	// calc columns
+	$amount: ($number-of-columns / $grid-columns) * 100%;
+	position: relative;
+	
+	@if $direction == left {
+		right: $amount;
+	} @else if $direction == right {
+		left: $amount;
+	} @else if $direction == up {
+		margin-top: $number-of-columns * $grid-height * -1;
+	} @else if $direction == down {
+		margin-bottom: $number-of-columns * $grid-height * -1;
+	} @else if $direction == none {
+		left: 0;
+		right: 0;
+	}
+}

metadata

@@ -0,0 +1,65 @@
+--- !ruby/object:Gem::Specification
+name: compass-grid
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+  prerelease: 
+platform: ruby
+authors:
+- Dominik Guzei
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2011-10-25 00:00:00.000000000Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: compass
+  requirement: &2153125680 !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0.11'
+  type: :runtime
+  prerelease: false
+  version_requirements: *2153125680
+description: A flexible grid system for compass css framework
+email: dominik.guzei@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- README.mkdn
+- lib/compass-grid.rb
+- stylesheets/_compass-grid.scss
+- stylesheets/compass-grid/_grid.scss
+- stylesheets/compass-grid/grid/_column.scss
+- stylesheets/compass-grid/grid/_grid.scss
+- stylesheets/compass-grid/grid/_push.scss
+- stylesheets/compass-grid/grid/_rhythm.scss
+- stylesheets/compass-grid/grid/_shift.scss
+- templates/project/manifest.rb
+homepage: http://wizzart.at
+licenses: []
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 1.8.11
+signing_key: 
+specification_version: 3
+summary: A flexible grid system for compass css framework
+test_files: []