shelves 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
data/.gitignore ADDED
@@ -0,0 +1,17 @@
1
+ *.gem
2
+ *.rbc
3
+ .bundle
4
+ .config
5
+ .yardoc
6
+ Gemfile.lock
7
+ InstalledFiles
8
+ _yardoc
9
+ coverage
10
+ doc/
11
+ lib/bundler/man
12
+ pkg
13
+ rdoc
14
+ spec/reports
15
+ test/tmp
16
+ test/version_tmp
17
+ tmp
data/Gemfile ADDED
@@ -0,0 +1,2 @@
1
+ source :rubygems
2
+ gemspec
data/LICENSE ADDED
@@ -0,0 +1,22 @@
1
+ Copyright (c) 2012 Pete Browne
2
+
3
+ MIT License
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining
6
+ a copy of this software and associated documentation files (the
7
+ "Software"), to deal in the Software without restriction, including
8
+ without limitation the rights to use, copy, modify, merge, publish,
9
+ distribute, sublicense, and/or sell copies of the Software, and to
10
+ permit persons to whom the Software is furnished to do so, subject to
11
+ the following conditions:
12
+
13
+ The above copyright notice and this permission notice shall be
14
+ included in all copies or substantial portions of the Software.
15
+
16
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,41 @@
1
+ Shelves CSS Grid
2
+ ================
3
+
4
+ **The only responsive, fluid CSS grid with infinitely nestable columns.**
5
+
6
+ TODO: Add longer description & Feature list.
7
+
8
+
9
+ Installation
10
+ ------------
11
+
12
+ ### For CSS Users
13
+
14
+ Download the latest distribution of [the CSS file](https://raw.github.com/petebrowne/shelves/master/css/shelves.css) and go to town.
15
+
16
+ ### For SCSS Users (Compass & Rails)
17
+
18
+ Add the shelves gem to your Gemfile and import it:
19
+
20
+ ``` ruby
21
+ # ...
22
+ gem 'shelves'
23
+ # ...
24
+ ```
25
+
26
+ ``` scss
27
+ // @import "shelves"; // Import just the mixins
28
+ @import "shelves-grid"; // Import mixins & default grid
29
+ ```
30
+
31
+
32
+ Usage
33
+ -----
34
+
35
+ TODO...
36
+
37
+
38
+ Copyright
39
+ ---------
40
+
41
+ Copyright (c) 2012 [Pete Browne](http://petebrowne.com). See LICENSE for details.
data/Rakefile ADDED
@@ -0,0 +1,22 @@
1
+ #!/usr/bin/env rake
2
+ require 'bundler/gem_tasks'
3
+
4
+ desc 'Generate shelves.css'
5
+ task :generate do
6
+ require 'sprockets'
7
+ require 'sprockets-sass'
8
+ require 'sass'
9
+ require 'compass'
10
+
11
+ Compass.configuration do |compass|
12
+ compass.output_style = :compact
13
+ compass.line_comments = false
14
+ end
15
+
16
+ env = Sprockets::Environment.new
17
+ env.append_path 'scss'
18
+
19
+ File.open 'css/shelves.css', 'w' do |f|
20
+ f.write env['shelves-grid.css'].to_s
21
+ end
22
+ end
data/lib/shelves.rb ADDED
@@ -0,0 +1,21 @@
1
+ require 'shelves/version'
2
+
3
+ module Shelves
4
+ # Returns the path to the root of the project.
5
+ def self.root
6
+ @root_path ||= File.expand_path '../..', __FILE__
7
+ end
8
+
9
+ # Returns the path to the main stylesheets directory.
10
+ def self.stylesheets_path
11
+ @stylesheets_path ||= File.join root, 'scss'
12
+ end
13
+ end
14
+
15
+ if defined? ::Rails
16
+ require 'shelves/extensions/rails'
17
+ elsif defined? ::Sprockets::Plugin
18
+ require 'shelves/extensions/sprockets'
19
+ else
20
+ require 'shelves/extensions/compass'
21
+ end
@@ -0,0 +1,3 @@
1
+ require 'compass'
2
+
3
+ Compass::Frameworks.register 'shelves', :stylesheets_directory => Shelves.stylesheets_path
@@ -0,0 +1,11 @@
1
+ require 'rails/engine'
2
+
3
+ module Shelves
4
+ module Extensions
5
+ class Rails < ::Rails::Engine
6
+ initializer :append_shelves_asset_path, :after => :append_assets_path, :group => :all do |app|
7
+ app.config.assets.paths.unshift Shelves.stylesheets_path
8
+ end
9
+ end
10
+ end
11
+ end
@@ -0,0 +1,9 @@
1
+ require 'sprockets/plugin'
2
+
3
+ module Shelves
4
+ module Extensions
5
+ class Sprockets < ::Sprockets::Plugin
6
+ append_path Shelves.stylesheets_path
7
+ end
8
+ end
9
+ end
@@ -0,0 +1,3 @@
1
+ module Shelves
2
+ VERSION = '0.1.0'
3
+ end
@@ -0,0 +1,3 @@
1
+ @import "shelves";
2
+
3
+ @include shelves;
data/scss/shelves.scss ADDED
@@ -0,0 +1,13 @@
1
+ /*
2
+ SHELVES
3
+ -------
4
+
5
+ The only responsive, fluid CSS grid with infinitely nestable columns.
6
+
7
+ Copyright (c) 2012, Pete Browne
8
+ */
9
+
10
+ @import "compass/utilities/general/clearfix";
11
+ @import "shelves/settings";
12
+ @import "shelves/functions";
13
+ @import "shelves/mixins";
@@ -0,0 +1,104 @@
1
+ // Returns the width of a single column (without gutters) as
2
+ // a percentage. If given a $context, this returns the column
3
+ // width relative to that number of columns.
4
+ //
5
+ // $context - The number of columns encapsulating the column.
6
+ // Defaults to the full width of the grid.
7
+ //
8
+ @function column-width($context: $shelves-columns) {
9
+ @if $context >= $shelves-columns {
10
+ @return $shelves-column-width;
11
+ }
12
+ @else {
13
+ @return $shelves-column-width * (100% / columns-width($context));
14
+ }
15
+ }
16
+
17
+ // Returns the width of the gutter as a percentage. If given a $context,
18
+ // this returns the gutter width relative to that number of columns.
19
+ //
20
+ // $context - The number of columns encapsulating the gutter.
21
+ // Defaults to the full width of the grid.
22
+ //
23
+ @function column-gutter($context: $shelves-columns) {
24
+ @if $context >= $shelves-columns {
25
+ @return $shelves-gutter;
26
+ }
27
+ @else {
28
+ @return $shelves-gutter * (100% / columns-width($context));
29
+ }
30
+ }
31
+
32
+ // Returns the total width (including gutters) of the given
33
+ // number of columns. If given a $context, this returns the
34
+ // width relative to that number of columns.
35
+ //
36
+ // $n - The number of columns to measure.
37
+ // $context - The number of columns encapsulating the columns.
38
+ // Defaults to the full width of the grid.
39
+ //
40
+ @function columns-width($n, $context: $shelves-columns) {
41
+ @if $n >= $shelves-columns {
42
+ @return 100%;
43
+ }
44
+
45
+ $column-width: $shelves-column-width;
46
+ $column-gutter: $shelves-gutter;
47
+
48
+ @if $context < $shelves-columns {
49
+ $column-width: column-width($context);
50
+ $column-gutter: column-gutter($context);
51
+ }
52
+
53
+ @return $column-width * $n + $column-gutter * ($n - 1);
54
+ }
55
+
56
+ // Returns the total distance to shift a column the given
57
+ // number of columns. If given a $context, this returns the
58
+ // distance relative to that number of columns.
59
+ //
60
+ // $n - The number of columns to measure.
61
+ // $context - The number of columns encapsulating the columns.
62
+ // Defaults to the full width of the grid.
63
+ //
64
+ @function columns-distance($n, $context: $shelves-columns) {
65
+ @return columns-width($n, $context) + column-gutter($context);
66
+ }
67
+
68
+ // Returns a column selector with the given class name,
69
+ // appended with the given index.
70
+ //
71
+ // $class-name - The class name to build the selector from.
72
+ // It should NOT have a preceding ".".
73
+ // $index - The index to append at the end. It will
74
+ // be separated by $separator.
75
+ // $separator - The separator between the class name and index.
76
+ // Defaults to $shelves-separator.
77
+ //
78
+ @function column-selector($class-name, $index, $separator: $shelves-separator) {
79
+ @return ".#{$class-name}#{$separator}#{$index}";
80
+ }
81
+
82
+ // Returns a list consisting of a range of numbers leading up to
83
+ // the last number.
84
+ //
85
+ // range(1, 6); // 1, 2, 3, 4, 5
86
+ // range(1, 6, $step: 2); // 1, 3, 5
87
+ //
88
+ // Arguments:
89
+ //
90
+ // $start - The start of the range.
91
+ // $end - The end of the range. This is exclusive, so this
92
+ // number will not be in the returned range.
93
+ // $step - Step by the given number to create the range.
94
+ // Defaults to 1.
95
+ //
96
+ @function range($start, $end, $step: 1) {
97
+ $list: $start;
98
+ $i: $start + $step;
99
+ @while $i < $end {
100
+ $list: join($list, $i);
101
+ $i: $i + $step;
102
+ }
103
+ @return $list;
104
+ }
@@ -0,0 +1,4 @@
1
+ @import "shelves/mixins/base";
2
+ @import "shelves/mixins/modifiers";
3
+ @import "shelves/mixins/resets";
4
+ @import "shelves/mixins/generators";
@@ -0,0 +1,27 @@
1
+ // Default Grid Settings
2
+ $shelves-width: 1140px !default;
3
+ $shelves-max-width: $shelves-width !default;
4
+ $shelves-min-width: 767px !default;
5
+ $shelves-columns: 12 !default;
6
+ $shelves-mobile-columns: 4 !default;
7
+ $shelves-margin: 20px !default;
8
+ $shelves-gutter: 20px !default;
9
+
10
+ // Calculate the column width and gutter
11
+ @if unit($shelves-gutter) != "%" {
12
+ $shelves-gutter: percentage($shelves-gutter / $shelves-max-width);
13
+ }
14
+ $shelves-column-width: (100% - ($shelves-columns - 1) * $shelves-gutter) / $shelves-columns !default;
15
+
16
+ // Default Class Names
17
+ // (Note the lack of the preceding ".")
18
+ $shelves-container-name: "container" !default;
19
+ $shelves-row-name: "row" !default;
20
+ $shelves-column-name: "column" !default;
21
+ $shelves-prefix-name: "prefix" !default;
22
+ $shelves-suffix-name: "suffix" !default;
23
+ $shelves-push-name: "push" !default;
24
+ $shelves-pull-name: "pull" !default;
25
+ $shelves-separator: "-" !default;
26
+ $shelves-mobile-column-name: "mobile-column" !default;
27
+ $shelves-columns-selector: "[class*=\"#{$shelves-column-name}#{$shelves-separator}\"]" !default;
@@ -0,0 +1,111 @@
1
+ // Includes the styles for the container element - namely
2
+ // some outer margins for fluid sizes.
3
+ //
4
+ // $margin - The outer margins. Defaults to $shelves-margin.
5
+ //
6
+ @mixin container($margin: $shelves-margin) {
7
+ padding-left: $margin;
8
+ padding-right: $margin;
9
+ }
10
+
11
+ // Includes the styles for the row element. This includes
12
+ // a clearfix, widths, and centering.
13
+ //
14
+ // $max-width - The max width of the row element. If this is
15
+ // false, the row is completely fluid. Defaults
16
+ // to $shelves-max-width.
17
+ // $min-width - The min width, for browsers that don't support
18
+ // media queries. Defaults to $shelves-min-width.
19
+ // $mobile-reset - Include styles for resetting the row at
20
+ // mobile sizes. Defaults to true.
21
+ //
22
+ @mixin row($max-width: $shelves-max-width, $min-width: $shelves-min-width, $mobile-reset: true) {
23
+ @include pie-clearfix;
24
+ width: 100%;
25
+
26
+ @if $max-width != false {
27
+ max-width: $max-width;
28
+ margin-left: auto;
29
+ margin-right: auto;
30
+ }
31
+
32
+ @if $min-width != false {
33
+ min-width: $min-width;
34
+
35
+ .#{$shelves-row-name} {
36
+ min-width: 0;
37
+ }
38
+ }
39
+
40
+ @if $mobile-reset != false {
41
+ @media screen and (max-width: 767px) {
42
+ @include reset-row;
43
+ }
44
+ }
45
+ }
46
+
47
+ // Creates a column that spans the given number of
48
+ // grid columns.
49
+ //
50
+ // $n - The number of columns the element should span.
51
+ // $context - The number of columns encapsulating the element.
52
+ // Defaults to the full width of the grid.
53
+ // $mobile-reset - Include styles for resetting the column at
54
+ // mobile sizes. Defaults to true.
55
+ //
56
+ @mixin column($n, $context: $shelves-columns, $mobile-reset: true) {
57
+ @include column-base($mobile-reset);
58
+ @include column-gutter($context);
59
+ @include columns-width($n, $context);
60
+ }
61
+
62
+ // Sets up an element to be a column in the grid system.
63
+ // This is used internally to generate grids, Use column($n)
64
+ // instead to create fully functioning columns.
65
+ //
66
+ // $mobile-reset - Include styles for resetting the column at
67
+ // mobile sizes. Defaults to true.
68
+ //
69
+ @mixin column-base($mobile-reset: true) {
70
+ display: block;
71
+ float: left;
72
+ min-height: 1px;
73
+ position: relative;
74
+
75
+ @if $legacy-support-for-ie7 {
76
+ *margin-right: -1px;
77
+ }
78
+
79
+ @if $mobile-reset != false {
80
+ @media screen and (max-width: 767px) {
81
+ @include reset-column;
82
+ }
83
+ }
84
+ }
85
+
86
+ // Sets the width of the element to the given number of columns.
87
+ //
88
+ // $n - The number of columns the element should span.
89
+ // $context - The number of columns encapsulating the element.
90
+ // Defaults to the full width of the grid.
91
+ //
92
+ @mixin columns-width($n, $context: $shelves-columns) {
93
+ width: columns-width($n, $context);
94
+ }
95
+
96
+ // Includes the gutter for a column on the grid.
97
+ //
98
+ // $context - The number of columns encapsulating the element.
99
+ // Defaults to the full width of the grid.
100
+ // $include-first-column - Includes the styles for removing the gutter
101
+ // on the first column in a row. Defaults to true.
102
+ //
103
+ @mixin column-gutter($context: $shelves-columns, $include-first-column: true) {
104
+ margin-left: column-gutter($context);
105
+
106
+ @if $include-first-column == true {
107
+ &:first-child {
108
+ @include reset-column-gutter;
109
+ }
110
+ }
111
+ }
@@ -0,0 +1,200 @@
1
+ // Generates the entire grid, made up of reusable classes for a modular OOCSS
2
+ // approach to using the grid. All of the class names can be customized.
3
+ //
4
+ // $include-nested-columns - Include nested columns in the default grid.
5
+ // Defaults to true.
6
+ // $include-mobile-resets - Include mobile resets (remove grid for mobile
7
+ // sizes). Defaults to true.
8
+ // $include-mobile-columns - Include mobile columns (special column classes
9
+ // for mobile sizes). Defaults to true.
10
+ // $include-prefix - Include prefix classes. Deafults to true.
11
+ // $include-suffix - Include suffix classes. Deafults to true.
12
+ // $include-push - Include push classes. Deafults to true.
13
+ // $include-pull - Include pull classes. Deafults to true.
14
+ // $include-nested-prefix - Include prefix classes for neseted columns.
15
+ // Defaults to true.
16
+ // $include-nested-suffix - Include suffix classes for neseted columns.
17
+ // Defaults to true.
18
+ // $include-nested-push - Include push classes for neseted columns.
19
+ // Defaults to false.
20
+ // $include-nested-pull - Include pull classes for neseted columns.
21
+ // Defaults to false.
22
+ //
23
+ @mixin shelves(
24
+ $include-nested-columns: true,
25
+ $include-mobile-resets: true,
26
+ $include-mobile-columns: true,
27
+ $include-prefix: true,
28
+ $include-suffix: true,
29
+ $include-push: true,
30
+ $include-pull: true,
31
+ $include-nested-prefix: true,
32
+ $include-nested-suffix: true,
33
+ $include-nested-push: false,
34
+ $include-nested-pull: false
35
+ ) {
36
+
37
+ @include shelves-base;
38
+ @include shelves-columns(
39
+ $include-column-gutter: false,
40
+ $include-prefix: $include-prefix,
41
+ $include-suffix: $include-suffix,
42
+ $include-push: $include-push,
43
+ $include-pull: $include-pull
44
+ );
45
+
46
+ @if $include-nested-columns == true {
47
+ @for $i from 1 to $shelves-columns - 1 {
48
+ // Loop background through the columns
49
+ // to cascade the nested column properties.
50
+ $i: $shelves-columns - $i;
51
+
52
+ #{column-selector($shelves-column-name, $i)} {
53
+ @include shelves-columns(
54
+ $start: 1,
55
+ $end: $i,
56
+ $context: $i,
57
+ $include-column-gutter: true,
58
+ $include-prefix: $include-nested-prefix,
59
+ $include-suffix: $include-nested-suffix,
60
+ $include-push: $include-nested-push,
61
+ $include-pull: $include-nested-pull
62
+ );
63
+ }
64
+ }
65
+ }
66
+
67
+ @media screen and (max-width: 767px) {
68
+ @if $include-mobile-resets == true {
69
+ @include shelves-resets;
70
+ }
71
+ @if $include-mobile-columns == true {
72
+ @include shelves-mobile-columns;
73
+ }
74
+ }
75
+ }
76
+
77
+ // Generates the grid's base classes, namely the
78
+ // the row and container elements.
79
+ @mixin shelves-base {
80
+ .#{$shelves-container-name} {
81
+ @include container;
82
+ }
83
+
84
+ .#{$shelves-row-name} {
85
+ @include row($mobile-reset: false);
86
+ }
87
+
88
+ #{$shelves-columns-selector}, {
89
+ @include column-base($mobile-reset: false);
90
+ @include column-gutter($include-first-column: false);
91
+
92
+ &,
93
+ & #{$shelves-columns-selector} {
94
+ &:first-child {
95
+ @include reset-column-gutter;
96
+ }
97
+ }
98
+ }
99
+ }
100
+
101
+ // Generates the classes used for laying out and modifying
102
+ // the columns. This can be used in different contexts, varying
103
+ // the number of columns if necessary.
104
+ //
105
+ // $start - Index to start the loop at. Defaults to 1.
106
+ // $end - Where to end the loop. Defaults to $shelves-columns.
107
+ // $context - The context of generated classes.
108
+ // Defaults to $shelves-columns.
109
+ // $include-column-gutter - Include generic column gutter for the given context.
110
+ // Defaults to true.
111
+ // $include-prefix - Include prefix classes. Deafults to true.
112
+ // $include-suffix - Include suffix classes. Deafults to true.
113
+ // $include-push - Include push classes. Deafults to true.
114
+ // $include-pull - Include pull classes. Deafults to true.
115
+ //
116
+ @mixin shelves-columns(
117
+ $start: 1,
118
+ $end: $shelves-columns,
119
+ $context: $shelves-columns,
120
+ $include-column-gutter: true,
121
+ $include-prefix: true,
122
+ $include-suffix: true,
123
+ $include-push: true,
124
+ $include-pull: true
125
+ ) {
126
+ @if $include-column-gutter {
127
+ #{$shelves-columns-selector} {
128
+ @include column-gutter($context, false);
129
+ }
130
+ }
131
+
132
+ @for $i from $start to $end {
133
+ #{column-selector($shelves-column-name, $i)} {
134
+ @include columns-width($i, $context);
135
+ }
136
+ }
137
+
138
+ @if $include-prefix == true {
139
+ @for $i from $start to $end {
140
+ #{column-selector($shelves-prefix-name, $i)} {
141
+ @include column-prefix($i, $context);
142
+ }
143
+ }
144
+ }
145
+
146
+ @if $include-suffix == true {
147
+ @for $i from $start to $end {
148
+ #{column-selector($shelves-suffix-name, $i)} {
149
+ @include column-suffix($i, $context);
150
+ }
151
+ }
152
+ }
153
+
154
+ @if $include-push == true {
155
+ @for $i from $start to $end {
156
+ #{column-selector($shelves-push-name, $i)} {
157
+ @include column-push($i, $context);
158
+ }
159
+ }
160
+ }
161
+
162
+ @if $include-pull == true {
163
+ @for $i from $start to $end {
164
+ #{column-selector($shelves-pull-name, $i)} {
165
+ @include column-pull($i, $context);
166
+ }
167
+ }
168
+ }
169
+ }
170
+
171
+ // Resets the row and column elements so they take up
172
+ // the full width of their parent element. All modifying
173
+ // effects are removed from columns as well.
174
+ @mixin shelves-resets {
175
+ .#{$shelves-row-name} {
176
+ @include reset-row;
177
+ }
178
+
179
+ #{$shelves-columns-selector} {
180
+ &,
181
+ & #{$shelves-columns-selector} {
182
+ @include reset-column;
183
+ }
184
+ }
185
+ }
186
+
187
+ // Generates the classes for columns on mobile devices.
188
+ @mixin shelves-mobile-columns {
189
+ .#{$shelves-mobile-column-name} {
190
+ @include column-base($mobile-reset: false);
191
+ @include column-gutter($include-first-column: false);
192
+
193
+ $mobile-step: floor($shelves-columns / $shelves-mobile-columns);
194
+ @each $i in range($start: $mobile-step, $end: $shelves-columns, $step: $mobile-step) {
195
+ &#{column-selector($shelves-column-name, $i)} {
196
+ @include columns-width($i);
197
+ }
198
+ }
199
+ }
200
+ }
@@ -0,0 +1,43 @@
1
+ // Adds a padding suffix (which shifts the column to the right)
2
+ // spanning the given number of columns.
3
+ //
4
+ // $n - The number of columns to pad.
5
+ // $context - The number of columns encapsulating the element.
6
+ // Defaults to the full width of the grid.
7
+ //
8
+ @mixin column-prefix($n, $context: $shelves-columns) {
9
+ padding-left: columns-distance($n, $context);
10
+ }
11
+
12
+ // Adds a padding suffix (which shifts the column to the left)
13
+ // spanning the given number of columns.
14
+ //
15
+ // $n - The number of columns to pad.
16
+ // $context - The number of columns encapsulating the element.
17
+ // Defaults to the full width of the grid.
18
+ //
19
+ @mixin column-suffix($n, $context: $shelves-columns) {
20
+ padding-right: columns-distance($n, $context);
21
+ }
22
+
23
+ // Reorder the content by shifting the column to the right. This
24
+ // is often used in conjunction with column-pull($n).
25
+ //
26
+ // $n - The number of columns to shift.
27
+ // $context - The number of columns encapsulating the element.
28
+ // Defaults to the full width of the grid.
29
+ //
30
+ @mixin column-push($n, $context: $shelves-columns) {
31
+ left: columns-distance($n, $context);
32
+ }
33
+
34
+ // Reorder the content by shifting the column to the left. This
35
+ // is often used in conjunction with column-push($n).
36
+ //
37
+ // $n - The number of columns to shift.
38
+ // $context - The number of columns encapsulating the element.
39
+ // Defaults to the full width of the grid.
40
+ //
41
+ @mixin column-pull($n, $context: $shelves-columns) {
42
+ right: columns-distance($n, $context);
43
+ }
@@ -0,0 +1,50 @@
1
+ // Reset a row to expand to the full width of
2
+ // its container and remove margins.
3
+ @mixin reset-row {
4
+ margin-left: 0;
5
+ margin-right: 0;
6
+ width: 100%;
7
+ min-width: 0;
8
+ }
9
+
10
+ // Resets a column to expand to the full width of
11
+ // its container and remove float & margins.
12
+ @mixin reset-column {
13
+ @include reset-column-gutter;
14
+ @include reset-column-prefix;
15
+ @include reset-column-suffix;
16
+ @include reset-column-push;
17
+ @include reset-column-pull;
18
+ float: none;
19
+ width: auto;
20
+
21
+ @if $legacy-support-for-ie7 {
22
+ *margin-right: 0px;
23
+ }
24
+ }
25
+
26
+ // Removes the gutter of a column in a grid. This is usually added
27
+ // to the first column in a row.
28
+ @mixin reset-column-gutter {
29
+ margin-left: 0;
30
+ }
31
+
32
+ // Removes the padding prefix added to a column.
33
+ @mixin reset-column-prefix {
34
+ padding-left: 0;
35
+ }
36
+
37
+ // Removes the padding suffix added to a column.
38
+ @mixin reset-column-suffix {
39
+ padding-right: 0;
40
+ }
41
+
42
+ // Removes the column shifting added with a column-push($n).
43
+ @mixin reset-column-push {
44
+ left: auto;
45
+ }
46
+
47
+ // Removes the column shifting added with a column-pull($n).
48
+ @mixin reset-column-pull {
49
+ right: auto;
50
+ }
data/shelves.gemspec ADDED
@@ -0,0 +1,23 @@
1
+ # -*- encoding: utf-8 -*-
2
+ $:.push File.expand_path('../lib', __FILE__)
3
+ require 'shelves/version'
4
+
5
+ Gem::Specification.new do |gem|
6
+ gem.authors = ['Pete Browne']
7
+ gem.email = ['me@petebrowne.com']
8
+ gem.description = %q{The only responsive, fluid CSS grid with infinitely nestable columns.}
9
+ gem.summary = %q{The only responsive, fluid CSS grid with infinitely nestable columns.}
10
+ gem.homepage = 'https://github.com/petebrowne/shelves'
11
+
12
+ gem.executables = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
13
+ gem.files = `git ls-files`.split("\n").reject{ |f| File.fnmatch?('css/*', f) }
14
+ gem.test_files = `git ls-files -- {test,spec,features}/*`.split("\n")
15
+ gem.name = 'shelves'
16
+ gem.require_paths = ['lib']
17
+ gem.version = Shelves::VERSION
18
+
19
+ gem.add_runtime_dependency 'sass', '~> 3.1'
20
+ gem.add_runtime_dependency 'compass', '~> 0.12'
21
+ gem.add_development_dependency 'sprockets', '~> 2.3'
22
+ gem.add_development_dependency 'sprockets-sass', '~> 0.7'
23
+ end
metadata ADDED
@@ -0,0 +1,144 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: shelves
3
+ version: !ruby/object:Gem::Version
4
+ hash: 27
5
+ prerelease:
6
+ segments:
7
+ - 0
8
+ - 1
9
+ - 0
10
+ version: 0.1.0
11
+ platform: ruby
12
+ authors:
13
+ - Pete Browne
14
+ autorequire:
15
+ bindir: bin
16
+ cert_chain: []
17
+
18
+ date: 2012-03-22 00:00:00 Z
19
+ dependencies:
20
+ - !ruby/object:Gem::Dependency
21
+ name: sass
22
+ prerelease: false
23
+ requirement: &id001 !ruby/object:Gem::Requirement
24
+ none: false
25
+ requirements:
26
+ - - ~>
27
+ - !ruby/object:Gem::Version
28
+ hash: 5
29
+ segments:
30
+ - 3
31
+ - 1
32
+ version: "3.1"
33
+ type: :runtime
34
+ version_requirements: *id001
35
+ - !ruby/object:Gem::Dependency
36
+ name: compass
37
+ prerelease: false
38
+ requirement: &id002 !ruby/object:Gem::Requirement
39
+ none: false
40
+ requirements:
41
+ - - ~>
42
+ - !ruby/object:Gem::Version
43
+ hash: 19
44
+ segments:
45
+ - 0
46
+ - 12
47
+ version: "0.12"
48
+ type: :runtime
49
+ version_requirements: *id002
50
+ - !ruby/object:Gem::Dependency
51
+ name: sprockets
52
+ prerelease: false
53
+ requirement: &id003 !ruby/object:Gem::Requirement
54
+ none: false
55
+ requirements:
56
+ - - ~>
57
+ - !ruby/object:Gem::Version
58
+ hash: 5
59
+ segments:
60
+ - 2
61
+ - 3
62
+ version: "2.3"
63
+ type: :development
64
+ version_requirements: *id003
65
+ - !ruby/object:Gem::Dependency
66
+ name: sprockets-sass
67
+ prerelease: false
68
+ requirement: &id004 !ruby/object:Gem::Requirement
69
+ none: false
70
+ requirements:
71
+ - - ~>
72
+ - !ruby/object:Gem::Version
73
+ hash: 5
74
+ segments:
75
+ - 0
76
+ - 7
77
+ version: "0.7"
78
+ type: :development
79
+ version_requirements: *id004
80
+ description: The only responsive, fluid CSS grid with infinitely nestable columns.
81
+ email:
82
+ - me@petebrowne.com
83
+ executables: []
84
+
85
+ extensions: []
86
+
87
+ extra_rdoc_files: []
88
+
89
+ files:
90
+ - .gitignore
91
+ - Gemfile
92
+ - LICENSE
93
+ - README.md
94
+ - Rakefile
95
+ - lib/shelves.rb
96
+ - lib/shelves/extensions/compass.rb
97
+ - lib/shelves/extensions/rails.rb
98
+ - lib/shelves/extensions/sprockets.rb
99
+ - lib/shelves/version.rb
100
+ - scss/shelves-grid.scss
101
+ - scss/shelves.scss
102
+ - scss/shelves/_functions.scss
103
+ - scss/shelves/_mixins.scss
104
+ - scss/shelves/_settings.scss
105
+ - scss/shelves/mixins/_base.scss
106
+ - scss/shelves/mixins/_generators.scss
107
+ - scss/shelves/mixins/_modifiers.scss
108
+ - scss/shelves/mixins/_resets.scss
109
+ - shelves.gemspec
110
+ homepage: https://github.com/petebrowne/shelves
111
+ licenses: []
112
+
113
+ post_install_message:
114
+ rdoc_options: []
115
+
116
+ require_paths:
117
+ - lib
118
+ required_ruby_version: !ruby/object:Gem::Requirement
119
+ none: false
120
+ requirements:
121
+ - - ">="
122
+ - !ruby/object:Gem::Version
123
+ hash: 3
124
+ segments:
125
+ - 0
126
+ version: "0"
127
+ required_rubygems_version: !ruby/object:Gem::Requirement
128
+ none: false
129
+ requirements:
130
+ - - ">="
131
+ - !ruby/object:Gem::Version
132
+ hash: 3
133
+ segments:
134
+ - 0
135
+ version: "0"
136
+ requirements: []
137
+
138
+ rubyforge_project:
139
+ rubygems_version: 1.8.11
140
+ signing_key:
141
+ specification_version: 3
142
+ summary: The only responsive, fluid CSS grid with infinitely nestable columns.
143
+ test_files: []
144
+