responder 0.1.1 → 0.2

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.
Files changed (11) hide show
  1. data/README.md +10 -2
  2. data/lib/responder/version.rb +1 -1
  3. data/scss/responder/_respond-to-retina.scss +14 -0
  4. data/scss/responder/_respond-to.scss +104 -24
  5. data/scss/responder/functions.scss +2 -0
  6. data/scss/responder.scss +1 -0
  7. data/test/css/style-old-ie.css +1 -1
  8. data/test/css/style.css +37 -22
  9. data/test/index.html +19 -0
  10. data/test/scss/style.scss +6 -0
  11. metadata +62 -71
data/README.md CHANGED
@@ -106,7 +106,15 @@ Given the example breakpoint list above, `respond-to(mobile-only)` will output t
106
106
 
107
107
  You can create as many breakpoints as you need for each group. It's that simple.
108
108
 
109
- ### 3. Mobile first & Old IE
109
+ ### 3. Retina displays
110
+
111
+ Target retina displays very easely using Responder's future proof media query.
112
+
113
+ @include respond-to(retina) {
114
+ // retina sharpness goes here
115
+ }
116
+
117
+ ### 4. Mobile first & Old IE
110
118
 
111
119
  If you're designing your site "mobile first" and prefer to serve a separate CSS to browsers that don't support media queries (IE8 and below), Responder gets you covered!
112
120
 
@@ -170,5 +178,5 @@ The resulting old-ie.css is:
170
178
 
171
179
  ## What's next?
172
180
 
173
- - Support for more media features (height, device-dimensions, orientation, retina displays, …)
181
+ - Support for more media features (height, device-dimensions, orientation, …)
174
182
  - Combined media queries? _e.g. respond-to(mobile-only && retina)_
data/lib/responder/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Responder
2
- VERSION = "0.1.1"
2
+ VERSION = "0.2"
3
3
  end
data/scss/responder/_respond-to-retina.scss ADDED
@@ -0,0 +1,14 @@
1
+ // =============================================================================
2
+ // Respond to retina
3
+ // =============================================================================
4
+
5
+ @mixin respond-to-retina {
6
+ @media
7
+ only screen and (-webkit-min-device-pixel-ratio: 1.5),
8
+ only screen and ( min--moz-device-pixel-ratio: 1.5),
9
+ only screen and ( -o-min-device-pixel-ratio: 3/2),
10
+ only screen and ( min-device-pixel-ratio: 2),
11
+ only screen and ( min-resolution: 1.5dppx) {
12
+ @content;
13
+ }
14
+ }
data/scss/responder/_respond-to.scss CHANGED
@@ -1,15 +1,33 @@
1
1
  // =============================================================================
2
2
  // Respond-to mixin
3
+ //
4
+ // Table of contents:
5
+ // 1. Get breakpoint info
6
+ // 2. respond-to(ie)
7
+ // 3. respond-to(retina)
8
+ // 4. respond-to($breakpoint)
9
+ // 4.1. Old-IE support
10
+ // 4.2. Breakpoints and groups
11
+ // 5. respond-to min and max mixins
12
+ //
3
13
  // =============================================================================
4
14
 
5
15
  @mixin respond-to($breakpoint) {
6
16
 
17
+ // =============================================================================
18
+ // 1. Get breakpoint info
19
+ // =============================================================================
20
+
7
21
  $breakpoint-info: getBreakpointInfo($breakpoint);
8
22
 
9
23
  // Breakpoint info error
10
24
  @if $breakpoint-info == 'error' {
11
25
  @warn '[ERROR] Invalid breakpoint parameter';
12
26
 
27
+ // =============================================================================
28
+ // 2. respond-to(ie)
29
+ // =============================================================================
30
+
13
31
  // Respond to IE
14
32
  } @else if $breakpoint-info == 'ie' {
15
33
  // Only print content if support is true
@@ -17,6 +35,20 @@
17
35
  @content;
18
36
  }
19
37
 
38
+ // =============================================================================
39
+ // 3. respond-to(retina)
40
+ // =============================================================================
41
+
42
+ // Respond to retina displays
43
+ } @else if $breakpoint-info == 'retina' {
44
+ @if $old-ie-support != true { // should not compile on Old-IE stylesheets
45
+ @include respond-to-retina { @content; }
46
+ }
47
+
48
+ // =============================================================================
49
+ // 4. respond-to($breakpoint)
50
+ // =============================================================================
51
+
20
52
  } @else {
21
53
 
22
54
  $breakpoint-name: nth($breakpoint-info, 1);
@@ -27,6 +59,10 @@
27
59
  $min-width: 0;
28
60
  $max-width: 0;
29
61
 
62
+ // =============================================================================
63
+ // 4.1. Old IE support
64
+ // =============================================================================
65
+
30
66
  @if $old-ie-support == true {
31
67
 
32
68
  @if yepnope($breakpoint-names, $old-ie-breakpoint) {
@@ -34,6 +70,7 @@
34
70
  // Get the value of the old-ie breakpoint
35
71
  $old-ie-breakpoint-value: nth($breakpoint-values, index($breakpoint-names, $old-ie-breakpoint));
36
72
 
73
+ // Don't know why this prevents throwing an error :S
37
74
  $breakpoint-value: null;
38
75
 
39
76
  @if $breakpoint-group == true {
@@ -47,47 +84,90 @@
47
84
  // Check if the media query should respond
48
85
  @if $breakpoint-extend == 'only' and $breakpoint-value == $old-ie-breakpoint-value {
49
86
  @content;
50
- } @else if $breakpoint-extend == 'and-up' and $old-ie-breakpoint-value >= $breakpoint-value{
87
+ } @else if $breakpoint-extend == 'and-up' and $old-ie-breakpoint-value >= $breakpoint-value {
51
88
  @content;
52
89
  } @else if $breakpoint-extend == 'and-below' and $old-ie-breakpoint-value <= $breakpoint-value {
53
90
  @content;
54
91
  }
55
92
  } @else {
56
- // Invlaid $old-ie-breakpoint value
93
+ // Invalid $old-ie-breakpoint value
57
94
  @warn "[ERROR] "+ $old-ie-breakpoint +" is not a valid breakpoint name for $old-ie-breakpoint. Valid breakpoint names are: "+ $breakpoint-names
58
95
  }
59
96
 
97
+ // =============================================================================
98
+ // 4.2. Breakpoints and groups
99
+ // =============================================================================
60
100
 
61
101
  } @else {
102
+ $breakpoint-name: nth($breakpoint-info, 1);
103
+ $breakpoint-extend: nth($breakpoint-info, 2);
104
+ $breakpoint-group: nth($breakpoint-info, 3);
105
+ $breakpoint-group-id: nth($breakpoint-info, 4);
62
106
 
63
- // If it's a regular breakpoint
64
- @if $breakpoint-group == false {
65
- $min-width: nth($breakpoint-values, index($breakpoint-names, $breakpoint-name));
107
+ $min-width: 0;
108
+ $max-width: 0;
66
109
 
67
- // Only set a max-width if it's not the last breakpoint
68
- @if (index($breakpoint-names, $breakpoint-name) + 1) <= length($breakpoint-values) {
69
- $max-width: nth($breakpoint-values, (index($breakpoint-names, $breakpoint-name) + 1));
70
- } @else {
71
- @if $breakpoint-extend == and-below {
72
- $max-width: nth($breakpoint-values, (index($breakpoint-names, $breakpoint-name)));
110
+ @if $old-ie-support == true {
111
+ @if $breakpoint-name == $old-ie-breakpoint or $breakpoint-name == $old-ie-breakpoint {
112
+ @content;
113
+ }
114
+ } @else {
115
+
116
+ // If it's a regular breakpoint
117
+ @if $breakpoint-group == false {
118
+ $min-width: nth($breakpoint-values, index($breakpoint-names, $breakpoint-name));
119
+
120
+ // Only set a max-width if it's not the last breakpoint
121
+ @if (index($breakpoint-names, $breakpoint-name) + 1) <= length($breakpoint-values) {
122
+ $max-width: nth($breakpoint-values, (index($breakpoint-names, $breakpoint-name) + 1));
73
123
  } @else {
74
- $breakpoint-extend: and-up;
124
+ @if $breakpoint-extend == and-below {
125
+ $max-width: nth($breakpoint-values, (index($breakpoint-names, $breakpoint-name)));
126
+ } @else {
127
+ $breakpoint-extend: and-up;
128
+ }
75
129
  }
76
- }
77
130
 
78
- // If it's a breakpoint group
79
- } @else {
80
- $min-width: nth( nth($breakpoint-groups, $breakpoint-group-id), 2);
81
- $max-width: nth( nth($breakpoint-groups, $breakpoint-group-id), 3);
82
- }
131
+ // If it's a breakpoint group
132
+ } @else {
133
+ $min-width: nth( nth($breakpoint-groups, $breakpoint-group-id), 2);
134
+ $max-width: nth( nth($breakpoint-groups, $breakpoint-group-id), 3);
135
+ }
83
136
 
84
- @if $breakpoint-extend == only {
85
- @media #{$responder-media-type} and (min-width: getSize($min-width)) and (max-width: getSize($max-width - 1)) { @content; }
86
- } @else if $breakpoint-extend == and-up {
87
- @media #{$responder-media-type} and (min-width: getSize($min-width)) { @content; }
88
- } @else if $breakpoint-extend == and-below {
89
- @media #{$responder-media-type} and (max-width: getSize($max-width - 1)) { @content; }
137
+ @if $breakpoint-extend == only {
138
+ @include respond-to-min-and-max-width($min-width, $max-width){ @content };
139
+ } @else if $breakpoint-extend == and-up {
140
+ @include respond-to-min-width($min-width){ @content };
141
+ } @else if $breakpoint-extend == and-below {
142
+ @include respond-to-max-width($max-width){ @content };
143
+ }
90
144
  }
91
145
  }
92
146
  }
93
147
  }
148
+
149
+ // =============================================================================
150
+ // 5. respond-to min and max mixins
151
+ // =============================================================================
152
+
153
+ @mixin respond-to-min-and-max-width($min-width, $max-width) {
154
+ @media only #{$responder-media-type}
155
+ and (min-width: getSize($min-width))
156
+ and (max-width: getSize($max-width - 1)) {
157
+ @content;
158
+ }
159
+ }
160
+
161
+ @mixin respond-to-min-width($min-width) {
162
+ @media only #{$responder-media-type}
163
+ and (min-width: getSize($min-width)) {
164
+ @content;
165
+ }
166
+ }
167
+
168
+ @mixin respond-to-max-width($max-width) {
169
+ @media only #{$responder-media-type}
170
+ and (max-width: getSize($max-width - 1)) {
171
+ @content;
172
+ }
173
+ }
data/scss/responder/functions.scss CHANGED
@@ -105,6 +105,8 @@
105
105
 
106
106
  @if $breakpoint == ie {
107
107
  @return ie;
108
+ } @else if $breakpoint == retina {
109
+ @return retina;
108
110
  } @else {
109
111
 
110
112
  // capture the extension (only, and-up or and-below)
data/scss/responder.scss CHANGED
@@ -15,6 +15,7 @@
15
15
 
16
16
  @import 'compass';
17
17
  @import 'responder/respond-to';
18
+ @import 'responder/respond-to-retina';
18
19
  @import 'responder/functions';
19
20
 
20
21
  // =============================================================================
data/test/css/style-old-ie.css CHANGED
@@ -171,7 +171,7 @@ tr > td:first-child {
171
171
  .mq-mixins-test tbody .respond-to-desktop-and-below .isInactive {
172
172
  display: none;
173
173
  }
174
- /* line 71, ../scss/style.scss */
174
+ /* line 77, ../scss/style.scss */
175
175
  .mq-mixins-test tbody .respond-to-ie {
176
176
  background: #a7e040;
177
177
  color: white;
data/test/css/style.css CHANGED
@@ -2,7 +2,7 @@
2
2
  body {
3
3
  font: 16px/21px "Helvetica Neue", Arial, sans-serif;
4
4
  }
5
- @media screen and (min-width: 20em) and (max-width: 37.4375em) {
5
+ @media only screen and (min-width: 20em) and (max-width: 37.4375em) {
6
6
  /* line 17, ../scss/style.scss */
7
7
  body {
8
8
  font-size: 95%;
@@ -34,7 +34,7 @@ tr > td:first-child {
34
34
  .mq-mixins-test tbody .response-example .isResponding {
35
35
  display: none;
36
36
  }
37
- @media screen and (min-width: 20em) and (max-width: 37.4375em) {
37
+ @media only screen and (min-width: 20em) and (max-width: 37.4375em) {
38
38
  /* line 63, ../scss/style.scss */
39
39
  .mq-mixins-test tbody .respond-to-mobile-only {
40
40
  background: #a7e040;
@@ -49,7 +49,7 @@ tr > td:first-child {
49
49
  display: none;
50
50
  }
51
51
  }
52
- @media screen and (min-width: 20em) {
52
+ @media only screen and (min-width: 20em) {
53
53
  /* line 63, ../scss/style.scss */
54
54
  .mq-mixins-test tbody .respond-to-mobile-and-up {
55
55
  background: #a7e040;
@@ -64,7 +64,7 @@ tr > td:first-child {
64
64
  display: none;
65
65
  }
66
66
  }
67
- @media screen and (max-width: 37.4375em) {
67
+ @media only screen and (max-width: 37.4375em) {
68
68
  /* line 63, ../scss/style.scss */
69
69
  .mq-mixins-test tbody .respond-to-mobile-and-below {
70
70
  background: #a7e040;
@@ -79,7 +79,7 @@ tr > td:first-child {
79
79
  display: none;
80
80
  }
81
81
  }
82
- @media screen and (min-width: 20em) and (max-width: 29.9375em) {
82
+ @media only screen and (min-width: 20em) and (max-width: 29.9375em) {
83
83
  /* line 63, ../scss/style.scss */
84
84
  .mq-mixins-test tbody .respond-to-mobile-portrait-only {
85
85
  background: #a7e040;
@@ -94,7 +94,7 @@ tr > td:first-child {
94
94
  display: none;
95
95
  }
96
96
  }
97
- @media screen and (min-width: 20em) {
97
+ @media only screen and (min-width: 20em) {
98
98
  /* line 63, ../scss/style.scss */
99
99
  .mq-mixins-test tbody .respond-to-mobile-portrait-and-up {
100
100
  background: #a7e040;
@@ -109,7 +109,7 @@ tr > td:first-child {
109
109
  display: none;
110
110
  }
111
111
  }
112
- @media screen and (max-width: 29.9375em) {
112
+ @media only screen and (max-width: 29.9375em) {
113
113
  /* line 63, ../scss/style.scss */
114
114
  .mq-mixins-test tbody .respond-to-mobile-portrait-and-below {
115
115
  background: #a7e040;
@@ -124,7 +124,7 @@ tr > td:first-child {
124
124
  display: none;
125
125
  }
126
126
  }
127
- @media screen and (min-width: 30em) and (max-width: 37.4375em) {
127
+ @media only screen and (min-width: 30em) and (max-width: 37.4375em) {
128
128
  /* line 63, ../scss/style.scss */
129
129
  .mq-mixins-test tbody .respond-to-mobile-landscape-only {
130
130
  background: #a7e040;
@@ -139,7 +139,7 @@ tr > td:first-child {
139
139
  display: none;
140
140
  }
141
141
  }
142
- @media screen and (min-width: 30em) {
142
+ @media only screen and (min-width: 30em) {
143
143
  /* line 63, ../scss/style.scss */
144
144
  .mq-mixins-test tbody .respond-to-mobile-landscape-and-up {
145
145
  background: #a7e040;
@@ -154,7 +154,7 @@ tr > td:first-child {
154
154
  display: none;
155
155
  }
156
156
  }
157
- @media screen and (max-width: 37.4375em) {
157
+ @media only screen and (max-width: 37.4375em) {
158
158
  /* line 63, ../scss/style.scss */
159
159
  .mq-mixins-test tbody .respond-to-mobile-landscape-and-below {
160
160
  background: #a7e040;
@@ -169,7 +169,7 @@ tr > td:first-child {
169
169
  display: none;
170
170
  }
171
171
  }
172
- @media screen and (min-width: 37.5em) and (max-width: 61.9375em) {
172
+ @media only screen and (min-width: 37.5em) and (max-width: 61.9375em) {
173
173
  /* line 63, ../scss/style.scss */
174
174
  .mq-mixins-test tbody .respond-to-tablet-only {
175
175
  background: #a7e040;
@@ -184,7 +184,7 @@ tr > td:first-child {
184
184
  display: none;
185
185
  }
186
186
  }
187
- @media screen and (min-width: 37.5em) {
187
+ @media only screen and (min-width: 37.5em) {
188
188
  /* line 63, ../scss/style.scss */
189
189
  .mq-mixins-test tbody .respond-to-tablet-and-up {
190
190
  background: #a7e040;
@@ -199,7 +199,7 @@ tr > td:first-child {
199
199
  display: none;
200
200
  }
201
201
  }
202
- @media screen and (max-width: 61.9375em) {
202
+ @media only screen and (max-width: 61.9375em) {
203
203
  /* line 63, ../scss/style.scss */
204
204
  .mq-mixins-test tbody .respond-to-tablet-and-below {
205
205
  background: #a7e040;
@@ -214,7 +214,7 @@ tr > td:first-child {
214
214
  display: none;
215
215
  }
216
216
  }
217
- @media screen and (min-width: 37.5em) and (max-width: 47.9375em) {
217
+ @media only screen and (min-width: 37.5em) and (max-width: 47.9375em) {
218
218
  /* line 63, ../scss/style.scss */
219
219
  .mq-mixins-test tbody .respond-to-tablet-portrait-only {
220
220
  background: #a7e040;
@@ -229,7 +229,7 @@ tr > td:first-child {
229
229
  display: none;
230
230
  }
231
231
  }
232
- @media screen and (min-width: 37.5em) {
232
+ @media only screen and (min-width: 37.5em) {
233
233
  /* line 63, ../scss/style.scss */
234
234
  .mq-mixins-test tbody .respond-to-tablet-portrait-and-up {
235
235
  background: #a7e040;
@@ -244,7 +244,7 @@ tr > td:first-child {
244
244
  display: none;
245
245
  }
246
246
  }
247
- @media screen and (max-width: 47.9375em) {
247
+ @media only screen and (max-width: 47.9375em) {
248
248
  /* line 63, ../scss/style.scss */
249
249
  .mq-mixins-test tbody .respond-to-tablet-portrait-and-below {
250
250
  background: #a7e040;
@@ -259,7 +259,7 @@ tr > td:first-child {
259
259
  display: none;
260
260
  }
261
261
  }
262
- @media screen and (min-width: 48em) and (max-width: 61.9375em) {
262
+ @media only screen and (min-width: 48em) and (max-width: 61.9375em) {
263
263
  /* line 63, ../scss/style.scss */
264
264
  .mq-mixins-test tbody .respond-to-tablet-landscape-only {
265
265
  background: #a7e040;
@@ -274,7 +274,7 @@ tr > td:first-child {
274
274
  display: none;
275
275
  }
276
276
  }
277
- @media screen and (min-width: 48em) {
277
+ @media only screen and (min-width: 48em) {
278
278
  /* line 63, ../scss/style.scss */
279
279
  .mq-mixins-test tbody .respond-to-tablet-landscape-and-up {
280
280
  background: #a7e040;
@@ -289,7 +289,7 @@ tr > td:first-child {
289
289
  display: none;
290
290
  }
291
291
  }
292
- @media screen and (max-width: 61.9375em) {
292
+ @media only screen and (max-width: 61.9375em) {
293
293
  /* line 63, ../scss/style.scss */
294
294
  .mq-mixins-test tbody .respond-to-tablet-landscape-and-below {
295
295
  background: #a7e040;
@@ -304,7 +304,7 @@ tr > td:first-child {
304
304
  display: none;
305
305
  }
306
306
  }
307
- @media screen and (min-width: 62em) {
307
+ @media only screen and (min-width: 62em) {
308
308
  /* line 63, ../scss/style.scss */
309
309
  .mq-mixins-test tbody .respond-to-desktop-only {
310
310
  background: #a7e040;
@@ -319,7 +319,7 @@ tr > td:first-child {
319
319
  display: none;
320
320
  }
321
321
  }
322
- @media screen and (min-width: 62em) {
322
+ @media only screen and (min-width: 62em) {
323
323
  /* line 63, ../scss/style.scss */
324
324
  .mq-mixins-test tbody .respond-to-desktop-and-up {
325
325
  background: #a7e040;
@@ -334,7 +334,7 @@ tr > td:first-child {
334
334
  display: none;
335
335
  }
336
336
  }
337
- @media screen and (max-width: 61.9375em) {
337
+ @media only screen and (max-width: 61.9375em) {
338
338
  /* line 63, ../scss/style.scss */
339
339
  .mq-mixins-test tbody .respond-to-desktop-and-below {
340
340
  background: #a7e040;
@@ -349,3 +349,18 @@ tr > td:first-child {
349
349
  display: none;
350
350
  }
351
351
  }
352
+ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 1.5dppx) {
353
+ /* line 71, ../scss/style.scss */
354
+ .mq-mixins-test tbody .respond-to-retina {
355
+ background: #a7e040;
356
+ color: white;
357
+ }
358
+ /* line 41, ../scss/style.scss */
359
+ .mq-mixins-test tbody .respond-to-retina .isResponding {
360
+ display: inline;
361
+ }
362
+ /* line 42, ../scss/style.scss */
363
+ .mq-mixins-test tbody .respond-to-retina .isInactive {
364
+ display: none;
365
+ }
366
+ }
data/test/index.html CHANGED
@@ -159,6 +159,25 @@
159
159
 
160
160
  <hr>
161
161
 
162
+ <h3>Retina displays</h3>
163
+
164
+ <table class="mq-mixins-test">
165
+ <thead>
166
+ <tr>
167
+ <th>Mixin</th>
168
+ <th>Response</th>
169
+ </tr>
170
+ </thead>
171
+ <tbody>
172
+ <tr>
173
+ <td><code class="language-css">respond-to(retina)</code></td>
174
+ <td class="response-example respond-to-retina"><span class="isInactive">inactive</span> <span class="isResponding">responding</span></td>
175
+ </tr>
176
+ </tbody>
177
+ </table>
178
+
179
+ <hr>
180
+
162
181
  <h3>Old IE</h3>
163
182
 
164
183
  <table class="mq-mixins-test">
data/test/scss/style.scss CHANGED
@@ -68,6 +68,12 @@ tr > td:first-child { width: 80%; }
68
68
  }
69
69
  }
70
70
 
71
+ .respond-to-retina {
72
+ @include respond-to('retina') {
73
+ @include is-responding;
74
+ }
75
+ }
76
+
71
77
  .respond-to-ie {
72
78
  @include respond-to(ie) {
73
79
  @include is-responding;
metadata CHANGED
@@ -1,78 +1,71 @@
1
- --- !ruby/object:Gem::Specification
1
+ --- !ruby/object:Gem::Specification
2
2
  name: responder
3
- version: !ruby/object:Gem::Version
4
- hash: 25
3
+ version: !ruby/object:Gem::Version
4
+ version: '0.2'
5
5
  prerelease:
6
- segments:
7
- - 0
8
- - 1
9
- - 1
10
- version: 0.1.1
11
6
  platform: ruby
12
- authors:
7
+ authors:
13
8
  - Daniel Guillan
14
9
  autorequire:
15
10
  bindir: bin
16
11
  cert_chain: []
17
-
18
- date: 2012-11-21 00:00:00 Z
19
- dependencies:
20
- - !ruby/object:Gem::Dependency
12
+ date: 2012-11-24 00:00:00.000000000 Z
13
+ dependencies:
14
+ - !ruby/object:Gem::Dependency
21
15
  name: sass
22
- prerelease: false
23
- requirement: &id001 !ruby/object:Gem::Requirement
16
+ requirement: !ruby/object:Gem::Requirement
24
17
  none: false
25
- requirements:
26
- - - ">="
27
- - !ruby/object:Gem::Version
28
- hash: 15
29
- segments:
30
- - 3
31
- - 2
32
- - 0
18
+ requirements:
19
+ - - ! '>='
20
+ - !ruby/object:Gem::Version
33
21
  version: 3.2.0
34
22
  type: :runtime
35
- version_requirements: *id001
36
- - !ruby/object:Gem::Dependency
37
- name: compass
38
23
  prerelease: false
39
- requirement: &id002 !ruby/object:Gem::Requirement
24
+ version_requirements: !ruby/object:Gem::Requirement
25
+ none: false
26
+ requirements:
27
+ - - ! '>='
28
+ - !ruby/object:Gem::Version
29
+ version: 3.2.0
30
+ - !ruby/object:Gem::Dependency
31
+ name: compass
32
+ requirement: !ruby/object:Gem::Requirement
40
33
  none: false
41
- requirements:
42
- - - ">="
43
- - !ruby/object:Gem::Version
44
- hash: 43
45
- segments:
46
- - 0
47
- - 12
48
- - 2
34
+ requirements:
35
+ - - ! '>='
36
+ - !ruby/object:Gem::Version
49
37
  version: 0.12.2
50
38
  type: :runtime
51
- version_requirements: *id002
52
- - !ruby/object:Gem::Dependency
53
- name: rake
54
39
  prerelease: false
55
- requirement: &id003 !ruby/object:Gem::Requirement
40
+ version_requirements: !ruby/object:Gem::Requirement
56
41
  none: false
57
- requirements:
58
- - - ">="
59
- - !ruby/object:Gem::Version
60
- hash: 3
61
- segments:
62
- - 0
63
- version: "0"
42
+ requirements:
43
+ - - ! '>='
44
+ - !ruby/object:Gem::Version
45
+ version: 0.12.2
46
+ - !ruby/object:Gem::Dependency
47
+ name: rake
48
+ requirement: !ruby/object:Gem::Requirement
49
+ none: false
50
+ requirements:
51
+ - - ! '>='
52
+ - !ruby/object:Gem::Version
53
+ version: '0'
64
54
  type: :runtime
65
- version_requirements: *id003
55
+ prerelease: false
56
+ version_requirements: !ruby/object:Gem::Requirement
57
+ none: false
58
+ requirements:
59
+ - - ! '>='
60
+ - !ruby/object:Gem::Version
61
+ version: '0'
66
62
  description: Magic media queries for your Compass project
67
- email:
63
+ email:
68
64
  - daniel.guillan@gmail.com
69
65
  executables: []
70
-
71
66
  extensions: []
72
-
73
67
  extra_rdoc_files: []
74
-
75
- files:
68
+ files:
76
69
  - .gitignore
77
70
  - Gemfile
78
71
  - LICENSE.txt
@@ -82,6 +75,7 @@ files:
82
75
  - lib/responder/version.rb
83
76
  - responder.gemspec
84
77
  - scss/responder.scss
78
+ - scss/responder/_respond-to-retina.scss
85
79
  - scss/responder/_respond-to.scss
86
80
  - scss/responder/functions.scss
87
81
  - test/config.rb
@@ -92,38 +86,35 @@ files:
92
86
  - test/scss/style.scss
93
87
  homepage: http://github.com/danielguillan/responder
94
88
  licenses: []
95
-
96
89
  post_install_message:
97
90
  rdoc_options: []
98
-
99
- require_paths:
91
+ require_paths:
100
92
  - lib
101
- required_ruby_version: !ruby/object:Gem::Requirement
93
+ required_ruby_version: !ruby/object:Gem::Requirement
102
94
  none: false
103
- requirements:
104
- - - ">="
105
- - !ruby/object:Gem::Version
106
- hash: 3
107
- segments:
95
+ requirements:
96
+ - - ! '>='
97
+ - !ruby/object:Gem::Version
98
+ version: '0'
99
+ segments:
108
100
  - 0
109
- version: "0"
110
- required_rubygems_version: !ruby/object:Gem::Requirement
101
+ hash: -2604048285855589836
102
+ required_rubygems_version: !ruby/object:Gem::Requirement
111
103
  none: false
112
- requirements:
113
- - - ">="
114
- - !ruby/object:Gem::Version
115
- hash: 3
116
- segments:
104
+ requirements:
105
+ - - ! '>='
106
+ - !ruby/object:Gem::Version
107
+ version: '0'
108
+ segments:
117
109
  - 0
118
- version: "0"
110
+ hash: -2604048285855589836
119
111
  requirements: []
120
-
121
112
  rubyforge_project:
122
113
  rubygems_version: 1.8.24
123
114
  signing_key:
124
115
  specification_version: 3
125
116
  summary: Magic media queries for your Compass project
126
- test_files:
117
+ test_files:
127
118
  - test/config.rb
128
119
  - test/css/style-old-ie.css
129
120
  - test/css/style.css