ezy 0.2.9 → 0.3.0.beta
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.
- checksums.yaml +4 -4
- data/VERSION +1 -1
- data/ezy.gemspec +2 -2
- data/sass/ezy/grid/_layout.scss +30 -4
- data/templates/project/assets/config.rb +45 -0
- data/templates/project/assets/css/screen.css +657 -0
- data/templates/project/assets/img/test-sprite/alien.png +0 -0
- data/templates/project/assets/img/test-sprite/classic.png +0 -0
- data/templates/project/assets/img/test-sprite/indy.png +0 -0
- data/templates/project/assets/img/test-sprite.png +0 -0
- data/templates/project/assets/img/test-sprite@2x/classic.png +0 -0
- data/templates/project/assets/img/test-sprite@2x/indy.png +0 -0
- data/templates/project/assets/img/test-sprite@2x.png +0 -0
- data/templates/project/assets/js/html5shiv-3.6.2.js +8 -0
- data/templates/project/assets/sass/core/_base.scss +2 -0
- data/templates/project/assets/sass/core/_layouts.scss +88 -0
- data/templates/project/assets/sass/core/_settings.scss +2 -0
- data/templates/project/assets/sass/lib/_normalize.scss +396 -0
- data/templates/project/assets/sass/partials/_sprite-examples.scss +43 -0
- data/templates/project/assets/sass/screen.scss +17 -0
- data/templates/project/index.html +83 -23
- data/templates/project/manifest.rb +39 -8
- data/test/css/grid/elastic.css +5 -5
- data/test/css/grid/fluid.css +17 -17
- data/test/css/grid/gutter.css +18 -18
- data/test/css/grid/layout/fluid.css +12 -12
- data/test/css/grid/layout/grid-settings.css +149 -0
- data/test/css/grid/layout/responsive.css +41 -35
- data/test/css/grid/layout.css +20 -20
- data/test/css/grid/responsive.css +20 -20
- data/test/css/sprites/layout.css +2 -2
- data/test/css/sprites/position.css +4 -4
- data/test/css/sprites/repeat.css +2 -2
- data/test/css/sprites/resolution.css +2 -2
- data/test/css/sprites/responsive.css +7 -7
- data/test/css/sprites/retina.css +2 -2
- data/test/css/sprites/simple.css +1 -1
- data/test/css/sprites/spacing.css +2 -2
- data/test/html/grid/grid-settings.html +75 -0
- data/test/scss/grid/layout/grid-settings.scss +101 -0
- metadata +24 -7
- data/templates/project/_settings.scss +0 -32
- data/templates/project/screen.scss +0 -40
|
@@ -1,18 +1,49 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
# Manifest documentation here: http://compass-style.org/help/tutorials/extensions/
|
|
2
|
+
# Install module template: compass create <project name> -r ezy -u ezy
|
|
3
3
|
|
|
4
|
+
# Description
|
|
4
5
|
description "Ezy Grid: a minimal grid framework with mammoth potential."
|
|
5
6
|
|
|
7
|
+
# Import all files and folders
|
|
8
|
+
discover :directories
|
|
9
|
+
|
|
10
|
+
# Skip auto creating a config.rb
|
|
11
|
+
no_configuration_file!
|
|
12
|
+
|
|
13
|
+
# Skip compiling styles
|
|
14
|
+
# skip_compilation!
|
|
15
|
+
|
|
16
|
+
# Stylesheet Import
|
|
17
|
+
file 'assets/sass/screen.scss', :to => :css
|
|
18
|
+
|
|
19
|
+
# Javascript Import
|
|
20
|
+
# file 'scripts.js', :like => :javascript, :to => 'scripts.js'
|
|
21
|
+
|
|
22
|
+
# General File Import
|
|
23
|
+
# file 'README.md', :to => "README.md"
|
|
24
|
+
file 'index.html', :to => "index.html"
|
|
25
|
+
|
|
26
|
+
# Compass Extension Help
|
|
6
27
|
help %Q{
|
|
7
|
-
|
|
28
|
+
All documentation can be found here:
|
|
29
|
+
|
|
30
|
+
http://raahede.github.io/ezy/
|
|
8
31
|
|
|
9
|
-
|
|
32
|
+
Go here for source code:
|
|
33
|
+
|
|
34
|
+
http://github.com/raahede/ezy
|
|
10
35
|
}
|
|
11
36
|
|
|
37
|
+
# Compass Extension Welcome Message
|
|
38
|
+
# Users will see this when they create a new project using this template.
|
|
12
39
|
welcome_message %Q{
|
|
13
|
-
|
|
40
|
+
All documentation can be found here:
|
|
41
|
+
|
|
42
|
+
http://raahede.github.io/ezy/
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
|
|
14
48
|
|
|
15
|
-
http://github.com/raahede/ezy-grid
|
|
16
49
|
|
|
17
|
-
To get started, set up your grid in the base partial by following the inline instructions.
|
|
18
|
-
}
|
data/test/css/grid/elastic.css
CHANGED
|
@@ -56,16 +56,16 @@
|
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
.grid {
|
|
59
|
-
margin-left: -1.
|
|
60
|
-
margin-right: -1.
|
|
59
|
+
margin-left: -1.42857%;
|
|
60
|
+
margin-right: -1.42857%;
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
.column {
|
|
64
64
|
/* Spanning 4 of 12 columns */
|
|
65
|
-
width: 30.
|
|
65
|
+
width: 30.55556%;
|
|
66
66
|
float: left;
|
|
67
67
|
/* Fixing double margin on IE6 */
|
|
68
68
|
_display: inline;
|
|
69
|
-
margin-left: 1.
|
|
70
|
-
margin-right: 1.
|
|
69
|
+
margin-left: 1.38889%;
|
|
70
|
+
margin-right: 1.38889%;
|
|
71
71
|
}
|
data/test/css/grid/fluid.css
CHANGED
|
@@ -41,8 +41,8 @@
|
|
|
41
41
|
}
|
|
42
42
|
|
|
43
43
|
.grid {
|
|
44
|
-
margin-left: -1.
|
|
45
|
-
margin-right: -1.
|
|
44
|
+
margin-left: -1.42857%;
|
|
45
|
+
margin-right: -1.42857%;
|
|
46
46
|
}
|
|
47
47
|
|
|
48
48
|
/* -------------------------------------------------------------------- *
|
|
@@ -50,32 +50,32 @@
|
|
|
50
50
|
*/
|
|
51
51
|
.span-columns-2 {
|
|
52
52
|
/* Spanning 2 of 12 columns */
|
|
53
|
-
width: 13.
|
|
53
|
+
width: 13.88889%;
|
|
54
54
|
float: left;
|
|
55
55
|
/* Fixing double margin on IE6 */
|
|
56
56
|
_display: inline;
|
|
57
|
-
margin-left: 1.
|
|
58
|
-
margin-right: 1.
|
|
57
|
+
margin-left: 1.38889%;
|
|
58
|
+
margin-right: 1.38889%;
|
|
59
59
|
}
|
|
60
60
|
|
|
61
61
|
.span-columns-4 {
|
|
62
62
|
/* Spanning 4 of 12 columns */
|
|
63
|
-
width: 30.
|
|
63
|
+
width: 30.55556%;
|
|
64
64
|
float: left;
|
|
65
65
|
/* Fixing double margin on IE6 */
|
|
66
66
|
_display: inline;
|
|
67
|
-
margin-left: 1.
|
|
68
|
-
margin-right: 1.
|
|
67
|
+
margin-left: 1.38889%;
|
|
68
|
+
margin-right: 1.38889%;
|
|
69
69
|
}
|
|
70
70
|
|
|
71
71
|
.span-columns-6 {
|
|
72
72
|
/* Spanning 6 of 12 columns */
|
|
73
|
-
width: 47.
|
|
73
|
+
width: 47.22222%;
|
|
74
74
|
float: left;
|
|
75
75
|
/* Fixing double margin on IE6 */
|
|
76
76
|
_display: inline;
|
|
77
|
-
margin-left: 1.
|
|
78
|
-
margin-right: 1.
|
|
77
|
+
margin-left: 1.38889%;
|
|
78
|
+
margin-right: 1.38889%;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
/* -------------------------------------------------------------------- *
|
|
@@ -83,8 +83,8 @@
|
|
|
83
83
|
*/
|
|
84
84
|
.span-columns-2, .span-columns-4, .span-columns-6, .span-columns-18 {
|
|
85
85
|
/* Grid column base at a 12-column context */
|
|
86
|
-
margin-left: 1.
|
|
87
|
-
margin-right: 1.
|
|
86
|
+
margin-left: 1.38889%;
|
|
87
|
+
margin-right: 1.38889%;
|
|
88
88
|
float: left;
|
|
89
89
|
/* Fixing double margin on IE6 */
|
|
90
90
|
_display: inline;
|
|
@@ -92,17 +92,17 @@
|
|
|
92
92
|
|
|
93
93
|
.span-columns-2 {
|
|
94
94
|
/* Spanning 2 of 12 columns */
|
|
95
|
-
width: 13.
|
|
95
|
+
width: 13.88889%;
|
|
96
96
|
}
|
|
97
97
|
|
|
98
98
|
.span-columns-4 {
|
|
99
99
|
/* Spanning 4 of 12 columns */
|
|
100
|
-
width: 30.
|
|
100
|
+
width: 30.55556%;
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
.span-columns-6 {
|
|
104
104
|
/* Spanning 6 of 12 columns */
|
|
105
|
-
width: 47.
|
|
105
|
+
width: 47.22222%;
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
/* -------------------------------------------------------------------- *
|
|
@@ -110,5 +110,5 @@
|
|
|
110
110
|
*/
|
|
111
111
|
.span-columns-18 {
|
|
112
112
|
/* Spanning 18 of 12 columns */
|
|
113
|
-
width: 147.
|
|
113
|
+
width: 147.22222%;
|
|
114
114
|
}
|
data/test/css/grid/gutter.css
CHANGED
|
@@ -180,8 +180,8 @@
|
|
|
180
180
|
* -------------------------------------------------------------------- */
|
|
181
181
|
.gutter-default-a-9, .gutter-default-b-9, .gutter-padding-a-10, .gutter-padding-b-10, .gutter-default-a-11, .gutter-default-b-11, .gutter-margin-a-12, .gutter-margin-b-12 {
|
|
182
182
|
/* Grid column base at a 6-column context */
|
|
183
|
-
margin-left: 2.
|
|
184
|
-
margin-right: 2.
|
|
183
|
+
margin-left: 2.77778%;
|
|
184
|
+
margin-right: 2.77778%;
|
|
185
185
|
float: left;
|
|
186
186
|
/* Fixing double margin on IE6 */
|
|
187
187
|
_display: inline;
|
|
@@ -192,12 +192,12 @@
|
|
|
192
192
|
*/
|
|
193
193
|
.gutter-default-a-9 {
|
|
194
194
|
/* Spanning 3 of 6 columns */
|
|
195
|
-
width: 44.
|
|
195
|
+
width: 44.44444%;
|
|
196
196
|
}
|
|
197
197
|
|
|
198
198
|
.gutter-default-b-9 {
|
|
199
199
|
/* Spanning 6 of 6 columns */
|
|
200
|
-
width: 94.
|
|
200
|
+
width: 94.44444%;
|
|
201
201
|
}
|
|
202
202
|
|
|
203
203
|
/* -------------------------------------------------------------------- *
|
|
@@ -205,16 +205,16 @@
|
|
|
205
205
|
*/
|
|
206
206
|
.gutter-padding-a-10 {
|
|
207
207
|
/* Spanning 3 of 6 columns */
|
|
208
|
-
width: 44.
|
|
209
|
-
padding-left: 2.
|
|
210
|
-
padding-right: 2.
|
|
208
|
+
width: 44.44444%;
|
|
209
|
+
padding-left: 2.77778%;
|
|
210
|
+
padding-right: 2.77778%;
|
|
211
211
|
}
|
|
212
212
|
|
|
213
213
|
.gutter-padding-b-10 {
|
|
214
214
|
/* Spanning 6 of 6 columns */
|
|
215
|
-
width: 94.
|
|
216
|
-
padding-left: 2.
|
|
217
|
-
padding-right: 2.
|
|
215
|
+
width: 94.44444%;
|
|
216
|
+
padding-left: 2.77778%;
|
|
217
|
+
padding-right: 2.77778%;
|
|
218
218
|
}
|
|
219
219
|
|
|
220
220
|
/* -------------------------------------------------------------------- *
|
|
@@ -222,16 +222,16 @@
|
|
|
222
222
|
*/
|
|
223
223
|
.gutter-default-a-11 {
|
|
224
224
|
/* Spanning 3 of 6 columns */
|
|
225
|
-
width: 44.
|
|
226
|
-
padding-left: 2.
|
|
227
|
-
padding-right: 2.
|
|
225
|
+
width: 44.44444%;
|
|
226
|
+
padding-left: 2.77778%;
|
|
227
|
+
padding-right: 2.77778%;
|
|
228
228
|
}
|
|
229
229
|
|
|
230
230
|
.gutter-default-b-11 {
|
|
231
231
|
/* Spanning 6 of 6 columns */
|
|
232
|
-
width: 94.
|
|
233
|
-
padding-left: 2.
|
|
234
|
-
padding-right: 2.
|
|
232
|
+
width: 94.44444%;
|
|
233
|
+
padding-left: 2.77778%;
|
|
234
|
+
padding-right: 2.77778%;
|
|
235
235
|
}
|
|
236
236
|
|
|
237
237
|
/* -------------------------------------------------------------------- *
|
|
@@ -239,10 +239,10 @@
|
|
|
239
239
|
*/
|
|
240
240
|
.gutter-margin-a-12 {
|
|
241
241
|
/* Spanning 3 of 6 columns */
|
|
242
|
-
width: 44.
|
|
242
|
+
width: 44.44444%;
|
|
243
243
|
}
|
|
244
244
|
|
|
245
245
|
.gutter-margin-b-12 {
|
|
246
246
|
/* Spanning 6 of 6 columns */
|
|
247
|
-
width: 94.
|
|
247
|
+
width: 94.44444%;
|
|
248
248
|
}
|
|
@@ -34,8 +34,8 @@
|
|
|
34
34
|
|
|
35
35
|
.span-1, .span-2, .span-3, .span-4, .span-5, .span-6, .span-7, .span-8, .span-9, .span-10, .span-11, .span-12 {
|
|
36
36
|
/* Grid column base at a 12-column context */
|
|
37
|
-
margin-left: 1.
|
|
38
|
-
margin-right: 1.
|
|
37
|
+
margin-left: 1.04167%;
|
|
38
|
+
margin-right: 1.04167%;
|
|
39
39
|
float: left;
|
|
40
40
|
/* Fixing double margin on IE6 */
|
|
41
41
|
_display: inline;
|
|
@@ -50,8 +50,8 @@
|
|
|
50
50
|
}
|
|
51
51
|
|
|
52
52
|
.grid {
|
|
53
|
-
margin-left: -1.
|
|
54
|
-
margin-right: -1.
|
|
53
|
+
margin-left: -1.06383%;
|
|
54
|
+
margin-right: -1.06383%;
|
|
55
55
|
}
|
|
56
56
|
|
|
57
57
|
.span-1, .span-2, .span-3, .span-4, .span-5, .span-6, .span-7, .span-8, .span-9, .span-10, .span-11, .span-12 {
|
|
@@ -67,12 +67,12 @@
|
|
|
67
67
|
|
|
68
68
|
.span-2 {
|
|
69
69
|
/* Spanning 2 of 12 columns */
|
|
70
|
-
width: 14.
|
|
70
|
+
width: 14.58333%;
|
|
71
71
|
}
|
|
72
72
|
|
|
73
73
|
.span-3 {
|
|
74
74
|
/* Spanning 3 of 12 columns */
|
|
75
|
-
width: 22.
|
|
75
|
+
width: 22.91667%;
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
.span-4 {
|
|
@@ -82,12 +82,12 @@
|
|
|
82
82
|
|
|
83
83
|
.span-5 {
|
|
84
84
|
/* Spanning 5 of 12 columns */
|
|
85
|
-
width: 39.
|
|
85
|
+
width: 39.58333%;
|
|
86
86
|
}
|
|
87
87
|
|
|
88
88
|
.span-6 {
|
|
89
89
|
/* Spanning 6 of 12 columns */
|
|
90
|
-
width: 47.
|
|
90
|
+
width: 47.91667%;
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
.span-7 {
|
|
@@ -97,12 +97,12 @@
|
|
|
97
97
|
|
|
98
98
|
.span-8 {
|
|
99
99
|
/* Spanning 8 of 12 columns */
|
|
100
|
-
width: 64.
|
|
100
|
+
width: 64.58333%;
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
.span-9 {
|
|
104
104
|
/* Spanning 9 of 12 columns */
|
|
105
|
-
width: 72.
|
|
105
|
+
width: 72.91667%;
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
.span-10 {
|
|
@@ -112,10 +112,10 @@
|
|
|
112
112
|
|
|
113
113
|
.span-11 {
|
|
114
114
|
/* Spanning 11 of 12 columns */
|
|
115
|
-
width: 89.
|
|
115
|
+
width: 89.58333%;
|
|
116
116
|
}
|
|
117
117
|
|
|
118
118
|
.span-12 {
|
|
119
119
|
/* Spanning 12 of 12 columns */
|
|
120
|
-
width: 97.
|
|
120
|
+
width: 97.91667%;
|
|
121
121
|
}
|
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
/* ------------------------------------------------- *
|
|
2
|
+
* Ezy Grid by Frej Raahede Nielsen
|
|
3
|
+
* http://github.com/raahede/ezy
|
|
4
|
+
* ------------------------------------------------- *
|
|
5
|
+
*/
|
|
6
|
+
/* ------------------------------------------------- *
|
|
7
|
+
* Micro Clearfix
|
|
8
|
+
* http://nicolasgallagher.com/micro-clearfix-hack/
|
|
9
|
+
*/
|
|
10
|
+
.page:before, .grid:before,
|
|
11
|
+
.page:after,
|
|
12
|
+
.grid:after {
|
|
13
|
+
content: " ";
|
|
14
|
+
display: table;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.page:after, .grid:after {
|
|
18
|
+
clear: both;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.page, .grid {
|
|
22
|
+
/**
|
|
23
|
+
* For IE 6/7 only
|
|
24
|
+
* Include this rule to trigger hasLayout and contain floats.
|
|
25
|
+
*/
|
|
26
|
+
*zoom: 1;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
/* --- End clearfix --- */
|
|
30
|
+
.page {
|
|
31
|
+
margin-left: auto;
|
|
32
|
+
margin-right: auto;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.small, .medium, .large {
|
|
36
|
+
/* Grid column base at a 12-column context */
|
|
37
|
+
margin-left: 1.38889%;
|
|
38
|
+
margin-right: 1.38889%;
|
|
39
|
+
float: left;
|
|
40
|
+
/* Fixing double margin on IE6 */
|
|
41
|
+
_display: inline;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.page {
|
|
45
|
+
max-width: 700px;
|
|
46
|
+
/* Forcing static grid on IE6 and IE7 */
|
|
47
|
+
*width: 700px;
|
|
48
|
+
padding-left: 10px;
|
|
49
|
+
padding-right: 10px;
|
|
50
|
+
}
|
|
51
|
+
@media (min-width: 720px) {
|
|
52
|
+
.page {
|
|
53
|
+
max-width: 1390px;
|
|
54
|
+
/* Forcing static grid on IE6 and IE7 */
|
|
55
|
+
*width: 1390px;
|
|
56
|
+
padding-left: 30px;
|
|
57
|
+
padding-right: 30px;
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
.no-media-queries .page {
|
|
61
|
+
/* Fallback for browsers not supporting media queries */
|
|
62
|
+
max-width: 1390px;
|
|
63
|
+
/* Forcing static grid on IE6 and IE7 */
|
|
64
|
+
*width: 1390px;
|
|
65
|
+
padding-left: 30px;
|
|
66
|
+
padding-right: 30px;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.grid {
|
|
70
|
+
margin-left: -1.42857%;
|
|
71
|
+
margin-right: -1.42857%;
|
|
72
|
+
}
|
|
73
|
+
@media (min-width: 720px) {
|
|
74
|
+
.grid {
|
|
75
|
+
margin-left: -1.79856%;
|
|
76
|
+
margin-right: -1.79856%;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
.no-media-queries .grid {
|
|
80
|
+
/* Fallback for browsers not supporting media queries */
|
|
81
|
+
margin-left: -1.79856%;
|
|
82
|
+
margin-right: -1.79856%;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.small, .medium, .large {
|
|
86
|
+
background: hotpink;
|
|
87
|
+
text-align: center;
|
|
88
|
+
zoom: 1;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.small {
|
|
92
|
+
/* Spanning 3 of 12 columns */
|
|
93
|
+
width: 22.22222%;
|
|
94
|
+
}
|
|
95
|
+
@media (min-width: 720px) {
|
|
96
|
+
.small {
|
|
97
|
+
/* Spanning 6 of 18 columns */
|
|
98
|
+
width: 29.86111%;
|
|
99
|
+
margin-left: 1.73611%;
|
|
100
|
+
margin-right: 1.73611%;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
.no-media-queries .small {
|
|
104
|
+
/* Fallback for browsers not supporting media queries */
|
|
105
|
+
/* Spanning 6 of 18 columns */
|
|
106
|
+
width: 29.86111%;
|
|
107
|
+
margin-left: 1.73611%;
|
|
108
|
+
margin-right: 1.73611%;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
.medium {
|
|
112
|
+
/* Spanning 6 of 12 columns */
|
|
113
|
+
width: 47.22222%;
|
|
114
|
+
}
|
|
115
|
+
@media (min-width: 720px) {
|
|
116
|
+
.medium {
|
|
117
|
+
/* Spanning 9 of 18 columns */
|
|
118
|
+
width: 46.52778%;
|
|
119
|
+
margin-left: 1.73611%;
|
|
120
|
+
margin-right: 1.73611%;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
.no-media-queries .medium {
|
|
124
|
+
/* Fallback for browsers not supporting media queries */
|
|
125
|
+
/* Spanning 9 of 18 columns */
|
|
126
|
+
width: 46.52778%;
|
|
127
|
+
margin-left: 1.73611%;
|
|
128
|
+
margin-right: 1.73611%;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.large {
|
|
132
|
+
/* Spanning 12 of 12 columns */
|
|
133
|
+
width: 97.22222%;
|
|
134
|
+
}
|
|
135
|
+
@media (min-width: 720px) {
|
|
136
|
+
.large {
|
|
137
|
+
/* Spanning 18 of 18 columns */
|
|
138
|
+
width: 96.52778%;
|
|
139
|
+
margin-left: 1.73611%;
|
|
140
|
+
margin-right: 1.73611%;
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
.no-media-queries .large {
|
|
144
|
+
/* Fallback for browsers not supporting media queries */
|
|
145
|
+
/* Spanning 18 of 18 columns */
|
|
146
|
+
width: 96.52778%;
|
|
147
|
+
margin-left: 1.73611%;
|
|
148
|
+
margin-right: 1.73611%;
|
|
149
|
+
}
|
|
@@ -53,6 +53,8 @@
|
|
|
53
53
|
max-width: 620px;
|
|
54
54
|
/* Forcing static grid on IE6 and IE7 */
|
|
55
55
|
*width: 620px;
|
|
56
|
+
padding-left: 10px;
|
|
57
|
+
padding-right: 10px;
|
|
56
58
|
}
|
|
57
59
|
}
|
|
58
60
|
@media (min-width: 641px) {
|
|
@@ -60,6 +62,8 @@
|
|
|
60
62
|
max-width: 940px;
|
|
61
63
|
/* Forcing static grid on IE6 and IE7 */
|
|
62
64
|
*width: 940px;
|
|
65
|
+
padding-left: 10px;
|
|
66
|
+
padding-right: 10px;
|
|
63
67
|
}
|
|
64
68
|
}
|
|
65
69
|
.no-media-queries .page {
|
|
@@ -67,28 +71,30 @@
|
|
|
67
71
|
max-width: 940px;
|
|
68
72
|
/* Forcing static grid on IE6 and IE7 */
|
|
69
73
|
*width: 940px;
|
|
74
|
+
padding-left: 10px;
|
|
75
|
+
padding-right: 10px;
|
|
70
76
|
}
|
|
71
77
|
|
|
72
78
|
.grid {
|
|
73
|
-
margin-left: -3.
|
|
74
|
-
margin-right: -3.
|
|
79
|
+
margin-left: -3.33333%;
|
|
80
|
+
margin-right: -3.33333%;
|
|
75
81
|
}
|
|
76
82
|
@media (min-width: 321px) {
|
|
77
83
|
.grid {
|
|
78
|
-
margin-left: -1.
|
|
79
|
-
margin-right: -1.
|
|
84
|
+
margin-left: -1.6129%;
|
|
85
|
+
margin-right: -1.6129%;
|
|
80
86
|
}
|
|
81
87
|
}
|
|
82
88
|
@media (min-width: 641px) {
|
|
83
89
|
.grid {
|
|
84
|
-
margin-left: -1.
|
|
85
|
-
margin-right: -1.
|
|
90
|
+
margin-left: -1.06383%;
|
|
91
|
+
margin-right: -1.06383%;
|
|
86
92
|
}
|
|
87
93
|
}
|
|
88
94
|
.no-media-queries .grid {
|
|
89
95
|
/* Fallback for browsers not supporting media queries */
|
|
90
|
-
margin-left: -1.
|
|
91
|
-
margin-right: -1.
|
|
96
|
+
margin-left: -1.06383%;
|
|
97
|
+
margin-right: -1.06383%;
|
|
92
98
|
}
|
|
93
99
|
|
|
94
100
|
.small, .medium, .large {
|
|
@@ -104,25 +110,25 @@
|
|
|
104
110
|
@media (min-width: 321px) {
|
|
105
111
|
.small {
|
|
106
112
|
/* Spanning 2 of 8 columns */
|
|
107
|
-
width: 21.
|
|
108
|
-
margin-left: 1.
|
|
109
|
-
margin-right: 1.
|
|
113
|
+
width: 21.875%;
|
|
114
|
+
margin-left: 1.5625%;
|
|
115
|
+
margin-right: 1.5625%;
|
|
110
116
|
}
|
|
111
117
|
}
|
|
112
118
|
@media (min-width: 641px) {
|
|
113
119
|
.small {
|
|
114
120
|
/* Spanning 3 of 12 columns */
|
|
115
|
-
width: 22.
|
|
116
|
-
margin-left: 1.
|
|
117
|
-
margin-right: 1.
|
|
121
|
+
width: 22.91667%;
|
|
122
|
+
margin-left: 1.04167%;
|
|
123
|
+
margin-right: 1.04167%;
|
|
118
124
|
}
|
|
119
125
|
}
|
|
120
126
|
.no-media-queries .small {
|
|
121
127
|
/* Fallback for browsers not supporting media queries */
|
|
122
128
|
/* Spanning 3 of 12 columns */
|
|
123
|
-
width: 22.
|
|
124
|
-
margin-left: 1.
|
|
125
|
-
margin-right: 1.
|
|
129
|
+
width: 22.91667%;
|
|
130
|
+
margin-left: 1.04167%;
|
|
131
|
+
margin-right: 1.04167%;
|
|
126
132
|
}
|
|
127
133
|
|
|
128
134
|
.medium {
|
|
@@ -132,25 +138,25 @@
|
|
|
132
138
|
@media (min-width: 321px) {
|
|
133
139
|
.medium {
|
|
134
140
|
/* Spanning 4 of 8 columns */
|
|
135
|
-
width: 46.
|
|
136
|
-
margin-left: 1.
|
|
137
|
-
margin-right: 1.
|
|
141
|
+
width: 46.875%;
|
|
142
|
+
margin-left: 1.5625%;
|
|
143
|
+
margin-right: 1.5625%;
|
|
138
144
|
}
|
|
139
145
|
}
|
|
140
146
|
@media (min-width: 641px) {
|
|
141
147
|
.medium {
|
|
142
148
|
/* Spanning 6 of 12 columns */
|
|
143
|
-
width: 47.
|
|
144
|
-
margin-left: 1.
|
|
145
|
-
margin-right: 1.
|
|
149
|
+
width: 47.91667%;
|
|
150
|
+
margin-left: 1.04167%;
|
|
151
|
+
margin-right: 1.04167%;
|
|
146
152
|
}
|
|
147
153
|
}
|
|
148
154
|
.no-media-queries .medium {
|
|
149
155
|
/* Fallback for browsers not supporting media queries */
|
|
150
156
|
/* Spanning 6 of 12 columns */
|
|
151
|
-
width: 47.
|
|
152
|
-
margin-left: 1.
|
|
153
|
-
margin-right: 1.
|
|
157
|
+
width: 47.91667%;
|
|
158
|
+
margin-left: 1.04167%;
|
|
159
|
+
margin-right: 1.04167%;
|
|
154
160
|
}
|
|
155
161
|
|
|
156
162
|
.large {
|
|
@@ -160,23 +166,23 @@
|
|
|
160
166
|
@media (min-width: 321px) {
|
|
161
167
|
.large {
|
|
162
168
|
/* Spanning 8 of 8 columns */
|
|
163
|
-
width: 96.
|
|
164
|
-
margin-left: 1.
|
|
165
|
-
margin-right: 1.
|
|
169
|
+
width: 96.875%;
|
|
170
|
+
margin-left: 1.5625%;
|
|
171
|
+
margin-right: 1.5625%;
|
|
166
172
|
}
|
|
167
173
|
}
|
|
168
174
|
@media (min-width: 641px) {
|
|
169
175
|
.large {
|
|
170
176
|
/* Spanning 12 of 12 columns */
|
|
171
|
-
width: 97.
|
|
172
|
-
margin-left: 1.
|
|
173
|
-
margin-right: 1.
|
|
177
|
+
width: 97.91667%;
|
|
178
|
+
margin-left: 1.04167%;
|
|
179
|
+
margin-right: 1.04167%;
|
|
174
180
|
}
|
|
175
181
|
}
|
|
176
182
|
.no-media-queries .large {
|
|
177
183
|
/* Fallback for browsers not supporting media queries */
|
|
178
184
|
/* Spanning 12 of 12 columns */
|
|
179
|
-
width: 97.
|
|
180
|
-
margin-left: 1.
|
|
181
|
-
margin-right: 1.
|
|
185
|
+
width: 97.91667%;
|
|
186
|
+
margin-left: 1.04167%;
|
|
187
|
+
margin-right: 1.04167%;
|
|
182
188
|
}
|