compass-960-plugin 0.10.3 → 0.10.4
Sign up to get free protection for your applications and to get access to all the features.
- 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
|