compass-960-plugin 0.10.3 → 0.10.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.mkdn +36 -10
- data/compass-960-plugin.gemspec +2 -2
- data/stylesheets/960/_grid.sass +6 -2
- metadata +4 -4
data/README.mkdn
CHANGED
@@ -25,6 +25,19 @@ Or, If you prefer to use Sass's indentation based syntax:
|
|
25
25
|
|
26
26
|
Then edit your `grid.sass` and `text.sass` files accordingly. A reset is added into grid.sass automatically.
|
27
27
|
|
28
|
+
Adding the 960 plugin to an existing project
|
29
|
+
============================================
|
30
|
+
|
31
|
+
Add the following to your compass.rb config file:
|
32
|
+
|
33
|
+
# Require any additional compass plugins here.
|
34
|
+
require 'ninesixty'
|
35
|
+
|
36
|
+
Then make sure you have imported the grid library into your core .sass or .scss file with:
|
37
|
+
|
38
|
+
@import compass/reset
|
39
|
+
@import 960/grid
|
40
|
+
|
28
41
|
Customizing your Grid System
|
29
42
|
============================
|
30
43
|
|
@@ -42,13 +55,22 @@ Class-Based Grid System
|
|
42
55
|
=======================
|
43
56
|
|
44
57
|
To create a grid system that works like the original 960 Grid System framework
|
45
|
-
use the `+grid-system` mixin to generate the corresponding classes. You
|
46
|
-
also customize the number of columns as demonstrated
|
58
|
+
use the `+grid-system-complete` mixin to generate the corresponding classes. You
|
59
|
+
can also customize the number of columns as demonstrated:
|
47
60
|
|
48
61
|
Example:
|
62
|
+
|
63
|
+
+grid-system-complete(24)
|
64
|
+
|
65
|
+
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.
|
49
66
|
|
67
|
+
Example:
|
68
|
+
|
50
69
|
#wrap
|
51
|
-
|
70
|
+
.my_container
|
71
|
+
+grid-system(16)
|
72
|
+
|
73
|
+
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).
|
52
74
|
|
53
75
|
Making Semantic Grids
|
54
76
|
=====================
|
@@ -69,13 +91,17 @@ Example:
|
|
69
91
|
|
70
92
|
#wrap
|
71
93
|
+grid-container
|
72
|
-
#
|
73
|
-
+
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
94
|
+
#header
|
95
|
+
+grid(16)
|
96
|
+
#middle
|
97
|
+
+grid(16)
|
98
|
+
#left-nav
|
99
|
+
+grid(5)
|
100
|
+
+alpha
|
101
|
+
#main-content
|
102
|
+
+grid-prefix(1)
|
103
|
+
+grid(10)
|
104
|
+
+omega
|
79
105
|
|
80
106
|
Authors/Contributors
|
81
107
|
====================
|
data/compass-960-plugin.gemspec
CHANGED
@@ -2,11 +2,11 @@
|
|
2
2
|
|
3
3
|
Gem::Specification.new do |s|
|
4
4
|
s.name = %q{compass-960-plugin}
|
5
|
-
s.version = "0.10.
|
5
|
+
s.version = "0.10.4"
|
6
6
|
|
7
7
|
s.required_rubygems_version = Gem::Requirement.new(">= 1.3.5")
|
8
8
|
s.authors = ["Chris Eppstein", "Matt Sanders"]
|
9
|
-
s.date = %q{2011-
|
9
|
+
s.date = %q{2011-06-15}
|
10
10
|
s.description = %q{The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. http://960.gs/}
|
11
11
|
s.email = %w{chris@eppsteins.net matt@modal.org}
|
12
12
|
s.has_rdoc = false
|
data/stylesheets/960/_grid.sass
CHANGED
@@ -78,8 +78,8 @@ $ninesixty-class-separator: "_" !default
|
|
78
78
|
+grid-move-pull($n, $cols)
|
79
79
|
|
80
80
|
=grid-movements($cols: $ninesixty-columns)
|
81
|
-
#{enumerate(".push", 1, $cols, $ninesixty-class-separator)},
|
82
|
-
#{enumerate(".pull", 1, $cols, $ninesixty-class-separator)}
|
81
|
+
#{enumerate(".push", 1, $cols - 1, $ninesixty-class-separator)},
|
82
|
+
#{enumerate(".pull", 1, $cols - 1, $ninesixty-class-separator)}
|
83
83
|
+grid-move-base
|
84
84
|
@for $n from 1 through $cols - 1
|
85
85
|
.push#{$ninesixty-class-separator}#{$n}
|
@@ -94,3 +94,7 @@ $ninesixty-class-separator: "_" !default
|
|
94
94
|
+grid-suffixes($cols)
|
95
95
|
+grid-children
|
96
96
|
+grid-movements($cols)
|
97
|
+
|
98
|
+
=grid-system-complete($cols: $ninesixty-columns)
|
99
|
+
.container#{$ninesixty-class-separator}#{$cols}
|
100
|
+
+grid-system($cols)
|
metadata
CHANGED
@@ -1,13 +1,13 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: compass-960-plugin
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
hash:
|
4
|
+
hash: 63
|
5
5
|
prerelease:
|
6
6
|
segments:
|
7
7
|
- 0
|
8
8
|
- 10
|
9
|
-
-
|
10
|
-
version: 0.10.
|
9
|
+
- 4
|
10
|
+
version: 0.10.4
|
11
11
|
platform: ruby
|
12
12
|
authors:
|
13
13
|
- Chris Eppstein
|
@@ -16,7 +16,7 @@ autorequire:
|
|
16
16
|
bindir: bin
|
17
17
|
cert_chain: []
|
18
18
|
|
19
|
-
date: 2011-
|
19
|
+
date: 2011-06-15 00:00:00 -05:00
|
20
20
|
default_executable:
|
21
21
|
dependencies:
|
22
22
|
- !ruby/object:Gem::Dependency
|