compass-1024-plugin 0.1

data/README.mkdn

@@ -0,0 +1,108 @@
+1024 Grid System - Compass Plugin
+================================
+
+
+---------
+
+This plugin adds the 1024 Grid System framework to [Compass](http://compass-style.org/).
+
+Install
+=======
+
+    gem install compass-1024-plugin
+
+Create a 1024-based Compass Project
+==================================
+
+    compass create -r tentwentyfour my_project --using 1024
+
+Or, If you prefer to use Sass's indentation based syntax:
+
+    compass create -r tentwentyfour my_project --using 1024 --syntax sass
+
+Then edit your `grid.sass` and `text.sass` files accordingly. A reset is added into grid.sass automatically.
+
+Adding the 1024 plugin to an existing project
+============================================
+
+Add the following to your compass.rb config file:
+
+    # Require any additional compass plugins here.
+    require 'tentwentyfour'
+    
+Then make sure you have imported the grid library into your core .sass or .scss file with:
+
+    @import compass/reset
+    @import 1024/grid
+
+Customizing your Grid System
+============================
+
+This plugin uses the following configuration variables:
+
+* `$tentwentyfour-columns` (default: 12) controls the default number of grid columns
+* `$tentwentyfour-grid-width` (default: 1024px) controls the default overall grid width
+* `$tentwentyfour-gutter-width` (default: 20px) controls the default gutter width
+* `$tentwentyfour-class-separator` (default: '_') sets the word separator for classnames generated by +grid-system
+
+All of the mixins included with this plugin use these configuration variables
+as defaults if the corresponding argument is omitted from a mixin call.
+
+Class-Based Grid System
+=======================
+
+To create a grid system that works like the original 1024 Grid System framework
+use the `+grid-system-complete` mixin to generate the corresponding classes. You 
+can also customize the number of columns as demonstrated:
+
+Example:
+    
+    +grid-system-complete(24)
+
+If you want to scope the grid inside a specific set of selectors or control your container class' name you can use the `+grid-system` mixin instead.    
+
+Example: 
+    
+    #wrap
+      .my_container
+        +grid-system(16)
+      
+This will render all of the grid system nested below your selector, replacing the normal function of the container class (would be .container_16 in this example).
+
+Making Semantic Grids
+=====================
+
+To create a grid system using only CSS, use the following semantic grid mixins:
+
+* Use the `+grid-container` mixin to declare your container element.
+* Use the `+grid(N, columns, gutter-width)` mixin to declare a grid element.
+* Use the `+alpha` and `+omega` mixins to declare the first and last grid elements for a row.
+* Use the `+grid-prefix(N, columns)` and `+grid-suffix(N, columns)` mixins to add empty grid columns before or after a grid element.
+* Use the `+grid-push(N, columns)` and `+grid-pull(N, columns)` mixins to move a grid element from its default position.
+
+`N` is the number of grid columns to span as in `grid_N` or `push_N` with the original 1024 Grid System framework.
+
+Example:
+
+    $tentwentyfour-columns: 16
+
+    #wrap
+      +grid-container
+      #header
+        +grid(16)
+      #middle
+        +grid(16)
+        #left-nav
+          +grid(5)
+          +alpha
+        #main-content
+          +grid-prefix(1)
+          +grid(10)
+          +omega
+
+Authors/Contributors
+====================
+
+[Chris Eppstein](http://chriseppstein.github.com/) is the creator of Compass, a core contributor to Sass and the father of this plugin.
+
+[Jesse Cofie (Maze 0sl0)](http://github.com/bohan3d)  is the author of this plugin is based on the 960.gs by Nathan Simth.

data/compass-1024-plugin.gemspec

@@ -0,0 +1,29 @@
+# -*- encoding: utf-8 -*-
+
+Gem::Specification.new do |s|
+  s.name = %q{compass-1024-plugin}
+  s.version = "0.1"
+
+  s.required_rubygems_version = Gem::Requirement.new(">= 1.3.5")
+  s.authors = ["Jesse Cofie (Maze Oslo)"]
+  s.date = %q{2013-12-09}
+  s.description = %q{The 1024 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 1024 pixels.}
+  s.email = %w{mazeoslo_at_gmail.com bohan3d_at_gmail.com}
+  s.has_rdoc = false
+  s.files = [
+    "compass-1024-plugin.gemspec",
+    "README.mkdn",
+    "lib/tentwentyfour.rb",
+    "stylesheets/1024/_grid.sass",
+    "stylesheets/1024/_text.sass",
+    "templates/project/grid.sass",
+    "templates/project/manifest.rb",
+    "templates/project/text.sass"
+  ]
+  s.homepage = %q{http://github.com/bohan3d/compass-1024-plugin}
+  s.require_paths = ["lib"]
+  s.rubyforge_project = %q{compass-1024-plugin}
+  s.rubygems_version = %q{1.3.6}
+  s.summary = %q{Compass compatible Sass port of 1024.gs.}
+  s.add_dependency(%q<compass>, [">= 0.1"])
+end

data/lib/tentwentyfour.rb

@@ -0,0 +1,2 @@
+require 'compass'
+Compass::Frameworks.register("1024", :path => "#{File.dirname(__FILE__)}/..")

data/stylesheets/1024/_grid.sass

@@ -0,0 +1,100 @@
+$tentwentyfour-gutter-width: 20px !default
+
+$tentwentyfour-grid-width: 1024px !default
+
+$tentwentyfour-columns: 16 !default
+
+$tentwentyfour-class-separator: "_" !default
+
+=grid-container
+  margin-left: auto
+  margin-right: auto
+  width: $tentwentyfour-grid-width
+
+=grid-width($n, $cols: $tentwentyfour-columns, $gutter-width: $tentwentyfour-gutter-width)
+  width: $tentwentyfour-grid-width / $cols * $n - $gutter-width
+
+=grid-unit-base($gutter-width: $tentwentyfour-gutter-width)
+  display: inline
+  float: left
+  margin:
+    left: $gutter-width / 2
+    right: $gutter-width / 2
+
+=grid($n, $cols: $tentwentyfour-columns, $gutter-width: $tentwentyfour-gutter-width)
+  +grid-unit-base($gutter-width)
+  +grid-width($n, $cols, $gutter-width)
+
+=alpha
+  margin-left: 0
+
+=omega
+  margin-right: 0
+
+=grids($cols: $tentwentyfour-columns, $gutter-width: $tentwentyfour-gutter-width)
+  #{enumerate(".grid", 1, $cols, $tentwentyfour-class-separator)}
+    +grid-unit-base($gutter-width)
+  @for $n from 1 through $cols
+    .grid#{$tentwentyfour-class-separator}#{$n}
+      +grid-width($n, $cols, $gutter-width)
+
+=grid-prefix($n, $cols: $tentwentyfour-columns)
+  padding-left: $tentwentyfour-grid-width / $cols * $n
+
+=grid-prefixes($cols: $tentwentyfour-columns)
+  @for $n from 1 through $cols - 1
+    .prefix#{$tentwentyfour-class-separator}#{$n}
+      +grid-prefix($n, $cols)
+
+=grid-suffix($n, $cols: $tentwentyfour-columns)
+  padding-right: $tentwentyfour-grid-width / $cols * $n
+
+=grid-suffixes($cols: $tentwentyfour-columns)
+  @for $n from 1 through $cols - 1
+    .suffix#{$tentwentyfour-class-separator}#{$n}
+      +grid-suffix($n, $cols)
+
+=grid-children
+  .alpha
+    +alpha
+  .omega
+    +omega
+
+=grid-move-base
+  position: relative
+
+=grid-move-push($n, $cols)
+  left: ($tentwentyfour-grid-width / $cols) * $n
+
+=grid-move-pull($n, $cols)
+  left: -($tentwentyfour-grid-width / $cols) * $n
+
+=grid-push($n, $cols: $tentwentyfour-columns)
+  +grid-move-base
+  +grid-move-push($n, $cols)
+
+=grid-pull($n, $cols: $tentwentyfour-columns)
+  +grid-move-base
+  +grid-move-pull($n, $cols)
+
+=grid-movements($cols: $tentwentyfour-columns)
+  #{enumerate(".push", 1, $cols - 1, $tentwentyfour-class-separator)},
+  #{enumerate(".pull", 1, $cols - 1, $tentwentyfour-class-separator)}
+    +grid-move-base
+  @for $n from 1 through $cols - 1
+    .push#{$tentwentyfour-class-separator}#{$n}
+      +grid-move-push($n, $cols)
+    .pull#{$tentwentyfour-class-separator}#{$n}
+      +grid-move-pull($n, $cols)
+
+=grid-system($cols: $tentwentyfour-columns)
+  +grid-container
+  +grids($cols)
+  +grid-prefixes($cols)
+  +grid-suffixes($cols)
+  +grid-children
+  +grid-movements($cols)
+
+=grid-system-complete($cols: $tentwentyfour-columns)
+  .container#{$tentwentyfour-class-separator}#{$cols}
+    +grid-system($cols)

data/stylesheets/1024/_text.sass

@@ -0,0 +1,47 @@
+$tentwentyfour-font-family: unquote("Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif") !default
+
+=text($font-family: $tentwentyfour-font-family)
+  body
+    font: unquote("13px/1.5") $font-family
+  a:focus
+    outline: 1px dotted invert
+  hr
+    border-color: #cccccc
+    border-style: solid
+    border-width: 1px 0 0
+    clear: both
+    height: 0
+  h1
+    font-size: 25px
+  h2
+    font-size: 23px
+  h3
+    font-size: 21px
+  h4
+    font-size: 19px
+  h5
+    font-size: 17px
+  h6
+    font-size: 15px
+  ol
+    list-style: decimal
+  ul
+    list-style: square
+  li
+    margin-left: 30px
+  p,
+  dl,
+  hr,
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  ol,
+  ul,
+  pre,
+  table,
+  address,
+  fieldset
+    margin-bottom: 20px

data/templates/project/grid.sass

@@ -0,0 +1,12 @@
+/* 1024 Grid System ~ Core CSS.
+ * 
+ * *
+ * Licensed under GPL and MIT.
+
+@import compass/reset
+@import 1024/grid
+
+// The following generates the default grids provided by the css version of 1024.gs
+.container_16
+  +grid-system(16)
+

data/templates/project/manifest.rb

@@ -0,0 +1,19 @@
+stylesheet 'grid.sass', :media => "screen, projection"
+stylesheet 'text.sass', :media => "screen, projection"
+
+description "The 1024 Grid System."
+
+help %Q{
+No help documentation yet.
+Please see the following website for documentation related to this grid system:
+
+    http://www.gridsystemgenerator.com/gs03.php?GridWidth=1024&GridColumns=16&GridMarginLeft=10&GridMarginRight=10
+
+}
+
+welcome_message %Q{
+Please see the gridsystemgenerator website for documentation:
+
+    http://www.gridsystemgenerator.com/gs03.php?GridWidth=1024&GridColumns=16&GridMarginLeft=10&GridMarginRight=10
+}
+

data/templates/project/text.sass

@@ -0,0 +1,7 @@
+/* 1024 Grid System ~ Text CSS.
+ * *
+ * Licensed under GPL and MIT.
+
+@import 1024/text
+
++text

metadata

@@ -0,0 +1,71 @@
+--- !ruby/object:Gem::Specification
+name: compass-1024-plugin
+version: !ruby/object:Gem::Version
+  version: '0.1'
+  prerelease: 
+platform: ruby
+authors:
+- Jesse Cofie (Maze Oslo)
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2013-12-09 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: compass
+  requirement: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0.1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0.1'
+description: The 1024 Grid System is an effort to streamline web development workflow
+  by providing commonly used dimensions, based on a width of 1024 pixels.
+email:
+- mazeoslo_at_gmail.com
+- bohan3d_at_gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- compass-1024-plugin.gemspec
+- README.mkdn
+- lib/tentwentyfour.rb
+- stylesheets/1024/_grid.sass
+- stylesheets/1024/_text.sass
+- templates/project/grid.sass
+- templates/project/manifest.rb
+- templates/project/text.sass
+homepage: http://github.com/bohan3d/compass-1024-plugin
+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: 1.3.5
+requirements: []
+rubyforge_project: compass-1024-plugin
+rubygems_version: 1.8.24
+signing_key: 
+specification_version: 3
+summary: Compass compatible Sass port of 1024.gs.
+test_files: []